Skip to content

Commit 521e328

Browse files
vchimevADjenkov
vchimev
authored and
ADjenkov
committed
feat(android-tabs): create tab item spec from image and label
Implements NativeScript/nativescript-angular#1884 for Android.
1 parent 5dd9fbd commit 521e328

3 files changed

Lines changed: 105 additions & 86 deletions

File tree

‎tns-core-modules/ui/tab-navigation-base/tab-strip-item/tab-strip-item.d.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44
*/ /** */
55

66
import { View, EventData } from "../../core/view";
7+
import { Image } from "../../image/image";
8+
import { Label } from "../../label/label";
79

810
/**
911
* Represents a tab strip entry.
@@ -19,6 +21,16 @@ export class TabStripItem extends View {
1921
*/
2022
iconSource: string;
2123

24+
/**
25+
* Gets or sets the label of the tab strip entry.
26+
*/
27+
label: Label;
28+
29+
/**
30+
* Gets or sets the image of the tab strip entry.
31+
*/
32+
image: Image;
33+
2234
/**
2335
* String value used when hooking to the tap event.
2436
*/

‎tns-core-modules/ui/tabs/tabs.android.ts‎

Lines changed: 17 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -234,29 +234,34 @@ function initializeNativeClasses() {
234234
}
235235

236236
function createTabItemSpec(item: TabStripItem): org.nativescript.widgets.TabItemSpec {
237-
const result = new org.nativescript.widgets.TabItemSpec();
238-
result.title = item.title;
239-
240-
if (item.iconSource) {
241-
if (item.iconSource.indexOf(RESOURCE_PREFIX) === 0) {
242-
result.iconId = ad.resources.getDrawableId(item.iconSource.substr(RESOURCE_PREFIX.length));
243-
if (result.iconId === 0) {
237+
let iconSource;
238+
const tabItemSpec = new org.nativescript.widgets.TabItemSpec();
239+
240+
// Image and Label children of TabStripItem
241+
// take priority over its `iconSource` and `title` properties
242+
iconSource = item.image ? item.image.src : item.iconSource;
243+
tabItemSpec.title = item.label ? item.label.text : item.title;
244+
245+
if (iconSource) {
246+
if (iconSource.indexOf(RESOURCE_PREFIX) === 0) {
247+
tabItemSpec.iconId = ad.resources.getDrawableId(iconSource.substr(RESOURCE_PREFIX.length));
248+
if (tabItemSpec.iconId === 0) {
244249
// TODO
245-
// traceMissingIcon(item.iconSource);
250+
// traceMissingIcon(iconSource);
246251
}
247252
} else {
248-
const is = fromFileOrResource(item.iconSource);
253+
const is = fromFileOrResource(iconSource);
249254
if (is) {
250255
// TODO: Make this native call that accepts string so that we don't load Bitmap in JS.
251-
result.iconDrawable = new android.graphics.drawable.BitmapDrawable(application.android.context.getResources(), is.android);
256+
tabItemSpec.iconDrawable = new android.graphics.drawable.BitmapDrawable(application.android.context.getResources(), is.android);
252257
} else {
253258
// TODO
254-
// traceMissingIcon(item.iconSource);
259+
// traceMissingIcon(iconSource);
255260
}
256261
}
257262
}
258263

259-
return result;
264+
return tabItemSpec;
260265
}
261266

262267
let defaultAccentColor: number = undefined;

‎tns-core-modules/ui/tabs/tabs.d.ts‎

Lines changed: 76 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -1,81 +1,83 @@
11
/**
2-
* Contains the TabView class, which represents a standard content component with tabs.
3-
* @module "ui/tab-view"
2+
* Contains the Tabs class, which represents a tab navigation component.
3+
* @module "ui/tabs"
44
*/ /** */
55

6-
import { Property, EventData } from "../core/view";
7-
import { TabNavigationBase, SelectedIndexChangedEventData } from "../tab-navigation-base/tab-navigation-base";
8-
import { TabContentItem } from "../tab-navigation-base/tab-content-item";
9-
import { TabStrip } from "../tab-navigation-base/tab-strip";
6+
import { EventData, Property } from "../core/view";
7+
import { TabContentItem } from "../tab-navigation-base/tab-content-item";
8+
import {
9+
SelectedIndexChangedEventData, TabNavigationBase
10+
} from "../tab-navigation-base/tab-navigation-base";
11+
import { TabStrip } from "../tab-navigation-base/tab-strip";
1012

11-
export * from "../tab-navigation-base/tab-content-item";
12-
export * from "../tab-navigation-base/tab-navigation-base";
13-
export * from "../tab-navigation-base/tab-strip";
14-
export * from "../tab-navigation-base/tab-strip-item";
15-
16-
/**
17-
* Represents a swipeable tabs view.
18-
*/
19-
export class Tabs extends TabNavigationBase {
20-
/**
21-
* Gets or sets the items of the Tabs.
22-
*/
23-
items: Array<TabContentItem>;
24-
25-
/**
26-
* Gets or sets the tab strip of the Tabs.
27-
*/
28-
tabStrip: TabStrip;
29-
30-
/**
31-
* Gets or sets the selectedIndex of the Tabs.
32-
*/
33-
selectedIndex: number;
13+
export * from "../tab-navigation-base/tab-content-item";
14+
export * from "../tab-navigation-base/tab-navigation-base";
15+
export * from "../tab-navigation-base/tab-strip";
16+
export * from "../tab-navigation-base/tab-strip-item";
3417

35-
/**
36-
* Gets or sets the swipe enabled state of the Tabs.
37-
*/
38-
swipeEnabled: boolean;
18+
/**
19+
* Represents a swipeable tabs view.
20+
*/
21+
export class Tabs extends TabNavigationBase {
22+
/**
23+
* Gets or sets the items of the Tabs.
24+
*/
25+
items: Array<TabContentItem>;
3926

40-
/**
41-
* Gets or sets the number of offscreen preloaded tabs of the Tabs.
42-
*/
43-
offscreenTabLimit: number;
27+
/**
28+
* Gets or sets the tab strip of the Tabs.
29+
*/
30+
tabStrip: TabStrip;
4431

45-
/**
46-
* Gets or sets the position state of the Tabs.
47-
*/
48-
tabsPosition: "top" | "bottom";
49-
50-
/**
51-
* Gets the native [android widget](http://developer.android.com/reference/android/support/v4/view/ViewPager.html) that represents the user interface for this component. Valid only when running on Android OS.
52-
*/
53-
android: any /* android.view.View */; //android.support.v4.view.ViewPager;
54-
55-
/**
56-
* Gets the native iOS [UITabBarController](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UITabBarController_Class/) that represents the user interface for this component. Valid only when running on iOS.
57-
*/
58-
ios: any /* UITabBarController */;
59-
60-
/**
61-
* String value used when hooking to the selectedIndexChanged event.
62-
*/
63-
public static selectedIndexChangedEvent: string;
64-
65-
/**
66-
* A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
67-
* @param eventNames - String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").
68-
* @param callback - Callback function which will be executed when event is raised.
69-
* @param thisArg - An optional parameter which will be used as `this` context for callback execution.
70-
*/
71-
on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
72-
73-
/**
74-
* Raised when the selected index changes.
75-
*/
76-
on(event: "selectedIndexChanged", callback: (args: SelectedIndexChangedEventData) => void, thisArg?: any);
77-
}
78-
79-
export const itemsProperty: Property<Tabs, TabContentItem[]>;
80-
export const tabStripProperty: Property<Tabs, TabStrip>
81-
export const selectedIndexProperty: Property<Tabs, number>;
32+
/**
33+
* Gets or sets the selectedIndex of the Tabs.
34+
*/
35+
selectedIndex: number;
36+
37+
/**
38+
* Gets or sets the swipe enabled state of the Tabs.
39+
*/
40+
swipeEnabled: boolean;
41+
42+
/**
43+
* Gets or sets the number of offscreen preloaded tabs of the Tabs.
44+
*/
45+
offscreenTabLimit: number;
46+
47+
/**
48+
* Gets or sets the position state of the Tabs.
49+
*/
50+
tabsPosition: "top" | "bottom";
51+
52+
/**
53+
* Gets the native [android widget](http://developer.android.com/reference/android/support/v4/view/ViewPager.html) that represents the user interface for this component. Valid only when running on Android OS.
54+
*/
55+
android: any /* android.view.View */; //android.support.v4.view.ViewPager;
56+
57+
/**
58+
* Gets the native iOS [UITabBarController](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UITabBarController_Class/) that represents the user interface for this component. Valid only when running on iOS.
59+
*/
60+
ios: any /* UITabBarController */;
61+
62+
/**
63+
* String value used when hooking to the selectedIndexChanged event.
64+
*/
65+
public static selectedIndexChangedEvent: string;
66+
67+
/**
68+
* A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
69+
* @param eventNames - String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").
70+
* @param callback - Callback function which will be executed when event is raised.
71+
* @param thisArg - An optional parameter which will be used as `this` context for callback execution.
72+
*/
73+
on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
74+
75+
/**
76+
* Raised when the selected index changes.
77+
*/
78+
on(event: "selectedIndexChanged", callback: (args: SelectedIndexChangedEventData) => void, thisArg?: any);
79+
}
80+
81+
export const itemsProperty: Property<Tabs, TabContentItem[]>;
82+
export const tabStripProperty: Property<Tabs, TabStrip>
83+
export const selectedIndexProperty: Property<Tabs, number>;

0 commit comments

Comments
 (0)