javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-15 19:26:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add dialogs test page.

Browse Source
This commit is contained in:
Vasil Chimev
2015-07-10 11:09:04 +03:00
parent a934c4c407
commit 70a97b1451
6 changed files with 117 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
CrossPlatformModules.csproj
View File

@ -212,6 +212,10 @@
<DependentUpon>xmlbasics.xml</DependentUpon>
</TypeScriptCompile>
<TypeScriptCompile Include="apps\ui-tests-app\bindings\basics.ts" />
<TypeScriptCompile Include="apps\ui-tests-app\dialogs\dialogs.ts">
<DependentUpon>dialogs.xml</DependentUpon>
</TypeScriptCompile>
<TypeScriptCompile Include="apps\ui-tests-app\dialogs\view-model.ts" />
<TypeScriptCompile Include="apps\ui-tests-app\layouts\absolute.ts" />
<TypeScriptCompile Include="apps\ui-tests-app\layouts\dock.ts" />
<TypeScriptCompile Include="apps\ui-tests-app\layouts\grid.ts" />
@ -709,6 +713,7 @@
<Content Include="apps\tests\xml-declaration\mymodulewithxml\MyControl.css" />
<Content Include="apps\tests\xml-declaration\mymodule\MyControl.css" />
<Content Include="apps\ui-tests-app\bindings\xmlbasics.xml" />
<Content Include="apps\ui-tests-app\dialogs\dialogs.xml" />
<Content Include="apps\ui-tests-app\layouts\absolute.xml" />
<Content Include="apps\ui-tests-app\layouts\dock.xml" />
<Content Include="apps\ui-tests-app\layouts\grid.xml" />

10
apps/ui-tests-app/dialogs/dialogs.ts Normal file
View File

@ -0,0 +1,10 @@
import pages = require("ui/page");
import observable = require("data/observable");
import vmModule = require("./view-model");
var viewModel = vmModule.settingsViewModel;
export function pageLoaded(args: observable.EventData) {
var page = <pages.Page>args.object;
page.bindingContext = viewModel;
}

10
apps/ui-tests-app/dialogs/dialogs.xml Normal file
View File

@ -0,0 +1,10 @@
<Page loaded="pageLoaded">
<StackLayout>
<Label text="{{ name }}" style="text-align:center;" />
<Button text="action" tap="{{ actionName }}" />
<Button text="alert" tap="{{ alertName }}" />
<Button text="confirm" tap="{{ confirmName }}" />
<Button text="login" tap="{{ loginName }}" />
<Button text="prompt" tap="{{ promptName }}" />
</StackLayout>
</Page>

90
apps/ui-tests-app/dialogs/view-model.ts Normal file
View File

@ -0,0 +1,90 @@
import dialogs = require("ui/dialogs");
import observable = require("data/observable");
import appSettings = require("application-settings");
var name = "Harold Finch";
export class SettingsViewModel extends observable.Observable {
get name(): string {
return name;
}
set name(value: string) {
name = value;
}
public actionName(args: observable.EventData) {
dialogs.action({
message: "Change the name?",
cancelButtonText: "Close",
actions: ["Yes", "No"]
}).then((actionResult) => {
console.log("### Result: " + actionResult);
if (actionResult === "Yes") {
this.set("name", "John Reese");
}
});
}
public alertName(args: observable.EventData) {
dialogs.alert({
title: "Name",
message: "The name will change.",
okButtonText: "OK"
}).then((alertResult) => {
console.log("### Result: " + alertResult);
this.set("name", "John Reese");
});
}
public confirmName(args: observable.EventData) {
dialogs.confirm({
title: "Name",
message: "Do you want to change the name?",
cancelButtonText: "No",
neutralButtonText: "Ignore",
okButtonText: "Yes"
}).then((confirmResult) => {
console.log("### Result: " + confirmResult);
if (confirmResult) {
this.set("name", "John Reese");
}
});
}
public loginName(args: observable.EventData) {
dialogs.login({
title: "Name",
message: "Enter name:",
cancelButtonText: "Cancel",
neutralButtonText: "Ignore",
okButtonText: "OK",
userName: "John",
password: "Reese"
}).then((loginResult) => {
console.log("### Result: " + loginResult.result + ", UserName: " + loginResult.userName + ", Password: " + loginResult.password);
if (loginResult.result) {
this.set("name", loginResult.userName + " " + loginResult.password);
}
});
}
public promptName(args: observable.EventData) {
dialogs.prompt({
title: "Name",
message: "Enter name:",
cancelButtonText: "Cancel",
neutralButtonText: "Ignore",
okButtonText: "OK",
defaultText: "John Reese",
inputType: dialogs.inputType.text
}).then((promptResult) => {
console.log("### Result: " + promptResult.result + ", Text: " + promptResult.text);
if (promptResult.result) {
this.set("name", promptResult.text);
}
});
}
}
export var settingsViewModel = new SettingsViewModel();

2
apps/ui-tests-app/mainPage.ts
View File

@ -10,7 +10,7 @@ import trace = require("trace");
trace.enable();
trace.setCategories(trace.categories.Test);
var list: string[] = ["pages", "layouts", "modal-view", "bindings"];
var list: string[] = ["pages", "layouts", "modal-view", "bindings", "dialogs"];
// basePath is auto-changed when building multiple apps
var basePath = "";

1
apps/ui-tests-app/pages/background.xml
View File

@ -22,6 +22,7 @@
<Button width="50" height="50" text="4.4" tap="applyTap" tag="margin: 20; background-image: url('~/pages/test2.png'); background-repeat:no-repeat; background-position: left bottom;"/>
<Button width="50" height="50" text="4.5" tap="applyTap" tag="margin: 20; background-image: url('~/pages/test2.png'); background-repeat:no-repeat; background-position: 20% 80%;"/>
<Button width="50" height="50" text="4.6" tap="applyTap" tag="margin: 20; background-image: url('~/pages/test2.png'); background-repeat:no-repeat; background-position: 20 80;"/>
<!-- Size -->
<Button width="50" height="50" text="5.1" tap="applyTap" tag="margin: 20; background-color: lightgreen; background-image: url('~/pages/test2.png'); background-repeat:no-repeat; background-position: center center; background-size: 100px 100px;"/>
<Button width="50" height="50" text="5.2" tap="applyTap" tag="margin: 20; background-color: lightgreen; background-image: url('~/pages/test2.png'); background-repeat:no-repeat; background-position: center center; background-size: 100% 100%;"/>