ScrollView 中图像的网格视图 - React Native

Question

所以本周我开始了我的第一个宠物项目，以亲身体验 RN 的学习经验。到目前为止，我认为很好。但是现在我遇到了一些障碍，所以我希望有人能帮助我。所以我有一个图像视图（来自 api）。我可以将图像放在网格视图中，如下所示：

但是一旦我将此视图放入 Flatlist 中，整个布局就会变得一团糟。看起来像这样：

我尝试过使用 flex 但无济于事。任何帮助将非常感激

代码可以在这里找到：更新：https ://gist.github.com/anonymous/c565d8f9d7dfa65646b7a3a81bf6330f

Answer 1

FlatList 有一个 numColumns 属性。尝试：

<FlatList style={styles.FlatlistStyles} data={this.state.moviesTrending}
  numColumns={4}
  renderItem={({item}) => this.renderMoviesTrending(item)}
  keyExtractor={this._keyExtractor}
 />

并向style={{ width: 200 }}子元素添加宽度或任何适当的宽度（由 renderMoviesTrending 函数呈现）。