标签: react-native-scrollable-tab-view

当标签数量增加时,反应本机TAB视图拥塞

我正在使用react-native-tab-view屏幕顶部的显示选项卡。如果屏幕数量将增加(超过 5 个),屏幕视图看起来会很拥挤

下面是我的代码片段

export default class CustomTabViewComponent extends React.Component{
state = {
    index: 0,
    routes: [
      { key: 'tab1', title: 'Tab1' },
      { key: 'tab2', title: 'Tab2' },
      { key: 'tab3', title: 'Tab3' },
      { key: 'tab4', title: 'Tab4' },
      { key: 'tab5', title: 'Tab5' },
    ],
  };
render(){
   return(
   <TabView
          navigationState={this.state}
          renderScene={this.renderScene}
          renderTabBar={this._renderTabBar}
          onIndexChange={this.onIndexChange}
          initialLayout={{
            width: Dimensions.get('window').width,
            height: 100,
          }}
        />

)}
}
Run Code Online (Sandbox Code Playgroud)

我也发布图片以供参考。

在此处输入图片说明

是否有任何属性可以帮助我TabView使用单个选项卡固定宽度向右滚动?

PS:我尝试过,react-native-scrollable-tab-view但卡在同一个地方。

reactjs react-native react-native-tab-view react-native-scrollable-tab-view

1
推荐指数
1
解决办法
2848
查看次数