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

Merge pull request #2968 from NativeScript/tsenov/uitests

Browse Source 
Add new test page for layouts
This commit is contained in:
SvetoslavTsenov
2016-10-26 17:03:36 +03:00
committed by GitHub
parent a63439f500 fb07c08229
commit 2191bf2e39
4 changed files with 72 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apps/app/ui-tests-app/css/main-page.ts
View File

@ -35,6 +35,7 @@ export function pageLoaded(args: EventData) {
examples.set("measure-tests", "css/measure-tests");
examples.set("all-uniform-border", "css/all-uniform-border");
examples.set("all-non-uniform-border", "css/all-non-uniform-border");
examples.set("margins-paddings-with-percentage", "css/margins-paddings-with-percentage");
//examples.set("border-playground", "css/border-playground");
let viewModel = new SubMianPageViewModel(wrapLayout, examples);

40
apps/app/ui-tests-app/css/margins-paddings-with-percentage.ts Normal file
View File

@ -0,0 +1,40 @@
import view = require("ui/core/view");
import pages = require("ui/page");
import { EventData } from "data/observable";
import button = require("ui/button");
var cssPercentage = " Page { margin:5% 10% 15% 8%; background-color: orange; font-size:8; } GridLayout { margin:3%; background-color: lightgreen; font-size:8; } StackLayout { border-color:red; border-width:1px; } StackLayout * { border-color:blue; border-width:1px; } GridLayout { border-color:green;border-width:1px; } .test1 { padding:10%; } .test2 { padding:10%; background-color:lightblue; } .test3 { margin:1% 2% 3% 4%; } WrapLayout { orientation:vertical; width:75%; height:45% } Button { color:black }"
var cssWithouPercentage = " Page { margin:15 10 15 30; background-color: orange; font-size:8; } GridLayout { margin:3; background-color: lightgreen; font-size:8; } StackLayout { border-color:red; border-width:1px; } StackLayout * { border-color:blue; border-width:1px; } GridLayout { border-color:green;border-width:1px; } .test1 { padding:10; } .test2 { padding:10; background-color:lightblue; } .test3 { margin:10 20 30 40; } WrapLayout { orientation:vertical; width:100; height:120 } Button { color:black }"
var isSCCWithPercentage = true;
export function pageLoaded(args: EventData) {
let page = <pages.Page>args.object;
page.css = cssPercentage;
getBtnText(args);
}
export function applyTap(args: EventData) {
let page = <pages.Page>(<view.View>args.object).page;
let css = isSCCWithPercentage ? cssWithouPercentage : cssPercentage;
isSCCWithPercentage = !isSCCWithPercentage;
console.log(css);
page.css = css;
getBtnText(args);
}
function getBtnText(args: EventData) {
var parent = (<view.View>args.object).parent;
if (parent) {
var btn = <button.Button>view.getViewById(parent, "button");
if (btn) {
if (isSCCWithPercentage) {
btn.text = "css with %";
} else {
btn.text = "css without %";
}
console.log(btn.text);
}
}
}

30
apps/app/ui-tests-app/css/margins-paddings-with-percentage.xml Normal file
View File

@ -0,0 +1,30 @@
<Page xmlns="http://schemas.nativescript.org/tns.xsd" loaded="pageLoaded">
<GridLayout rows="40,*, *, *, *">
<StackLayout>
<Button text="Change css of page" tap="applyTap" id="button"></Button>
</StackLayout>
<StackLayout row="1">
<StackLayout class="test1">
<Label text="padding 30" />
</StackLayout>
</StackLayout>
<StackLayout row="2">
<DockLayout class="test2">
<Label text="DockLayout padding: 30margin" autocorrect="false"/>
</DockLayout>
</StackLayout>
<StackLayout row="3">
<AbsoluteLayout class="test3">
<Label text="AbsoluteLayout margin: 30"/>
</AbsoluteLayout>
</StackLayout>
<StackLayout row="4">
<WrapLayout orientation="vertical">
<Label text="Label in WrapLayout " autocorrect="false"/>
<Label text="width=75%" autocorrect="false"/>
<Label text="height=45%" autocorrect="false"/>
<Label text="test" autocorrect="false"/>
</WrapLayout>
</StackLayout>
</GridLayout>
</Page>

2
apps/app/ui-tests-app/tab-view/main-page.ts
View File

@ -17,7 +17,7 @@ export function pageLoaded(args: EventData) {
examples.set("tabSelected", "tab-view/selected");
examples.set("tabStyle", "tab-view/all");
examples.set("tabmore", "tab-view/tab-view-more");
examples.set("taViewCss", "tab-view/tab-view-css");
examples.set("tabViewCss", "tab-view/tab-view-css");
let viewModel = new SubMianPageViewModel(wrapLayout, examples);
page.bindingContext = viewModel;