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

Add support for TabView CSS

Browse Source 
TabView {
    tab-text-color: green;
    tab-background-color: yellow;
    selected-tab-text-color: red;
    android-selected-tab-highlight-color: orange;
    text-transform: uppercase;
}
This commit is contained in:
Rossen Hristov
2016-10-24 11:10:15 +03:00
parent 8d178754a2
commit 9fc143ee03
13 changed files with 427 additions and 117 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

@@ -36,6 +36,7 @@ export function pageLoaded(args: EventData) {
examples.set("all-uniform-border", "css/all-uniform-border");
examples.set("all-non-uniform-border", "css/all-non-uniform-border");
//examples.set("border-playground", "css/border-playground");
examples.set("tab-view", "css/tab-view");
let viewModel = new SubMianPageViewModel(wrapLayout, examples);
page.bindingContext = viewModel;

13
apps/app/ui-tests-app/css/tab-view.ts Normal file
View File

@@ -0,0 +1,13 @@
import view = require("ui/core/view");
import pages = require("ui/page");
export function applyTap(args) {
var page = <pages.Page>(<view.View>args.object).page;
var css = "#test-element { " + args.object.tag + " }";
page.css = css;
}
export function resetTap(args) {
var page = <pages.Page>(<view.View>args.object).page;
page.css = "";
}

32
apps/app/ui-tests-app/css/tab-view.xml Normal file
View File

@@ -0,0 +1,32 @@
<Page xmlns="http://schemas.nativescript.org/tns.xsd">
<TabView id="test-element">
<TabView.items>
<TabViewItem title="IteM onE">
<TabViewItem.view>
<StackLayout>
<Button text="tab-text-color: green;" tap="applyTap" tag="tab-text-color: green;" style.fontSize="8"/>
<Button text="tab-background-color: yellow;" tap="applyTap" tag="tab-background-color: yellow;" style.fontSize="8"/>
<Button text="selected-tab-text-color: red;" tap="applyTap" tag="selected-tab-text-color: red;" style.fontSize="8"/>
<Button text="android-selected-tab-highlight-color: orange;" tap="applyTap" tag="android-selected-tab-highlight-color: orange;" style.fontSize="8"/>
<Button text="text-transform: uppercase;" tap="applyTap" tag="text-transform: uppercase;" style.fontSize="8"/>
<Button text="text-transform: lowercase;" tap="applyTap" tag="text-transform: lowercase;" style.fontSize="8"/>
<Button text="text-transform: capitalize;" tap="applyTap" tag="text-transform: capitalize;" style.fontSize="8"/>
<Button text="text-transform: none;" tap="applyTap" tag="text-transform: none;" style.fontSize="8"/>
<Button text="all" tap="applyTap" tag="tab-text-color: green; tab-background-color: yellow; selected-tab-text-color: red; android-selected-tab-highlight-color: orange; text-transform: uppercase;" style.fontSize="8"/>
<Button text="reset" tap="resetTap" style.fontSize="8"/>
</StackLayout>
</TabViewItem.view>
</TabViewItem>
<TabViewItem title="IteM twO">
<TabViewItem.view>
<Label text="Item 2"/>
</TabViewItem.view>
</TabViewItem>
<TabViewItem title="IteM threE">
<TabViewItem.view>
<Label text="Item 3"/>
</TabViewItem.view>
</TabViewItem>
</TabView.items>
</TabView>
</Page>