如何创建具有多行和动态宽度的项目的水平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>