如何创建具有多行和动态宽度的项目的水平FlatList？

Question

我想做到一些类似的东西：

效果类似于带有自定义单元格的Swift的UICollectionView。

我应该如何在React Native中实现呢？

设置numColumns将无法达到预期的效果，因为我需要每行动态的单元格数量。那会将我限制为numColumns的值。每行应有尽可能多的项目。如果该行上没有更多内容，请添加到下一行。

谢谢！

Answer 1

您可以尝试使用flexWrap样式。并将文本视图设置为固定高度。宽度是自动的。

<View style={[{flexDirection: 'row', flexWrap: ' wrap'}]}>
         data.map(element => {
           return <Text style={{height:100}}>element.content</Text>
         })
        </View>