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

feat(bottom-nav): adding new properties

Browse Source
This commit is contained in:
Vasko
2020-03-12 14:21:15 +02:00
parent c60b35d590
commit 40a8fb9c2d
5 changed files with 161 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -258,6 +258,9 @@ export class BottomNavigation extends TabNavigationBase {
private _moreNavigationControllerDelegate: UINavigationControllerDelegateImpl;
private _iconsCache = {};
private _selectedItemColor: Color;
private _unSelectedItemColor: Color;
constructor() {
super();
@@ -372,18 +375,20 @@ export class BottomNavigation extends TabNavigationBase {
}
public setTabBarItemColor(tabStripItem: TabStripItem, value: UIColor | Color): void {
setViewTextAttributes(tabStripItem.nativeView, tabStripItem.label, this.viewController.tabBar);
this.setViewTextAttributes(tabStripItem.nativeView, tabStripItem.label);
}
public setTabBarIconColor(tabStripItem: TabStripItem, value: UIColor | Color): void {
const image = this.getIcon(tabStripItem);
if (!this._unSelectedItemColor && !this._selectedItemColor) {
const image = this.getIcon(tabStripItem);
tabStripItem.nativeView.image = image;
tabStripItem.nativeView.selectedImage = image;
tabStripItem.nativeView.image = image;
tabStripItem.nativeView.selectedImage = image;
}
}
public setTabBarItemFontInternal(tabStripItem: TabStripItem, value: Font): void {
setViewTextAttributes(tabStripItem.nativeView, tabStripItem.label, this.viewController.tabBar);
this.setViewTextAttributes(tabStripItem.nativeView, tabStripItem.label);
}
public setTabBarItemTextTransform(tabStripItem: TabStripItem, value: TextTransform): void {
@@ -400,6 +405,22 @@ export class BottomNavigation extends TabNavigationBase {
this._ios.tabBar.tintColor = nativeColor;
}
public getTabBarSelectedItemColor(): Color {
return this._selectedItemColor;
}
public setTabBarSelectedItemColor(value: Color) {
this._selectedItemColor = value;
}
public getTabBarUnSelectedItemColor(): Color {
return this._unSelectedItemColor;
}
public setTabBarUnSelectedItemColor(value: Color) {
this._unSelectedItemColor = value;
}
public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number): void {
const width = layout.getMeasureSpecSize(widthMeasureSpec);
const widthMode = layout.getMeasureSpecMode(widthMeasureSpec);
@@ -521,7 +542,7 @@ export class BottomNavigation extends TabNavigationBase {
const tabBarItem = this.createTabBarItem(tabStripItem, i);
updateTitleAndIconPositions(tabStripItem, tabBarItem, controller);
setViewTextAttributes(tabBarItem, tabStripItem.label, this.viewController.tabBar);
this.setViewTextAttributes(tabBarItem, tabStripItem.label);
controller.tabBarItem = tabBarItem;
tabStripItem._index = i;
@@ -531,6 +552,8 @@ export class BottomNavigation extends TabNavigationBase {
controllers.addObject(controller);
});
this._setItemImages();
this._ios.viewControllers = controllers;
this._ios.customizableViewControllers = null;
@@ -538,6 +561,23 @@ export class BottomNavigation extends TabNavigationBase {
this._ios.moreNavigationController.delegate = this._moreNavigationControllerDelegate;
}
private _setItemImages() {
if (this._selectedItemColor || this._unSelectedItemColor) {
if (this.tabStrip && this.tabStrip.items) {
this.tabStrip.items.forEach(item => {
if (this._unSelectedItemColor && item.nativeView) {
item.nativeView.image = this.getIcon(item, this._unSelectedItemColor);
item.nativeView.tintColor = this._unSelectedItemColor;
}
if (this._selectedItemColor && item.nativeView) {
item.nativeView.selectedImage = this.getIcon(item, this._selectedItemColor);
item.nativeView.tintColor = this._selectedItemColor;
}
});
}
}
}
private createTabBarItem(item: TabStripItem, index: number): UITabBarItem {
let image: UIImage;
let title: string;
@@ -569,7 +609,7 @@ export class BottomNavigation extends TabNavigationBase {
}
}
private getIcon(tabStripItem: TabStripItem): UIImage {
private getIcon(tabStripItem: TabStripItem, color?: Color): UIImage {
// Image and Label children of TabStripItem
// take priority over its `iconSource` and `title` properties
const iconSource = tabStripItem.image && tabStripItem.image.src;
@@ -579,7 +619,9 @@ export class BottomNavigation extends TabNavigationBase {
const target = tabStripItem.image;
const font = target.style.fontInternal;
const color = target.style.color;
if (!color) {
color = target.style.color;
}
const iconTag = [iconSource, font.fontStyle, font.fontWeight, font.fontSize, font.fontFamily, color].join(";");
let isFontIcon = false;
@@ -688,33 +730,39 @@ export class BottomNavigation extends TabNavigationBase {
this.setViewControllers(this.items);
selectedIndexProperty.coerce(this);
}
}
function setViewTextAttributes(item: UITabBarItem, view: View, tabBar: UITabBar): any {
if (!view) {
return null;
}
private setViewTextAttributes(item: UITabBarItem, view: View): any {
if (!view) {
return null;
}
const defaultTabItemFontSize = 10;
const tabItemFontSize = view.style.fontSize || defaultTabItemFontSize;
const font: UIFont = view.style.fontInternal.getUIFont(UIFont.systemFontOfSize(tabItemFontSize));
const tabItemTextColor = view.style.color;
const textColor = tabItemTextColor instanceof Color ? tabItemTextColor.ios : null;
let attributes: any = { [NSFontAttributeName]: font };
if (textColor) {
attributes[UITextAttributeTextColor] = textColor;
attributes[NSForegroundColorAttributeName] = textColor;
}
const defaultTabItemFontSize = 10;
const tabItemFontSize = view.style.fontSize || defaultTabItemFontSize;
const font: UIFont = view.style.fontInternal.getUIFont(UIFont.systemFontOfSize(tabItemFontSize));
const tabItemTextColor = view.style.color;
const textColor = tabItemTextColor instanceof Color ? tabItemTextColor.ios : null;
let attributes: any = { [NSFontAttributeName]: font };
item.setTitleTextAttributesForState(attributes, UIControlState.Selected);
item.setTitleTextAttributesForState(attributes, UIControlState.Normal);
if (!this._selectedItemColor && !this._unSelectedItemColor) {
if (textColor) {
attributes[UITextAttributeTextColor] = textColor;
attributes[NSForegroundColorAttributeName] = textColor;
}
} else {
this.viewController.tabBar.unselectedItemTintColor = this._unSelectedItemColor && this._unSelectedItemColor.ios;
this.viewController.tabBar.selectedImageTintColor = this._selectedItemColor && this._selectedItemColor.ios;
}
// there's a bug when setting the item color on ios 13 if there's no background set to the tabstrip
// https://books.google.bg/books?id=99_BDwAAQBAJ&q=tabBar.unselectedItemTintColor
// to fix the above issue we are applying the selected fix only for the case, when there is no background set
// in that case we have the following known issue:
// we will set the color to all unselected items, so you won't be able to set different colors for the different not selected items
if (!tabBar.barTintColor && attributes[UITextAttributeTextColor] && (majorVersion > 9)) {
tabBar.unselectedItemTintColor = attributes[UITextAttributeTextColor];
item.setTitleTextAttributesForState(attributes, UIControlState.Selected);
item.setTitleTextAttributesForState(attributes, UIControlState.Normal);
// there's a bug when setting the item color on ios 13 if there's no background set to the tabstrip
// https://books.google.bg/books?id=99_BDwAAQBAJ&q=tabBar.unselectedItemTintColor
// to fix the above issue we are applying the selected fix only for the case, when there is no background set
// in that case we have the following known issue:
// // we will set the color to all unselected items, so you won't be able to set different colors for the different not selected items
if (!this.viewController.tabBar.barTintColor && attributes[UITextAttributeTextColor] && (majorVersion > 9)) {
this.viewController.tabBar.unselectedItemTintColor = attributes[UITextAttributeTextColor];
}
}
}