mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-11-05 13:26:48 +08:00
chore: format
This commit is contained in:
Nathan Walker
@@ -1,84 +1,90 @@
|
||||
import { Color } from "../../../color";
|
||||
import { View } from "../../core/view";
|
||||
import { EventData } from "../../../data/observable";
|
||||
import { Property } from "../../core/properties"
|
||||
import { Property } from "../../core/properties";
|
||||
import { TabStripItem } from "../tab-strip-item";
|
||||
|
||||
/**
|
||||
* Represents a tab strip.
|
||||
*/
|
||||
export class TabStrip extends View {
|
||||
/**
|
||||
* Gets or sets the items of the tab strip.
|
||||
*/
|
||||
items: Array<TabStripItem>;
|
||||
|
||||
/**
|
||||
* Gets or sets the items of the tab strip.
|
||||
*/
|
||||
items: Array<TabStripItem>;
|
||||
/**
|
||||
* Gets or sets whether icon size should be fixed based on specs or use the actual size. Defaults to true(fixed).
|
||||
*/
|
||||
isIconSizeFixed: boolean;
|
||||
|
||||
/**
|
||||
* Gets or sets whether icon size should be fixed based on specs or use the actual size. Defaults to true(fixed).
|
||||
*/
|
||||
isIconSizeFixed: boolean;
|
||||
/**
|
||||
* Gets or sets the icon rendering mode on iOS
|
||||
*/
|
||||
iosIconRenderingMode: "automatic" | "alwaysOriginal" | "alwaysTemplate";
|
||||
|
||||
/**
|
||||
* Gets or sets the icon rendering mode on iOS
|
||||
*/
|
||||
iosIconRenderingMode: "automatic" | "alwaysOriginal" | "alwaysTemplate";
|
||||
/**
|
||||
* Gets or sets the color that marks the selected tab of the tab strip. Works for Tabs component only.
|
||||
*/
|
||||
highlightColor: Color;
|
||||
|
||||
/**
|
||||
* Gets or sets the color that marks the selected tab of the tab strip. Works for Tabs component only.
|
||||
*/
|
||||
highlightColor: Color;
|
||||
/**
|
||||
* Gets or sets the color of the selected item in the tab strip.
|
||||
*/
|
||||
selectedItemColor: Color;
|
||||
|
||||
/**
|
||||
* Gets or sets the color of the selected item in the tab strip.
|
||||
*/
|
||||
selectedItemColor: Color;
|
||||
/**
|
||||
* Gets or sets the color of the non-selected items in the tab strip.
|
||||
*/
|
||||
unSelectedItemColor: Color;
|
||||
|
||||
/**
|
||||
* Gets or sets the color of the non-selected items in the tab strip.
|
||||
*/
|
||||
unSelectedItemColor: Color;
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
_hasImage: boolean;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
_hasImage: boolean;
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
_hasTitle: boolean;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
_hasTitle: boolean;
|
||||
/**
|
||||
* String value used when hooking to itemTap event.
|
||||
*/
|
||||
public static itemTapEvent: string;
|
||||
|
||||
/**
|
||||
* String value used when hooking to itemTap event.
|
||||
*/
|
||||
public static itemTapEvent: string;
|
||||
/**
|
||||
* A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
|
||||
* @param eventNames - String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").
|
||||
* @param callback - Callback function which will be executed when event is raised.
|
||||
* @param thisArg - An optional parameter which will be used as `this` context for callback execution.
|
||||
*/
|
||||
on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
|
||||
|
||||
/**
|
||||
* A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
|
||||
* @param eventNames - String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").
|
||||
* @param callback - Callback function which will be executed when event is raised.
|
||||
* @param thisArg - An optional parameter which will be used as `this` context for callback execution.
|
||||
*/
|
||||
on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
|
||||
|
||||
/**
|
||||
* Raised when an TabStripItem is tapped.
|
||||
*/
|
||||
on(event: "itemTap", callback: (args: TabStripItemEventData) => void, thisArg?: any);
|
||||
/**
|
||||
* Raised when an TabStripItem is tapped.
|
||||
*/
|
||||
on(
|
||||
event: "itemTap",
|
||||
callback: (args: TabStripItemEventData) => void,
|
||||
thisArg?: any
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Event data containing information for the TabStripItem's index.
|
||||
*/
|
||||
export interface TabStripItemEventData extends EventData {
|
||||
/**
|
||||
* The index of the TabStripItem.
|
||||
*/
|
||||
index: number;
|
||||
/**
|
||||
* The index of the TabStripItem.
|
||||
*/
|
||||
index: number;
|
||||
}
|
||||
|
||||
export const iosIconRenderingModeProperty: Property<TabStrip, "automatic" | "alwaysOriginal" | "alwaysTemplate">;
|
||||
export const iosIconRenderingModeProperty: Property<
|
||||
TabStrip,
|
||||
"automatic" | "alwaysOriginal" | "alwaysTemplate"
|
||||
>;
|
||||
export const isIconSizeFixedProperty: Property<TabStrip, boolean>;
|
||||
export const selectedItemColorProperty: Property<TabStrip, Color>;
|
||||
export const unSelectedItemColorProperty: Property<TabStrip, Color>;
|
||||
export const unSelectedItemColorProperty: Property<TabStrip, Color>;
|
||||
|
||||
@@ -9,7 +9,12 @@ import { CSSType, View } from "../../core/view";
|
||||
import { ViewBase, booleanConverter } from "../../core/view-base";
|
||||
import { Property, CoercibleProperty } from "../../core/properties";
|
||||
import { EventData } from "../../../data/observable";
|
||||
import { colorProperty, backgroundColorProperty, backgroundInternalProperty, fontInternalProperty } from "../../styling/style-properties";
|
||||
import {
|
||||
colorProperty,
|
||||
backgroundColorProperty,
|
||||
backgroundInternalProperty,
|
||||
fontInternalProperty,
|
||||
} from "../../styling/style-properties";
|
||||
import { TabStripItem } from "../tab-strip-item";
|
||||
import { textTransformProperty } from "../../text-base";
|
||||
|
||||
@@ -17,172 +22,201 @@ export const traceCategory = "TabView";
|
||||
|
||||
// Place this on top because the webpack ts-loader doesn't work when export
|
||||
// is after reference
|
||||
export const highlightColorProperty = new Property<TabStrip, Color>({ name: "highlightColor", equalityComparer: Color.equals, valueConverter: (v) => new Color(v) });
|
||||
export const selectedItemColorProperty = new Property<TabStrip, Color>({ name: "selectedItemColor", equalityComparer: Color.equals, valueConverter: (v) => new Color(v) });
|
||||
export const unSelectedItemColorProperty = new Property<TabStrip, Color>({ name: "unSelectedItemColor", equalityComparer: Color.equals, valueConverter: (v) => new Color(v) });
|
||||
export const highlightColorProperty = new Property<TabStrip, Color>({
|
||||
name: "highlightColor",
|
||||
equalityComparer: Color.equals,
|
||||
valueConverter: (v) => new Color(v),
|
||||
});
|
||||
export const selectedItemColorProperty = new Property<TabStrip, Color>({
|
||||
name: "selectedItemColor",
|
||||
equalityComparer: Color.equals,
|
||||
valueConverter: (v) => new Color(v),
|
||||
});
|
||||
export const unSelectedItemColorProperty = new Property<TabStrip, Color>({
|
||||
name: "unSelectedItemColor",
|
||||
equalityComparer: Color.equals,
|
||||
valueConverter: (v) => new Color(v),
|
||||
});
|
||||
|
||||
/**
|
||||
* Event data containing information for the TabStripItem's index.
|
||||
*/
|
||||
export interface TabStripItemEventData extends EventData {
|
||||
/**
|
||||
* The index of the TabStripItem.
|
||||
*/
|
||||
index: number;
|
||||
/**
|
||||
* The index of the TabStripItem.
|
||||
*/
|
||||
index: number;
|
||||
}
|
||||
|
||||
@CSSType("TabStrip")
|
||||
export class TabStrip extends View implements TabStripDefinition, AddChildFromBuilder, AddArrayFromBuilder {
|
||||
public static itemTapEvent = "itemTap";
|
||||
public items: TabStripItem[];
|
||||
public isIconSizeFixed: boolean;
|
||||
public iosIconRenderingMode: "automatic" | "alwaysOriginal" | "alwaysTemplate";
|
||||
public highlightColor: Color;
|
||||
public selectedItemColor: Color;
|
||||
public unSelectedItemColor: Color;
|
||||
public _hasImage: boolean;
|
||||
public _hasTitle: boolean;
|
||||
export class TabStrip extends View
|
||||
implements TabStripDefinition, AddChildFromBuilder, AddArrayFromBuilder {
|
||||
public static itemTapEvent = "itemTap";
|
||||
public items: TabStripItem[];
|
||||
public isIconSizeFixed: boolean;
|
||||
public iosIconRenderingMode:
|
||||
| "automatic"
|
||||
| "alwaysOriginal"
|
||||
| "alwaysTemplate";
|
||||
public highlightColor: Color;
|
||||
public selectedItemColor: Color;
|
||||
public unSelectedItemColor: Color;
|
||||
public _hasImage: boolean;
|
||||
public _hasTitle: boolean;
|
||||
|
||||
public eachChild(callback: (child: ViewBase) => boolean) {
|
||||
const items = this.items;
|
||||
if (items) {
|
||||
items.forEach((item, i) => {
|
||||
callback(item);
|
||||
});
|
||||
}
|
||||
}
|
||||
public eachChild(callback: (child: ViewBase) => boolean) {
|
||||
const items = this.items;
|
||||
if (items) {
|
||||
items.forEach((item, i) => {
|
||||
callback(item);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
public _addArrayFromBuilder(name: string, value: Array<any>) {
|
||||
if (name === "items") {
|
||||
this.items = value;
|
||||
}
|
||||
}
|
||||
public _addArrayFromBuilder(name: string, value: Array<any>) {
|
||||
if (name === "items") {
|
||||
this.items = value;
|
||||
}
|
||||
}
|
||||
|
||||
public _addChildFromBuilder(name: string, value: any): void {
|
||||
if (value instanceof TabStripItem) {
|
||||
if (!this.items) {
|
||||
this.items = new Array<TabStripItem>();
|
||||
}
|
||||
this.items.push(<TabStripItem>value);
|
||||
this._addView(value);
|
||||
// selectedIndexProperty.coerce(this);
|
||||
}
|
||||
}
|
||||
public _addChildFromBuilder(name: string, value: any): void {
|
||||
if (value instanceof TabStripItem) {
|
||||
if (!this.items) {
|
||||
this.items = new Array<TabStripItem>();
|
||||
}
|
||||
this.items.push(<TabStripItem>value);
|
||||
this._addView(value);
|
||||
// selectedIndexProperty.coerce(this);
|
||||
}
|
||||
}
|
||||
|
||||
public onItemsChanged(oldItems: TabStripItem[], newItems: TabStripItem[]): void {
|
||||
if (oldItems) {
|
||||
oldItems.forEach(item => this._removeView(item));
|
||||
}
|
||||
public onItemsChanged(
|
||||
oldItems: TabStripItem[],
|
||||
newItems: TabStripItem[]
|
||||
): void {
|
||||
if (oldItems) {
|
||||
oldItems.forEach((item) => this._removeView(item));
|
||||
}
|
||||
|
||||
if (newItems) {
|
||||
newItems.forEach(item => {
|
||||
this._addView(item);
|
||||
});
|
||||
}
|
||||
}
|
||||
if (newItems) {
|
||||
newItems.forEach((item) => {
|
||||
this._addView(item);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
[backgroundColorProperty.getDefault](): Color {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
[backgroundColorProperty.getDefault](): Color {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.getTabBarBackgroundColor();
|
||||
}
|
||||
[backgroundColorProperty.setNative](value: Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
return parent && parent.getTabBarBackgroundColor();
|
||||
}
|
||||
[backgroundColorProperty.setNative](value: Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.setTabBarBackgroundColor(value);
|
||||
}
|
||||
return parent && parent.setTabBarBackgroundColor(value);
|
||||
}
|
||||
|
||||
[backgroundInternalProperty.getDefault](): any {
|
||||
return null;
|
||||
}
|
||||
[backgroundInternalProperty.setNative](value: any) {
|
||||
// disable the background CSS properties
|
||||
}
|
||||
[backgroundInternalProperty.getDefault](): any {
|
||||
return null;
|
||||
}
|
||||
[backgroundInternalProperty.setNative](value: any) {
|
||||
// disable the background CSS properties
|
||||
}
|
||||
|
||||
[colorProperty.getDefault](): Color {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
[colorProperty.getDefault](): Color {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.getTabBarColor();
|
||||
}
|
||||
[colorProperty.setNative](value: Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
return parent && parent.getTabBarColor();
|
||||
}
|
||||
[colorProperty.setNative](value: Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.setTabBarColor(value);
|
||||
}
|
||||
return parent && parent.setTabBarColor(value);
|
||||
}
|
||||
|
||||
[fontInternalProperty.getDefault](): any {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
[fontInternalProperty.getDefault](): any {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.getTabBarFontInternal();
|
||||
}
|
||||
[fontInternalProperty.setNative](value: any) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
return parent && parent.getTabBarFontInternal();
|
||||
}
|
||||
[fontInternalProperty.setNative](value: any) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.setTabBarFontInternal(value);
|
||||
}
|
||||
return parent && parent.setTabBarFontInternal(value);
|
||||
}
|
||||
|
||||
[textTransformProperty.getDefault](): any {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
[textTransformProperty.getDefault](): any {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.getTabBarTextTransform();
|
||||
}
|
||||
[textTransformProperty.setNative](value: any) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
return parent && parent.getTabBarTextTransform();
|
||||
}
|
||||
[textTransformProperty.setNative](value: any) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.setTabBarTextTransform(value);
|
||||
}
|
||||
return parent && parent.setTabBarTextTransform(value);
|
||||
}
|
||||
|
||||
[highlightColorProperty.getDefault](): number {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
[highlightColorProperty.getDefault](): number {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.getTabBarHighlightColor();
|
||||
}
|
||||
[highlightColorProperty.setNative](value: number | Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
return parent && parent.getTabBarHighlightColor();
|
||||
}
|
||||
[highlightColorProperty.setNative](value: number | Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.setTabBarHighlightColor(value);
|
||||
}
|
||||
return parent && parent.setTabBarHighlightColor(value);
|
||||
}
|
||||
|
||||
[selectedItemColorProperty.getDefault](): Color {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
[selectedItemColorProperty.getDefault](): Color {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.getTabBarSelectedItemColor();
|
||||
}
|
||||
[selectedItemColorProperty.setNative](value: Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
return parent && parent.getTabBarSelectedItemColor();
|
||||
}
|
||||
[selectedItemColorProperty.setNative](value: Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.setTabBarSelectedItemColor(value);
|
||||
}
|
||||
return parent && parent.setTabBarSelectedItemColor(value);
|
||||
}
|
||||
|
||||
[unSelectedItemColorProperty.getDefault](): Color {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
[unSelectedItemColorProperty.getDefault](): Color {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.getTabBarUnSelectedItemColor();
|
||||
}
|
||||
[unSelectedItemColorProperty.setNative](value: Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
return parent && parent.getTabBarUnSelectedItemColor();
|
||||
}
|
||||
[unSelectedItemColorProperty.setNative](value: Color) {
|
||||
const parent = <TabNavigationBase>this.parent;
|
||||
|
||||
return parent && parent.setTabBarUnSelectedItemColor(value);
|
||||
}
|
||||
return parent && parent.setTabBarUnSelectedItemColor(value);
|
||||
}
|
||||
}
|
||||
|
||||
export interface TabStrip {
|
||||
on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
|
||||
on(event: "itemTap", callback: (args: TabStripItemEventData) => void, thisArg?: any);
|
||||
on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
|
||||
on(
|
||||
event: "itemTap",
|
||||
callback: (args: TabStripItemEventData) => void,
|
||||
thisArg?: any
|
||||
);
|
||||
}
|
||||
|
||||
const itemsProperty = new Property<TabStrip, TabStripItem[]>({
|
||||
name: "items", valueChanged: (target, oldValue, newValue) => {
|
||||
target.onItemsChanged(oldValue, newValue);
|
||||
}
|
||||
name: "items",
|
||||
valueChanged: (target, oldValue, newValue) => {
|
||||
target.onItemsChanged(oldValue, newValue);
|
||||
},
|
||||
});
|
||||
itemsProperty.register(TabStrip);
|
||||
|
||||
export const iosIconRenderingModeProperty = new Property<TabStrip, "automatic" | "alwaysOriginal" | "alwaysTemplate">({ name: "iosIconRenderingMode", defaultValue: "automatic" });
|
||||
export const iosIconRenderingModeProperty = new Property<
|
||||
TabStrip,
|
||||
"automatic" | "alwaysOriginal" | "alwaysTemplate"
|
||||
>({ name: "iosIconRenderingMode", defaultValue: "automatic" });
|
||||
iosIconRenderingModeProperty.register(TabStrip);
|
||||
|
||||
export const isIconSizeFixedProperty = new Property<TabStrip, boolean>({
|
||||
name: "isIconSizeFixed", defaultValue: true, valueConverter: booleanConverter
|
||||
name: "isIconSizeFixed",
|
||||
defaultValue: true,
|
||||
valueConverter: booleanConverter,
|
||||
});
|
||||
isIconSizeFixedProperty.register(TabStrip);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user