1回答

CrazyCodeBoy

2017-06-19

已采纳

不加就是默认的DefaultTabBar，三者的区别也就是DefaultTabBar与ScrollableTabBar的区别，现在说一下两者的区别，官方没有相应的说明文档，现在说一下我的理解哈：

1. DefaultTabBar：默认的TabBar，支持自定义背景色、下划线、选中状态下和未选中状态下文字颜色等，如下代码：

goToPage: React.PropTypes.func,    
activeTab: React.PropTypes.number,    
tabs: React.PropTypes.array,    
backgroundColor: React.PropTypes.string,    
activeTextColor: React.PropTypes.string,    
inactiveTextColor: React.PropTypes.string,    
textStyle: Text.propTypes.style,    
tabStyle: ViewPropTypes.style,    
renderTab: React.PropTypes.func,    
underlineStyle: ViewPropTypes.style,

2. ScrollableTabBar：是一个可滑动的TabBar，当TabBar的数量超过屏幕所能显示的范围后，ScrollableTabBar支持滑动来查看未显示的TabBar，从源码中可以看出：

return <View    
style={[styles.container, {backgroundColor: this.props.backgroundColor, }, this.props.style, ]}    
onLayout={this.onContainerLayout}    
>    
<ScrollView    
...
>    
...
</ScrollView>    
</View>;    
},

它支持DefaultTabBar的所有属性，在此基础上添加了滑动的功能。

提示：如果DefaultTabBar与ScrollableTabBar无法达到你的需求，也可以参照两个组件自定义一个。

0

1

雪挽

非常感谢！

2017-06-19

共1条回复