score:101

Accepted answer

It is possible if you use percentage values for the widths:

<View style={styles.container}>
  <View style={styles.item}>
    ...
  </View>
</View>

const styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: 'row',
    flexWrap: 'wrap',
    alignItems: 'flex-start' // if you want to fill rows left to right
  },
  item: {
    width: '50%' // is 50% of container width
  }
})

score:1

you can try scrollview with flatlist. the code below generates 2 columns. if you want 3 columns change numcolumn={data.length/3} etc.

             <ScrollView
              horizontal
              showsVerticalScrollIndicator={false}
              showsHorizontalScrollIndicator={false}
              contentContainerStyle={{
                flexDirection: 'row',
                flexWrap: 'wrap',
              }}>
              <FlatList
                data={data}
                renderItem={this.renderItem}
                keyExtractor={item => `${item.id}`}
                showsHorizontalScrollIndicator={false}
                numColumns={data.length / 2}
              />
            </ScrollView>

Related Query

More Query from same tag