feat(): local icon handling in actionbar and tabview (#7009)

This commit is contained in:
Martin Yankov
2019-03-12 15:08:51 +02:00
committed by Svetoslav
parent 5a5435abc2
commit cd66300e3a
14 changed files with 160 additions and 5 deletions

View File

@@ -0,0 +1,17 @@
import * as frame from "tns-core-modules/ui/frame";
import { EventData } from "tns-core-modules/ui/frame";
import { Button } from "tns-core-modules/ui/button";
import { ActionBar } from "tns-core-modules/ui/action-bar";
const iconModes = ["automatic", "alwaysOriginal", "alwaysTemplate", undefined];
export function navigate(args) {
frame.topmost().navigate("ui-tests-app/action-bar/clean");
}
export function onChangeRenderingMode(args: EventData) {
const button = <Button>args.object;
const actionBar = <ActionBar>button.page.actionBar
actionBar.iosIconRenderingMode = <"automatic" | "alwaysOriginal" | "alwaysTemplate">iconModes[(iconModes.indexOf(actionBar.iosIconRenderingMode) + 1) % iconModes.length];
button.text = "" + actionBar.iosIconRenderingMode;
}

View File

@@ -0,0 +1,14 @@
<Page>
<Page.actionBar>
<ActionBar>
<ActionBar.actionItems>
<ActionItem icon="res://icon" tap="navigate"/>
<ActionItem icon="res://add_to_fav" tap="navigate"/>
</ActionBar.actionItems>
</ActionBar>
</Page.actionBar>
<StackLayout>
<Button text="go to cleared page" tap="navigate"/>
<Button text="undefined" tap="onChangeRenderingMode"/>
</StackLayout>
</Page>

View File

@@ -0,0 +1,17 @@
import * as frame from "tns-core-modules/ui/frame";
import { EventData } from "tns-core-modules/ui/frame";
import { Button } from "tns-core-modules/ui/button";
import { ActionBar } from "tns-core-modules/ui/action-bar";
const iconModes = ["automatic", "alwaysOriginal", "alwaysTemplate", undefined];
export function navigate(args) {
frame.topmost().navigate("ui-tests-app/action-bar/clean");
}
export function onChangeRenderingMode(args: EventData) {
const button = <Button>args.object;
const actionBar = <ActionBar>button.page.actionBar
actionBar.iosIconRenderingMode = <"automatic" | "alwaysOriginal" | "alwaysTemplate">iconModes[(iconModes.indexOf(actionBar.iosIconRenderingMode) + 1) % iconModes.length];
button.text = "" + actionBar.iosIconRenderingMode;
}

View File

@@ -0,0 +1,14 @@
<Page>
<Page.actionBar>
<ActionBar>
<ActionBar.actionItems>
<ActionItem icon="~/ui-tests-app/resources/images/icon.png" tap="navigate"/>
<ActionItem icon="~/ui-tests-app/resources/images/add_to_fav@3x.png" tap="navigate"/>
</ActionBar.actionItems>
</ActionBar>
</Page.actionBar>
<StackLayout>
<Button text="go to cleared page" tap="navigate"/>
<Button text="undefined" tap="onChangeRenderingMode"/>
</StackLayout>
</Page>

View File

@@ -15,6 +15,8 @@ export function loadExamples() {
examples.set("actBG", "action-bar/background");
examples.set("actStyle", "action-bar/all");
examples.set("actIcons", "action-bar/system-icons");
examples.set("actLocalIcons", "action-bar/local-icons");
examples.set("actResIcons", "action-bar/icons");
examples.set("actView", "action-bar/action-view");
examples.set("actionItemPosition", "action-bar/action-item-position");
examples.set("actBGCss", "action-bar/background-css");

View File

@@ -19,6 +19,7 @@ export function loadExamples() {
examples.set("tabmore", "tab-view/tab-view-more");
examples.set("tabViewCss", "tab-view/tab-view-css");
examples.set("tab-view-icons", "tab-view/tab-view-icon");
examples.set("tab-view-icons-local", "tab-view/tab-view-icon-local");
examples.set("tab-view-icon-change", "tab-view/tab-view-icon-change");
examples.set("text-transform", "tab-view/text-transform");
examples.set("tab-view-bottom-position", "tab-view/tab-view-bottom-position");

View File

@@ -0,0 +1,21 @@
import { EventData } from "tns-core-modules/data/observable";
import { Button } from "tns-core-modules/ui/button";
import { TabView } from "tns-core-modules/ui/tab-view";
let iconModes = ["automatic", "alwaysOriginal", "alwaysTemplate", undefined];
export const onNavigate = updateButtons;
export function onChangeRenderingMode(args: EventData) {
let tabView = (<Button>args.object).page.getViewById<TabView>("tab-view");
tabView.iosIconRenderingMode = <"automatic" | "alwaysOriginal" | "alwaysTemplate">iconModes[(iconModes.indexOf(tabView.iosIconRenderingMode) + 1) % iconModes.length];
updateButtons(args);
}
function updateButtons(args) {
let button = (<Button>args.object);
let tabView = button.page.getViewById<TabView>("tab-view");
for (let i = 0, length = tabView.items.length; i < length; i++) {
(<Button>tabView.items[i].view).text = "" + tabView.iosIconRenderingMode;
}
}

View File

@@ -0,0 +1,26 @@
<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="onNavigate">
<TabView id="tab-view" tabTextColor="green" selectedTabTextColor="red" tabBackgroundColor="yellow">
<TabView.items>
<TabViewItem iconSource="~/ui-tests-app/resources/images/icon.png">
<TabViewItem.view>
<Button text="undefined" tap="onChangeRenderingMode"/>
</TabViewItem.view>
</TabViewItem>
<TabViewItem iconSource="~/ui-tests-app/resources/images/add_to_fav@3x.png">
<TabViewItem.view>
<Button text="undefined" tap="onChangeRenderingMode"/>
</TabViewItem.view>
</TabViewItem>
<TabViewItem iconSource="~/ui-tests-app/resources/images/icon.png" title="NativeScript">
<TabViewItem.view>
<Button text="undefined" tap="onChangeRenderingMode"/>
</TabViewItem.view>
</TabViewItem>
<TabViewItem iconSource="~/ui-tests-app/resources/images/add_to_fav@3x.png" title="Favorites">
<TabViewItem.view>
<Button text="undefined" tap="onChangeRenderingMode"/>
</TabViewItem.view>
</TabViewItem>
</TabView.items>
</TabView>
</Page>