mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-11-05 13:26:48 +08:00
feat(core): nativescript.config and webpack updates (#8801)
This commit is contained in:
20
apps/ui/src/tab-view/all-page.xml
Normal file
20
apps/ui/src/tab-view/all-page.xml
Normal file
@@ -0,0 +1,20 @@
|
||||
<Page>
|
||||
<TabView selectedIndex="1" style="tab-text-color: yellow; color:yellow; selected-tab-text-color: red; android-selected-tab-highlight-color:red; background-color: green; tab-background-color: blue;">
|
||||
<TabView.items>
|
||||
<TabViewItem title="First">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Second">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
20
apps/ui/src/tab-view/background-page.xml
Normal file
20
apps/ui/src/tab-view/background-page.xml
Normal file
@@ -0,0 +1,20 @@
|
||||
<Page>
|
||||
<TabView style="background-color: green;">
|
||||
<TabView.items>
|
||||
<TabViewItem title="First">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Second">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
20
apps/ui/src/tab-view/color-page.xml
Normal file
20
apps/ui/src/tab-view/color-page.xml
Normal file
@@ -0,0 +1,20 @@
|
||||
<Page>
|
||||
<TabView style="color: green;">
|
||||
<TabView.items>
|
||||
<TabViewItem title="First">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Second">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
27
apps/ui/src/tab-view/icon-title-placement-page.xml
Normal file
27
apps/ui/src/tab-view/icon-title-placement-page.xml
Normal file
@@ -0,0 +1,27 @@
|
||||
<Page>
|
||||
<TabView style="color: green;">
|
||||
<TabView.items>
|
||||
<TabViewItem title="Title" automationText="tab1" iconSource="res://add_to_fav">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Title and icon" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem iconSource="res://add_to_fav" automationText="tab2" >
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Only icon" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Title" automationText="tab3">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Only title" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
29
apps/ui/src/tab-view/issue-5470-page.xml
Normal file
29
apps/ui/src/tab-view/issue-5470-page.xml
Normal file
@@ -0,0 +1,29 @@
|
||||
<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo" class="page">
|
||||
|
||||
<Page.actionBar>
|
||||
<ActionBar title="TabView content sizing" icon="" class="action-bar">
|
||||
</ActionBar>
|
||||
</Page.actionBar>
|
||||
|
||||
<TabView id="tabViewContainer">
|
||||
<TabView.items>
|
||||
<TabViewItem title="Tab1" >
|
||||
<TabViewItem.view>
|
||||
<GridLayout rows="*, auto" columns="*">
|
||||
<StackLayout row="0" backgroundColor="lightblue"></StackLayout>
|
||||
<StackLayout row="1" backgroundColor="green" height="50"></StackLayout>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Tab2" >
|
||||
<TabViewItem.view>
|
||||
<GridLayout rows="*, auto" columns="*">
|
||||
<StackLayout row="0" backgroundColor="lightblue"></StackLayout>
|
||||
<StackLayout row="1" backgroundColor="red" height="50"></StackLayout>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
|
||||
</Page>
|
||||
33
apps/ui/src/tab-view/main-page.ts
Normal file
33
apps/ui/src/tab-view/main-page.ts
Normal file
@@ -0,0 +1,33 @@
|
||||
import { EventData } from '@nativescript/core/data/observable';
|
||||
import { SubMainPageViewModel } from '../sub-main-page-view-model';
|
||||
import { WrapLayout } from '@nativescript/core/ui/layouts/wrap-layout';
|
||||
import { Page } from '@nativescript/core/ui/page';
|
||||
|
||||
export function pageLoaded(args: EventData) {
|
||||
const page = <Page>args.object;
|
||||
const wrapLayout = <WrapLayout>page.getViewById('wrapLayoutWithExamples');
|
||||
page.bindingContext = new SubMainPageViewModel(wrapLayout, loadExamples());
|
||||
}
|
||||
|
||||
export function loadExamples() {
|
||||
const examples = new Map<string, string>();
|
||||
examples.set('tabColor', 'tab-view/color-page');
|
||||
examples.set('tabBG', 'tab-view/background-page');
|
||||
examples.set('tabTabsBG', 'tab-view/tabsBackground-page');
|
||||
examples.set('tabSelected', 'tab-view/selected-page');
|
||||
examples.set('tabStyle', 'tab-view/all-page');
|
||||
examples.set('tabmore', 'tab-view/tab-view-more-page');
|
||||
examples.set('tabViewCss', 'tab-view/tab-view-css-page');
|
||||
examples.set('tab-view-icons', 'tab-view/tab-view-icon-page');
|
||||
examples.set('tab-view-icons-local', 'tab-view/tab-view-icon-local-page');
|
||||
examples.set('tab-view-icon-change', 'tab-view/tab-view-icon-change-page');
|
||||
examples.set('text-transform', 'tab-view/text-transform-page');
|
||||
examples.set('tab-view-bottom-position', 'tab-view/tab-view-bottom-position-page');
|
||||
examples.set('issue-5470', 'tab-view/issue-5470-page');
|
||||
examples.set('tab-view-tab-text-font-size', 'tab-view/tab-view-tab-text-font-size-page');
|
||||
examples.set('tab-view-android-swipe', 'tab-view/tab-view-android-swipe-page');
|
||||
examples.set('tab-view-icon-title-placement', 'tab-view/icon-title-placement-page');
|
||||
examples.set('tab-text-color', 'tab-view/tab-text-color-page');
|
||||
|
||||
return examples;
|
||||
}
|
||||
6
apps/ui/src/tab-view/main-page.xml
Normal file
6
apps/ui/src/tab-view/main-page.xml
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8" ?>
|
||||
<Page loaded="pageLoaded">
|
||||
<ScrollView orientation="vertical" row="1">
|
||||
<WrapLayout id="wrapLayoutWithExamples"/>
|
||||
</ScrollView>
|
||||
</Page>
|
||||
12
apps/ui/src/tab-view/nowrap-page.xml
Normal file
12
apps/ui/src/tab-view/nowrap-page.xml
Normal file
@@ -0,0 +1,12 @@
|
||||
<Page>
|
||||
<StackLayout>
|
||||
<SegmentedBar>
|
||||
<SegmentedBar.items>
|
||||
<SegmentedBarItem title="Incomplete" />
|
||||
<SegmentedBarItem title="Complete" />
|
||||
<SegmentedBarItem title="Something Else" />
|
||||
<SegmentedBarItem title="All" />
|
||||
</SegmentedBar.items>
|
||||
</SegmentedBar>
|
||||
</StackLayout>
|
||||
</Page>
|
||||
20
apps/ui/src/tab-view/selected-page.xml
Normal file
20
apps/ui/src/tab-view/selected-page.xml
Normal file
@@ -0,0 +1,20 @@
|
||||
<Page>
|
||||
<TabView selectedTabTextColor="green">
|
||||
<TabView.items>
|
||||
<TabViewItem title="First">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Second">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
24
apps/ui/src/tab-view/tab-text-color-page.xml
Normal file
24
apps/ui/src/tab-view/tab-text-color-page.xml
Normal file
@@ -0,0 +1,24 @@
|
||||
<Page>
|
||||
<TabView tabTextColor="red">
|
||||
<TabView.items>
|
||||
|
||||
<TabViewItem title="Tab 1">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 1" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
|
||||
<TabViewItem title="Tab 2">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 2" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
|
||||
<TabViewItem title="Tab 3">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 3" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
24
apps/ui/src/tab-view/tab-view-android-swipe-page.xml
Normal file
24
apps/ui/src/tab-view/tab-view-android-swipe-page.xml
Normal file
@@ -0,0 +1,24 @@
|
||||
<Page loaded="onLoaded">
|
||||
<TabView androidSwipeEnabled="false">
|
||||
<TabView.items>
|
||||
|
||||
<TabViewItem title="Tab 1">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 1" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
|
||||
<TabViewItem title="Tab 2">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 2" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
|
||||
<TabViewItem title="Tab 3">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 3" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
20
apps/ui/src/tab-view/tab-view-bottom-position-page.xml
Normal file
20
apps/ui/src/tab-view/tab-view-bottom-position-page.xml
Normal file
@@ -0,0 +1,20 @@
|
||||
<Page>
|
||||
<TabView androidTabsPosition="bottom">
|
||||
<TabView.items>
|
||||
<TabViewItem title="First">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Second">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
2
apps/ui/src/tab-view/tab-view-css-page.css
Normal file
2
apps/ui/src/tab-view/tab-view-css-page.css
Normal file
@@ -0,0 +1,2 @@
|
||||
/* Currently need an empty css file to make this module a style scope host.
|
||||
This tests sets css on the module and without this empty file the css is set on the frame on top of it */
|
||||
19
apps/ui/src/tab-view/tab-view-css-page.ts
Normal file
19
apps/ui/src/tab-view/tab-view-css-page.ts
Normal file
@@ -0,0 +1,19 @@
|
||||
import * as view from '@nativescript/core/ui/core/view';
|
||||
import * as pages from '@nativescript/core/ui/page';
|
||||
|
||||
export function loaded(args) {
|
||||
var page = <pages.Page>(<view.View>args.object).page;
|
||||
const view = page.getViewById('test-element');
|
||||
(<any>view).textTransform = 'capitalize';
|
||||
}
|
||||
|
||||
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 = '';
|
||||
}
|
||||
36
apps/ui/src/tab-view/tab-view-css-page.xml
Normal file
36
apps/ui/src/tab-view/tab-view-css-page.xml
Normal file
@@ -0,0 +1,36 @@
|
||||
<Page
|
||||
xmlns="http://schemas.nativescript.org/tns.xsd"
|
||||
loaded="loaded">
|
||||
<TabView id="test-element">
|
||||
<TabView.items>
|
||||
<TabViewItem title="IteM onE">
|
||||
<TabViewItem.view>
|
||||
<ScrollView>
|
||||
<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>
|
||||
</ScrollView>
|
||||
</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>
|
||||
15
apps/ui/src/tab-view/tab-view-icon-change-page.ts
Normal file
15
apps/ui/src/tab-view/tab-view-icon-change-page.ts
Normal file
@@ -0,0 +1,15 @@
|
||||
import { TabView, SelectedIndexChangedEventData } from '@nativescript/core/ui/tab-view';
|
||||
|
||||
export function onSelectedIndexChanged(args: SelectedIndexChangedEventData) {
|
||||
const tabView = args.object as TabView;
|
||||
|
||||
const newItem = tabView.items[args.newIndex];
|
||||
if (newItem) {
|
||||
newItem.iconSource = 'res://icon';
|
||||
}
|
||||
|
||||
const oldItem = tabView.items[args.oldIndex];
|
||||
if (oldItem) {
|
||||
oldItem.iconSource = 'res://testlogo';
|
||||
}
|
||||
}
|
||||
16
apps/ui/src/tab-view/tab-view-icon-change-page.xml
Normal file
16
apps/ui/src/tab-view/tab-view-icon-change-page.xml
Normal file
@@ -0,0 +1,16 @@
|
||||
<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="onNavigatingTo">
|
||||
<TabView id="tab-view" selectedIndexChanged="onSelectedIndexChanged" iosIconRenderingMode="alwaysOriginal">
|
||||
<TabView.items>
|
||||
<TabViewItem iconSource="res://icon">
|
||||
<TabViewItem.view>
|
||||
<Label text="first tab"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem iconSource="res://testlogo">
|
||||
<TabViewItem.view>
|
||||
<Label text="second tab"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
21
apps/ui/src/tab-view/tab-view-icon-local-page.ts
Normal file
21
apps/ui/src/tab-view/tab-view-icon-local-page.ts
Normal file
@@ -0,0 +1,21 @@
|
||||
import { EventData } from '@nativescript/core/data/observable';
|
||||
import { Button } from '@nativescript/core/ui/button';
|
||||
import { TabView } from '@nativescript/core/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;
|
||||
}
|
||||
}
|
||||
26
apps/ui/src/tab-view/tab-view-icon-local-page.xml
Normal file
26
apps/ui/src/tab-view/tab-view-icon-local-page.xml
Normal 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="~/resources/images/icon.png">
|
||||
<TabViewItem.view>
|
||||
<Button text="undefined" tap="onChangeRenderingMode"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem iconSource="~/resources/images/add_to_fav@3x.png">
|
||||
<TabViewItem.view>
|
||||
<Button text="undefined" tap="onChangeRenderingMode"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem iconSource="~/resources/images/icon.png" title="NativeScript">
|
||||
<TabViewItem.view>
|
||||
<Button text="undefined" tap="onChangeRenderingMode"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem iconSource="~/resources/images/add_to_fav@3x.png" title="Favorites">
|
||||
<TabViewItem.view>
|
||||
<Button text="undefined" tap="onChangeRenderingMode"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
21
apps/ui/src/tab-view/tab-view-icon-page.ts
Normal file
21
apps/ui/src/tab-view/tab-view-icon-page.ts
Normal file
@@ -0,0 +1,21 @@
|
||||
import { EventData } from '@nativescript/core/data/observable';
|
||||
import { Button } from '@nativescript/core/ui/button';
|
||||
import { TabView } from '@nativescript/core/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;
|
||||
}
|
||||
}
|
||||
26
apps/ui/src/tab-view/tab-view-icon-page.xml
Normal file
26
apps/ui/src/tab-view/tab-view-icon-page.xml
Normal 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="res://icon">
|
||||
<TabViewItem.view>
|
||||
<Button text="undefined" tap="onChangeRenderingMode"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem iconSource="res://add_to_fav">
|
||||
<TabViewItem.view>
|
||||
<Button text="undefined" tap="onChangeRenderingMode"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem iconSource="res://icon" title="NativeScript">
|
||||
<TabViewItem.view>
|
||||
<Button text="undefined" tap="onChangeRenderingMode"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem iconSource="res://add_to_fav" title="Favorites">
|
||||
<TabViewItem.view>
|
||||
<Button text="undefined" tap="onChangeRenderingMode"/>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
3
apps/ui/src/tab-view/tab-view-more-page.css
Normal file
3
apps/ui/src/tab-view/tab-view-more-page.css
Normal file
@@ -0,0 +1,3 @@
|
||||
TabView {
|
||||
font-size: 10;
|
||||
}
|
||||
42
apps/ui/src/tab-view/tab-view-more-page.xml
Normal file
42
apps/ui/src/tab-view/tab-view-more-page.xml
Normal file
@@ -0,0 +1,42 @@
|
||||
<Page>
|
||||
<TabView>
|
||||
<TabView.items>
|
||||
|
||||
<TabViewItem title="Tab 1">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 1" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
|
||||
<TabViewItem title="Tab 2">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 2" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
|
||||
<TabViewItem title="Tab 3">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 3" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
|
||||
<TabViewItem title="Tab 4">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 4" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
|
||||
<TabViewItem title="Tab 5">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 5" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Tab 6">
|
||||
<TabViewItem.view>
|
||||
<Label text="Label 6" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
20
apps/ui/src/tab-view/tab-view-tab-text-font-size-page.xml
Normal file
20
apps/ui/src/tab-view/tab-view-tab-text-font-size-page.xml
Normal file
@@ -0,0 +1,20 @@
|
||||
<Page>
|
||||
<TabView tabTextFontSize="8">
|
||||
<TabView.items>
|
||||
<TabViewItem title="First">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Second">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
20
apps/ui/src/tab-view/tabsBackground-page.xml
Normal file
20
apps/ui/src/tab-view/tabsBackground-page.xml
Normal file
@@ -0,0 +1,20 @@
|
||||
<Page>
|
||||
<TabView tabBackgroundColor="blue">
|
||||
<TabView.items>
|
||||
<TabViewItem title="First">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="Second">
|
||||
<TabViewItem.view>
|
||||
<GridLayout>
|
||||
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
|
||||
</GridLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
1
apps/ui/src/tab-view/text-transform-page.css
Normal file
1
apps/ui/src/tab-view/text-transform-page.css
Normal file
@@ -0,0 +1 @@
|
||||
/* Empty CSS to avoid styles leaking from the page - https://github.com/NativeScript/NativeScript/issues/8143 */
|
||||
18
apps/ui/src/tab-view/text-transform-page.ts
Normal file
18
apps/ui/src/tab-view/text-transform-page.ts
Normal file
@@ -0,0 +1,18 @@
|
||||
import { Page } from '@nativescript/core/ui/page';
|
||||
|
||||
const CSS = `
|
||||
#tab1 { text-transform: none; }
|
||||
#tab2 { text-transform: lowercase; }
|
||||
#tab3 { text-transform: uppercase; }
|
||||
#tab4 { text-transform: capitalize; }
|
||||
`;
|
||||
|
||||
export function applyTap(args) {
|
||||
var page = <Page>args.object.page;
|
||||
page.css = CSS;
|
||||
}
|
||||
|
||||
export function resetTap(args) {
|
||||
var page = <Page>args.object.page;
|
||||
page.css = '';
|
||||
}
|
||||
29
apps/ui/src/tab-view/text-transform-page.xml
Normal file
29
apps/ui/src/tab-view/text-transform-page.xml
Normal file
@@ -0,0 +1,29 @@
|
||||
<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="onNavigate">
|
||||
<TabView>
|
||||
<TabView.items>
|
||||
<TabViewItem title="tAb ViEw" id="tab1">
|
||||
<TabViewItem.view>
|
||||
<StackLayout>
|
||||
<Button text="apply" tap="applyTap"/>
|
||||
<Button text="reset" tap="resetTap"/>
|
||||
</StackLayout>
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="tAb ViEw" id="tab2">
|
||||
<TabViewItem.view>
|
||||
<Label text="empty tab" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="tAb ViEw" id="tab3">
|
||||
<TabViewItem.view>
|
||||
<Label text="empty tab" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
<TabViewItem title="tAb ViEw" id="tab4">
|
||||
<TabViewItem.view>
|
||||
<Label text="empty tab" />
|
||||
</TabViewItem.view>
|
||||
</TabViewItem>
|
||||
</TabView.items>
|
||||
</TabView>
|
||||
</Page>
|
||||
Reference in New Issue
Block a user