我正在使用FlatList来显示两列中的项目列表
<FlatList style={{margin:5}}
data={this.state.items}
numColumns={2}
keyExtractor={(item,index) => item.id }
renderItem={(item) => <Card image={item.item.gallery_image_url} text={item.item.name}/> }
/>
卡组件只是一些样式的视图：
<View style={{ flex: 1,margin: 5,backgroundColor: '#ddd',height: 130}} ></View>
它工作正常,但是如果项目数量是奇数,最后一行只包含一个项目,该项目延伸到屏幕的整个宽度.
如何设置项目与其他的宽度相同？
这几个东西你可以在这里尝试.
A)设置卡的预定义宽度(可能等于您设置的高度)？然后,您可以使用alignItems以使卡位于中间或左侧 – 不确定您想要在这里.
B)如果存在偶数张卡,则可以在末尾添加一个空的视图,以便填满这个空格.我发现这个方法很笨重,但是当试图为未来的元素留下空间时,这个方法很有用.
C)只需使用alignItems：’space-between,我喜欢使用它来对齐项目,但是你必须定义宽度,或者使用像flex这样的东西：0.5
我建议更多地研究flexBox来帮助你,因为很难说出这种情况的背景.我假设上述方法会有所帮助,但如果没有,这里有一些链接可供您查看 –
希望这可以帮助.如果你需要进一步的澄清 – 只是问
