リストビューの列は、Iが反応-ネイティブを次のようにデータオブジェクトを使用して、上のリストビューを作成しようとしているアイテム

Question

の間に余分なスペースを残しスタイル：

const styles = StyleSheet.create({ 
container: { 
}, 
swiper: {  
    paddingTop: Metrics.navBarHeight, 
}, 
key: { 
    backgroundColor: '#9DD6EB', 
    width: (Metrics.screenWidth/4), 
    height: 60 
}, 
key2: { 
    backgroundColor: '#9DD6EB', 
    width: (Metrics.screenWidth/2), 
    height: 120 
}, 
basickey: { 
    textAlign: 'center', 
}, 
toggle: { 
    textAlign: 'center', 
}, 
keysWrapper: { 
    flex: 1, 
    flexDirection: 'row', 
    flexWrap: 'wrap', 
},  
text: { 
    textAlign: 'center', 
    backgroundColor: '#9DD6EB', 
    color: '#FFFFFF',  
}, 
}); 

Snapshot of current View

リストビューは正しく表示されますが、リストビューの行の間に空白を使用するようにしてください。画像をご覧ください。この場合、8.,11,12。そして13.番目の項目は上に移動する必要があります。

誰も私がこれを適切に解決する方法を知っていますか？

ありがとうございます！

Answer 1

多分これはあなたを助けることができますAuto responsive grid layout library for ReactNative