React Native Custom Scrollable Tabbar with Dynamic Content

Question

我想在React Native中创建一个具有以下特征的标签栏：

• 自定义用户界面（自定义标签样式和标签栏末尾的“创建标签按钮”）
• 可滚动（更多标签，然后需要宽度）
• 动态内容（单击标签栏中的按钮会创建一个新标签）

按下按钮应在选项卡列表的末尾创建另一个选项卡。

我尝试过Native base Tabs，但无法将按钮放在选项卡栏中。我也尝试使用React Navigation进行操作，但是很难覆盖tabBarComponent，尤其是使用position参数来显示活动标签并在标签之间进行动画处理。

问题：如何在React Native中完成？某处有示例吗？

Answer 1

我认为您可以使用scrollView和TouchableOpacity(button)。

如果我愿意，可以使用Scrollview，这样我就可以滚动[[水平。

并使用map或其他在Scrollview中添加按钮，所以有尽可能多的按钮。

如果您想去某个地方，只需在地图组件中添加功能。

加上，最后一个按钮，我在Scrollview中单独添加。

所以可以有简单的代码，

<ScrollView horizontal={true}>
    {this.state.list.map((item, i) => (
        <TheButtonYouWant/>
    ))}
    <AddButtonYouWant/>
<ScrollView>