1 | var TabViewBase_1;
|
2 | import { View, CSSType } from '../core/view';
|
3 | import { ViewBase, booleanConverter } from '../core/view-base';
|
4 | import { Style } from '../styling/style';
|
5 | import { Color } from '../../color';
|
6 | import { Property, CssProperty, CoercibleProperty } from '../core/properties';
|
7 | import { Trace } from '../../trace';
|
8 | export const traceCategory = 'TabView';
|
9 | let TabViewItemBase = class TabViewItemBase extends ViewBase {
|
10 | constructor() {
|
11 | super(...arguments);
|
12 | this._title = '';
|
13 | }
|
14 | get textTransform() {
|
15 | return this.style.textTransform;
|
16 | }
|
17 | set textTransform(value) {
|
18 | this.style.textTransform = value;
|
19 | }
|
20 | _addChildFromBuilder(name, value) {
|
21 | if (value instanceof View) {
|
22 | this.view = value;
|
23 | }
|
24 | }
|
25 | get title() {
|
26 | return this._title;
|
27 | }
|
28 | set title(value) {
|
29 | if (this._title !== value) {
|
30 | this._title = value;
|
31 | this._update();
|
32 | }
|
33 | }
|
34 | get view() {
|
35 | return this._view;
|
36 | }
|
37 | set view(value) {
|
38 | if (this._view !== value) {
|
39 | if (this._view) {
|
40 | throw new Error('Changing the view of an already loaded TabViewItem is not currently supported.');
|
41 | }
|
42 | this._view = value;
|
43 | this._addView(value);
|
44 | }
|
45 | }
|
46 | get iconSource() {
|
47 | return this._iconSource;
|
48 | }
|
49 | set iconSource(value) {
|
50 | if (this._iconSource !== value) {
|
51 | this._iconSource = value;
|
52 | this._update();
|
53 | }
|
54 | }
|
55 | eachChild(callback) {
|
56 | const view = this._view;
|
57 | if (view) {
|
58 | callback(view);
|
59 | }
|
60 | }
|
61 | loadView(view) {
|
62 | const tabView = this.parent;
|
63 | if (tabView && tabView.items) {
|
64 |
|
65 | if (this.canBeLoaded) {
|
66 | super.loadView(view);
|
67 | }
|
68 | }
|
69 | }
|
70 | };
|
71 | TabViewItemBase = __decorate([
|
72 | CSSType('TabViewItem')
|
73 | ], TabViewItemBase);
|
74 | export { TabViewItemBase };
|
75 | let TabViewBase = TabViewBase_1 = class TabViewBase extends View {
|
76 | get androidSelectedTabHighlightColor() {
|
77 | return this.style.androidSelectedTabHighlightColor;
|
78 | }
|
79 | set androidSelectedTabHighlightColor(value) {
|
80 | this.style.androidSelectedTabHighlightColor = value;
|
81 | }
|
82 | get tabTextFontSize() {
|
83 | return this.style.tabTextFontSize;
|
84 | }
|
85 | set tabTextFontSize(value) {
|
86 | this.style.tabTextFontSize = value;
|
87 | }
|
88 | get tabTextColor() {
|
89 | return this.style.tabTextColor;
|
90 | }
|
91 | set tabTextColor(value) {
|
92 | this.style.tabTextColor = value;
|
93 | }
|
94 | get tabBackgroundColor() {
|
95 | return this.style.tabBackgroundColor;
|
96 | }
|
97 | set tabBackgroundColor(value) {
|
98 | this.style.tabBackgroundColor = value;
|
99 | }
|
100 | get selectedTabTextColor() {
|
101 | return this.style.selectedTabTextColor;
|
102 | }
|
103 | set selectedTabTextColor(value) {
|
104 | this.style.selectedTabTextColor = value;
|
105 | }
|
106 | _addArrayFromBuilder(name, value) {
|
107 | if (name === 'items') {
|
108 | this.items = value;
|
109 | }
|
110 | }
|
111 | _addChildFromBuilder(name, value) {
|
112 | if (value instanceof TabViewItemBase) {
|
113 | if (!this.items) {
|
114 | this.items = new Array();
|
115 | }
|
116 | this.items.push(value);
|
117 | this._addView(value);
|
118 | selectedIndexProperty.coerce(this);
|
119 | }
|
120 | }
|
121 | get _selectedView() {
|
122 | const selectedIndex = this.selectedIndex;
|
123 | return selectedIndex > -1 ? this.items[selectedIndex].view : null;
|
124 | }
|
125 | get _childrenCount() {
|
126 | const items = this.items;
|
127 | return items ? items.length : 0;
|
128 | }
|
129 | eachChild(callback) {
|
130 | const items = this.items;
|
131 | if (items) {
|
132 | items.forEach((item, i) => {
|
133 | callback(item);
|
134 | });
|
135 | }
|
136 | }
|
137 | eachChildView(callback) {
|
138 | const items = this.items;
|
139 | if (items) {
|
140 | items.forEach((item, i) => {
|
141 | callback(item.view);
|
142 | });
|
143 | }
|
144 | }
|
145 | onItemsChanged(oldItems, newItems) {
|
146 | if (oldItems) {
|
147 | oldItems.forEach((item) => this._removeView(item));
|
148 | }
|
149 | if (newItems) {
|
150 | newItems.forEach((item) => {
|
151 | if (!item.view) {
|
152 | throw new Error(`TabViewItem must have a view.`);
|
153 | }
|
154 | this._addView(item);
|
155 | });
|
156 | }
|
157 | }
|
158 | onSelectedIndexChanged(oldIndex, newIndex) {
|
159 |
|
160 | this.notify({
|
161 | eventName: TabViewBase_1.selectedIndexChangedEvent,
|
162 | object: this,
|
163 | oldIndex,
|
164 | newIndex,
|
165 | });
|
166 | }
|
167 | };
|
168 | TabViewBase.selectedIndexChangedEvent = 'selectedIndexChanged';
|
169 | TabViewBase = TabViewBase_1 = __decorate([
|
170 | CSSType('TabView')
|
171 | ], TabViewBase);
|
172 | export { TabViewBase };
|
173 | export function traceMissingIcon(icon) {
|
174 | Trace.write('Could not load tab bar icon: ' + icon, Trace.categories.Error, Trace.messageType.error);
|
175 | }
|
176 | export const selectedIndexProperty = new CoercibleProperty({
|
177 | name: 'selectedIndex',
|
178 | defaultValue: -1,
|
179 | affectsLayout: __APPLE__,
|
180 | valueChanged: (target, oldValue, newValue) => {
|
181 | target.onSelectedIndexChanged(oldValue, newValue);
|
182 | },
|
183 | coerceValue: (target, value) => {
|
184 | const items = target.items;
|
185 | if (items) {
|
186 | const max = items.length - 1;
|
187 | if (value < 0) {
|
188 | value = 0;
|
189 | }
|
190 | if (value > max) {
|
191 | value = max;
|
192 | }
|
193 | }
|
194 | else {
|
195 | value = -1;
|
196 | }
|
197 | return value;
|
198 | },
|
199 | valueConverter: (v) => parseInt(v),
|
200 | });
|
201 | selectedIndexProperty.register(TabViewBase);
|
202 | export const itemsProperty = new Property({
|
203 | name: 'items',
|
204 | valueChanged: (target, oldValue, newValue) => {
|
205 | target.onItemsChanged(oldValue, newValue);
|
206 | },
|
207 | });
|
208 | itemsProperty.register(TabViewBase);
|
209 | export const iosIconRenderingModeProperty = new Property({ name: 'iosIconRenderingMode', defaultValue: 'automatic' });
|
210 | iosIconRenderingModeProperty.register(TabViewBase);
|
211 | export const androidIconRenderingModeProperty = new Property({ name: 'androidIconRenderingMode', defaultValue: 'alwaysOriginal' });
|
212 | androidIconRenderingModeProperty.register(TabViewBase);
|
213 | export const androidOffscreenTabLimitProperty = new Property({
|
214 | name: 'androidOffscreenTabLimit',
|
215 | defaultValue: 1,
|
216 | affectsLayout: __APPLE__,
|
217 | valueConverter: (v) => parseInt(v),
|
218 | });
|
219 | androidOffscreenTabLimitProperty.register(TabViewBase);
|
220 | export const androidTabsPositionProperty = new Property({ name: 'androidTabsPosition', defaultValue: 'top' });
|
221 | androidTabsPositionProperty.register(TabViewBase);
|
222 | export const androidSwipeEnabledProperty = new Property({
|
223 | name: 'androidSwipeEnabled',
|
224 | defaultValue: true,
|
225 | valueConverter: booleanConverter,
|
226 | });
|
227 | androidSwipeEnabledProperty.register(TabViewBase);
|
228 | export const tabTextFontSizeProperty = new CssProperty({
|
229 | name: 'tabTextFontSize',
|
230 | cssName: 'tab-text-font-size',
|
231 | valueConverter: (v) => parseFloat(v),
|
232 | });
|
233 | tabTextFontSizeProperty.register(Style);
|
234 | export const tabTextColorProperty = new CssProperty({
|
235 | name: 'tabTextColor',
|
236 | cssName: 'tab-text-color',
|
237 | equalityComparer: Color.equals,
|
238 | valueConverter: (v) => new Color(v),
|
239 | });
|
240 | tabTextColorProperty.register(Style);
|
241 | export const tabBackgroundColorProperty = new CssProperty({
|
242 | name: 'tabBackgroundColor',
|
243 | cssName: 'tab-background-color',
|
244 | equalityComparer: Color.equals,
|
245 | valueConverter: (v) => new Color(v),
|
246 | });
|
247 | tabBackgroundColorProperty.register(Style);
|
248 | export const selectedTabTextColorProperty = new CssProperty({
|
249 | name: 'selectedTabTextColor',
|
250 | cssName: 'selected-tab-text-color',
|
251 | equalityComparer: Color.equals,
|
252 | valueConverter: (v) => new Color(v),
|
253 | });
|
254 | selectedTabTextColorProperty.register(Style);
|
255 | export const androidSelectedTabHighlightColorProperty = new CssProperty({
|
256 | name: 'androidSelectedTabHighlightColor',
|
257 | cssName: 'android-selected-tab-highlight-color',
|
258 | equalityComparer: Color.equals,
|
259 | valueConverter: (v) => new Color(v),
|
260 | });
|
261 | androidSelectedTabHighlightColorProperty.register(Style);
|
262 |
|
\ | No newline at end of file |