status-im/react-navigation
2
0
Fork 0
mirror of https://github.com/status-im/react-navigation.git synced 2025-02-25 01:28:16 +00:00
Code Issues Projects Releases Wiki Activity

Add showIcon to tabBarOptions so that icons can be hidden on iOS (#291)

Browse Source
This commit is contained in:
Jeremy Lu 2017-02-11 06:57:31 +08:00 committed by Satyajit Sahoo
parent a7002f2151
commit 546fc657d5
1 changed files with 8 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/views/TabView/TabBarBottom.js
View File

@ -42,6 +42,7 @@ type Props = {
showLabel: boolean; showLabel: boolean;
style: any; style: any;
labelStyle?: any; labelStyle?: any;
showIcon: boolean;
}; };
export default class TabBarBottom extends PureComponent<DefaultProps, Props, void> { export default class TabBarBottom extends PureComponent<DefaultProps, Props, void> {
@ -53,6 +54,7 @@ export default class TabBarBottom extends PureComponent<DefaultProps, Props, voi
inactiveTintColor: '#929292', // Default inactive tint color in iOS 10 inactiveTintColor: '#929292', // Default inactive tint color in iOS 10
inactiveBackgroundColor: 'transparent', inactiveBackgroundColor: 'transparent',
showLabel: true, showLabel: true,
showIcon: true,
}; };
props: Props; props: Props;
@ -98,7 +100,11 @@ export default class TabBarBottom extends PureComponent<DefaultProps, Props, voi
activeTintColor, activeTintColor,
inactiveTintColor, inactiveTintColor,
renderIcon, renderIcon,
showIcon,
} = this.props; } = this.props;
if (showIcon === false) {
return null;
}
return ( return (
<TabBarIcon <TabBarIcon
position={position} position={position}
@ -136,9 +142,10 @@ export default class TabBarBottom extends PureComponent<DefaultProps, Props, voi
inputRange, inputRange,
outputRange, outputRange,
}); });
const justifyContent = this.props.showIcon ? 'flex-end' : 'center';
return ( return (
<TouchableWithoutFeedback key={route.key} onPress={() => jumpToIndex(index)}> <TouchableWithoutFeedback key={route.key} onPress={() => jumpToIndex(index)}>
<Animated.View style={[styles.tab, { backgroundColor }]}> <Animated.View style={[styles.tab, { backgroundColor, justifyContent }]}>
{this._renderIcon(scene)} {this._renderIcon(scene)}
{this._renderLabel(scene)} {this._renderLabel(scene)}
</Animated.View> </Animated.View>