Skip to content

Commit 57c8461

Browse files
farfromrefugfarfromrefug
committed
fix(tabs): fix wrongly rendered icons
1 parent 399d80b commit 57c8461

File tree

3 files changed

+45
-26
lines changed

3 files changed

+45
-26
lines changed

‎src/bottom-navigation/index.android.ts

Lines changed: 22 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -50,19 +50,19 @@ function initializeNativeClasses() {
5050
@CSSType('BottomNavigation')
5151
export class BottomNavigation extends TabNavigation<com.nativescript.material.core.BottomNavigationBar> {
5252
tabsPosition = TabsPosition.Bottom;
53-
protected updateTabsBarItemAt(position: number, itemSpec: com.nativescript.material.core.TabItemSpec) {
53+
protected override updateTabsBarItemAt(position: number, itemSpec: com.nativescript.material.core.TabItemSpec) {
5454
this.mTabsBar.updateItemAt(position, itemSpec);
5555
}
56-
protected setTabsBarSelectedIndicatorColors(colors: number[]) {
56+
protected override setTabsBarSelectedIndicatorColors(colors: number[]) {
5757
// nothing to do
5858
}
59-
protected getTabBarItemView(index: number) {
59+
protected override getTabBarItemView(index: number) {
6060
return this.mTabsBar.getViewForItemAt(index);
6161
}
62-
protected getTabBarItemTextView(index: number) {
62+
protected override getTabBarItemTextView(index: number) {
6363
return this.mTabsBar.getTextViewForItemAt(index);
6464
}
65-
protected createNativeTabBar(context: android.content.Context) {
65+
protected override createNativeTabBar(context: android.content.Context) {
6666
initializeNativeClasses();
6767
const tabsBar = new BottomNavigationBar(context, this);
6868
const primaryColor = Utils.android.resources.getPaletteColor(PRIMARY_COLOR, context);
@@ -73,11 +73,11 @@ export class BottomNavigation extends TabNavigation<com.nativescript.material.co
7373
return tabsBar;
7474
}
7575

76-
protected setTabBarItems(tabItems: com.nativescript.material.core.TabItemSpec[], viewPager: com.nativescript.material.core.TabViewPager) {
76+
protected override setTabBarItems(tabItems: com.nativescript.material.core.TabItemSpec[], viewPager: com.nativescript.material.core.TabViewPager) {
7777
this.mTabsBar.setItems(tabItems);
7878
}
7979

80-
protected selectTabBar(oldIndex: number, newIndex: number) {
80+
protected override selectTabBar(oldIndex: number, newIndex: number) {
8181
this.mTabsBar.setSelectedPosition(newIndex);
8282
}
8383

@@ -99,7 +99,7 @@ export class BottomNavigation extends TabNavigation<com.nativescript.material.co
9999
// this.changeTab(this.selectedIndex);
100100
}
101101

102-
public updateAndroidItemAt(index: number, spec: com.nativescript.material.core.TabItemSpec) {
102+
public override updateAndroidItemAt(index: number, spec: com.nativescript.material.core.TabItemSpec) {
103103
// that try catch is fix for an android NPE error on css change which navigated in (not the current fragment)
104104
try {
105105
if (this.mTabsBar) {
@@ -108,7 +108,7 @@ export class BottomNavigation extends TabNavigation<com.nativescript.material.co
108108
} catch (err) {}
109109
}
110110

111-
public setTabBarBackgroundColor(value: android.graphics.drawable.Drawable | Color): void {
111+
public override setTabBarBackgroundColor(value: android.graphics.drawable.Drawable | Color): void {
112112
super.setTabBarBackgroundColor(value);
113113
// this.updateTabStripItems();
114114
}
@@ -130,19 +130,28 @@ export class BottomNavigation extends TabNavigation<com.nativescript.material.co
130130
});
131131
}
132132

133-
public setTabBarSelectedItemColor(value: Color) {
133+
public override setTabBarSelectedItemColor(value: Color) {
134134
super.setTabBarSelectedItemColor(value);
135135
this._setItemsColors(this.tabStrip.items);
136136
}
137137

138-
public setTabBarUnSelectedItemColor(value: Color) {
138+
public override setTabBarUnSelectedItemColor(value: Color) {
139139
super.setTabBarUnSelectedItemColor(value);
140140
this._setItemsColors(this.tabStrip.items);
141141
}
142142

143-
public onTabsBarSelectedPositionChange(position: number, prevPosition: number) {
144-
super.onTabsBarSelectedPositionChange(position, prevPosition);
143+
public override onTabsBarSelectedPositionChange(position: number, prevPosition: number): void {
145144
this.mViewPager.setCurrentItem(position, true);
145+
const tabStripItems = this.tabStrip && this.tabStrip.items;
146+
147+
if (position >= 0 && tabStripItems && tabStripItems[position]) {
148+
tabStripItems[position]._emit(TabStripItem.selectEvent);
149+
}
150+
151+
if (prevPosition >= 0 && tabStripItems && tabStripItems[prevPosition]) {
152+
tabStripItems[prevPosition]._emit(TabStripItem.unselectEvent);
153+
}
154+
146155
this._setItemsColors(this.tabStrip.items);
147156
}
148157
}

‎src/core/tab-navigation-base/tab-navigation/index.android.ts

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -505,7 +505,6 @@ export abstract class TabNavigation<T extends android.view.ViewGroup = any> exte
505505
const context = this._context;
506506
const tabsBar = (this.mTabsBar = this.createNativeTabBar(context));
507507
setElevation(null, tabsBar, this.tabsPosition);
508-
console.log('handleTabStripChanged', this.tabsPosition);
509508
if (this.tabsPosition !== TabsPosition.Top) {
510509
tabsBar.setLayoutParams(this.tabBarLayoutParams);
511510
}
@@ -757,7 +756,7 @@ export abstract class TabNavigation<T extends android.view.ViewGroup = any> exte
757756
}
758757
}
759758

760-
private setTabStripItems(items: TabStripItem[]) {
759+
protected setTabStripItems(items: TabStripItem[]) {
761760
const length = items ? items.length : 0;
762761
if (length === 0) {
763762
if (this.mTabsBar) {
@@ -768,9 +767,6 @@ export abstract class TabNavigation<T extends android.view.ViewGroup = any> exte
768767

769768
const tabItems = new Array<com.nativescript.material.core.TabItemSpec>();
770769
items.forEach((tabStripItem: TabStripItem, i, arr) => {
771-
if (!this.mUnSelectedItemColor) {
772-
this.mUnSelectedItemColor = tabStripItem.label?.style.color;
773-
}
774770
tabStripItem._index = i;
775771
const tabItemSpec = this.createTabItemSpec(tabStripItem);
776772
(tabStripItem as any).tabItemSpec = tabItemSpec;

‎src/tabs/index.android.ts

Lines changed: 22 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -48,19 +48,19 @@ function initializeNativeClasses() {
4848

4949
@CSSType('Tabs')
5050
export class Tabs extends TabNavigation<TabsBar> {
51-
protected updateTabsBarItemAt(position: number, itemSpec: com.nativescript.material.core.TabItemSpec) {
51+
protected override updateTabsBarItemAt(position: number, itemSpec: com.nativescript.material.core.TabItemSpec) {
5252
this.mTabsBar.updateItemAt(position, itemSpec);
5353
}
54-
protected setTabsBarSelectedIndicatorColors(colors: number[]) {
54+
protected override setTabsBarSelectedIndicatorColors(colors: number[]) {
5555
this.mTabsBar.setSelectedIndicatorColors(colors);
5656
}
57-
protected getTabBarItemView(index: number) {
57+
protected override getTabBarItemView(index: number) {
5858
return this.mTabsBar.getViewForItemAt(index);
5959
}
60-
protected getTabBarItemTextView(index: number) {
60+
protected override getTabBarItemTextView(index: number) {
6161
return this.mTabsBar.getTextViewForItemAt(index);
6262
}
63-
protected createNativeTabBar(context: android.content.Context) {
63+
protected override createNativeTabBar(context: android.content.Context) {
6464
initializeNativeClasses();
6565
const tabsBar = new TabsBar(context, this);
6666
const primaryColor = Utils.android.resources.getPaletteColor(PRIMARY_COLOR, context);
@@ -75,15 +75,29 @@ export class Tabs extends TabNavigation<TabsBar> {
7575
return tabsBar;
7676
}
7777

78-
protected setTabBarItems(tabItems: com.nativescript.material.core.TabItemSpec[], viewPager: com.nativescript.material.core.TabViewPager) {
78+
protected override setTabBarItems(tabItems: com.nativescript.material.core.TabItemSpec[], viewPager: com.nativescript.material.core.TabViewPager) {
7979
this.mTabsBar.setItems(tabItems, viewPager);
8080
}
8181

82-
protected selectTabBar(oldIndex: number, newIndex: number) {
82+
protected override selectTabBar(oldIndex: number, newIndex: number) {
8383
this.mTabsBar.onSelectedPositionChange(oldIndex, newIndex);
8484
}
8585

86-
public onLoaded(): void {
86+
protected override setTabStripItems(items: TabStripItem[]) {
87+
if (items.length > 0 && !this.mUnSelectedItemColor) {
88+
items.some((item) => {
89+
const color = item.label?.style.color;
90+
if (color) {
91+
this.mUnSelectedItemColor = color;
92+
return true;
93+
}
94+
return false;
95+
});
96+
}
97+
super.setTabStripItems(items);
98+
}
99+
100+
public override onLoaded(): void {
87101
super.onLoaded();
88102

89103
if (!this.tabStrip && this.mTabsBar) {

0 commit comments

Comments
 (0)