FlatList numColumns и flex justifyContent проблема - PullRequest
0 голосов
/ 11 ноября 2019

У меня есть плоский список, который я хотел бы отображать в виде сетки, используя 100% ширину контейнера, однако я не могу добиться этого с плоским списком.
Пространство, как я имею, идет в стороны(согласно изображению) пространство вокруг центрирует поля в контейнере, пространство равномерно делает то же самое, flex-start with marginRight не является точным. Не совсем уверен, как этого добиться? Спасибо

<FlatList
    numColumns={3}
    columnWrapperStyle={{ justifyContent: "space-between"}}
    contentContainerStyle={{
       marginTop:20 
    }}
    data={data}
    keyExtractor={item => item.id}
    renderItem={renderItemComponent}
/>

Проблема: Требуется, как пробел между модами, но если в строке 2 элемента, а затем переместить второй элемент в середину на основе динамических данных?

enter image description here

1 Ответ

0 голосов
/ 11 ноября 2019

Вам придется удалить «columnWrapperStyle»

<FlatList
    numColumns={3}
    contentContainerStyle={{
       marginTop:20 
    }}
    data={data}
    keyExtractor={item => item.id}
    renderItem={renderItemComponent}
/>

Пример ссылки: https://snack.expo.io/@msbot01/5aee23

...