javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-11-05 13:26:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(tabs): dynamic styling fixes - iconSource

Browse Source 
selectedItemColor and unSelectedItemColor
This commit is contained in:
Vasko
2020-03-31 11:33:46 +03:00
parent 511415fb1f
commit 32a55d35ae
6 changed files with 68 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
nativescript-core/ui/bottom-navigation/bottom-navigation.android.ts
View File

@@ -752,18 +752,19 @@ export class BottomNavigation extends TabNavigationBase {
this.setItemsColors(this.tabStrip.items);
}
public setTabBarItemTitle(tabStripItem: TabStripItem, value: string): void {
private updateItem(tabStripItem: TabStripItem): void {
// TODO: Should figure out a way to do it directly with the the nativeView
const tabStripItemIndex = this.tabStrip.items.indexOf(tabStripItem);
const tabItemSpec = this.createTabItemSpec(tabStripItem);
this.updateAndroidItemAt(tabStripItemIndex, tabItemSpec);
}
public setTabBarItemTitle(tabStripItem: TabStripItem, value: string): void {
this.updateItem(tabStripItem);
}
public setTabBarItemBackgroundColor(tabStripItem: TabStripItem, value: android.graphics.drawable.Drawable | Color): void {
// TODO: Should figure out a way to do it directly with the the nativeView
const tabStripItemIndex = this.tabStrip.items.indexOf(tabStripItem);
const tabItemSpec = this.createTabItemSpec(tabStripItem);
this.updateAndroidItemAt(tabStripItemIndex, tabItemSpec);
this.updateItem(tabStripItem);
}
public _setItemColor(tabStripItem: TabStripItem) {
@@ -813,6 +814,10 @@ export class BottomNavigation extends TabNavigationBase {
this.setIconColor(tabStripItem);
}
public setTabBarIconSource(tabStripItem: TabStripItem, value: number | Color): void {
this.updateItem(tabStripItem);
}
public setTabBarItemFontInternal(tabStripItem: TabStripItem, value: Font): void {
if (value.fontSize) {
tabStripItem.nativeViewProtected.setTextSize(value.fontSize);

26
nativescript-core/ui/bottom-navigation/bottom-navigation.ios.ts
View File

@@ -377,6 +377,15 @@ export class BottomNavigation extends TabNavigationBase {
this.setViewAttributes(tabStripItem.nativeView, tabStripItem.label);
}
private setItemColors(): void {
if (this._selectedItemColor) {
this.viewController.tabBar.selectedImageTintColor = this._selectedItemColor.ios;
}
if (this._unSelectedItemColor) {
this.viewController.tabBar.unselectedItemTintColor = this._unSelectedItemColor.ios;
}
}
public setTabBarIconColor(tabStripItem: TabStripItem, value: UIColor | Color): void {
if (!this._unSelectedItemColor && !this._selectedItemColor) {
const image = this.getIcon(tabStripItem);
@@ -386,6 +395,10 @@ export class BottomNavigation extends TabNavigationBase {
}
}
public setTabBarIconSource(tabStripItem: TabStripItem, value: UIColor | Color): void {
this.updateItem(tabStripItem);
}
public setTabBarItemFontInternal(tabStripItem: TabStripItem, value: Font): void {
this.setViewAttributes(tabStripItem.nativeView, tabStripItem.label);
}
@@ -410,6 +423,7 @@ export class BottomNavigation extends TabNavigationBase {
public setTabBarSelectedItemColor(value: Color) {
this._selectedItemColor = value;
this.setItemColors();
}
public getTabBarUnSelectedItemColor(): Color {
@@ -418,6 +432,7 @@ export class BottomNavigation extends TabNavigationBase {
public setTabBarUnSelectedItemColor(value: Color) {
this._unSelectedItemColor = value;
this.setItemColors();
}
public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number): void {
@@ -577,6 +592,17 @@ export class BottomNavigation extends TabNavigationBase {
}
}
private updateItem(tabStripItem: TabStripItem): void {
const tabBarItem = this.createTabBarItem(tabStripItem, tabStripItem._index);
const tabBarItemController = this._ios.viewControllers[tabStripItem._index];
updateTitleAndIconPositions(tabStripItem, tabBarItem, tabBarItemController);
this.setViewAttributes(tabBarItem, tabStripItem.label);
tabBarItemController.tabBarItem = tabBarItem;
tabStripItem.setNativeView(tabBarItem);
}
private createTabBarItem(item: TabStripItem, index: number): UITabBarItem {
let image: UIImage;
let title: string;

6
nativescript-core/ui/tab-navigation-base/tab-navigation-base/tab-navigation-base.d.ts vendored
View File

@@ -210,6 +210,12 @@ export class TabNavigationBase extends View {
*/
setTabBarIconColor(tabStripItem: TabStripItem, value: any): void
/**
* @private
* Method is intended to be overridden by inheritors and used as "protected"
*/
setTabBarIconSource(tabStripItem: TabStripItem, value: any): void
/**
* @private
* Method is intended to be overridden by inheritors and used as "protected"

2
nativescript-core/ui/tab-navigation-base/tab-strip-item/tab-strip-item.ts
View File

@@ -162,7 +162,7 @@ export class TabStripItem extends View implements TabStripItemDefinition, AddChi
const parent = <TabStrip>this.parent;
const tabStripParent = parent && <TabNavigationBase>parent.parent;
return tabStripParent && tabStripParent.setTabBarIconColor(this, args.value);
return tabStripParent && tabStripParent.setTabBarIconSource(this, args.value);
});
this.image.on("srcChange", this._imageSrcHandler);
}

15
nativescript-core/ui/tabs/tabs.android.ts
View File

@@ -844,18 +844,19 @@ export class Tabs extends TabsBase {
this.setItemsColors(this.tabStrip.items);
}
public setTabBarItemTitle(tabStripItem: TabStripItem, value: string): void {
private updateItem(tabStripItem: TabStripItem): void {
// TODO: Should figure out a way to do it directly with the the nativeView
const tabStripItemIndex = this.tabStrip.items.indexOf(tabStripItem);
const tabItemSpec = this.createTabItemSpec(tabStripItem);
this.updateAndroidItemAt(tabStripItemIndex, tabItemSpec);
}
public setTabBarItemTitle(tabStripItem: TabStripItem, value: string): void {
this.updateItem(tabStripItem);
}
public setTabBarItemBackgroundColor(tabStripItem: TabStripItem, value: android.graphics.drawable.Drawable | Color): void {
// TODO: Should figure out a way to do it directly with the the nativeView
const tabStripItemIndex = this.tabStrip.items.indexOf(tabStripItem);
const tabItemSpec = this.createTabItemSpec(tabStripItem);
this.updateAndroidItemAt(tabStripItemIndex, tabItemSpec);
this.updateItem(tabStripItem);
}
public _setItemColor(tabStripItem: TabStripItem) {
@@ -905,6 +906,10 @@ export class Tabs extends TabsBase {
this.setIconColor(tabStripItem);
}
public setTabBarIconSource(tabStripItem: TabStripItem, value: number | Color): void {
this.updateItem(tabStripItem);
}
public setTabBarItemFontInternal(tabStripItem: TabStripItem, value: Font): void {
if (value.fontSize) {
tabStripItem.nativeViewProtected.setTextSize(value.fontSize);

15
nativescript-core/ui/tabs/tabs.ios.ts
View File

@@ -751,6 +751,17 @@ export class Tabs extends TabsBase {
}
}
private updateItem(tabStripItem: TabStripItem): void {
const tabBarItem = this.createTabBarItem(tabStripItem, tabStripItem._index);
const tabBarItemController = this._ios.viewControllers[tabStripItem._index];
updateTitleAndIconPositions(tabStripItem, tabBarItem, tabBarItemController);
this.setViewTextAttributes(tabStripItem.label);
tabBarItemController.tabBarItem = tabBarItem;
tabStripItem.setNativeView(tabBarItem);
}
private createTabBarItem(item: TabStripItem, index: number): UITabBarItem {
let image: UIImage;
let title: string;
@@ -966,6 +977,10 @@ export class Tabs extends TabsBase {
this.setIconColor(tabStripItem, true);
}
public setTabBarIconSource(tabStripItem: TabStripItem, value: UIColor | Color): void {
this.updateItem(tabStripItem);
}
public setTabBarItemFontInternal(tabStripItem: TabStripItem, value: Font): void {
this.setViewTextAttributes(tabStripItem.label);
}