horizontal-scrollingreact-nativereact-native-listviewreact-native-ios

How to do an Horizontal ListView, or FlatList in react-native

I'm searching a way to make an horizontal ListView or FlatList In React-native.

like the image below:

enter image description here

I tried to managed it with Flex but it's make me stranges results, and always with a vertical ListView

If you got any idea, let me know.

Regards,

Solution

  • The answer is to add the horizontal property set to true.

    Yeah now it's described in the doc: https://reactnative.dev/docs/flatlist#horizontal

    So obviously a FlatList is a Child of a ScrollView so he got the Horizontal Bool.

      <FlatList
    horizontal={true}
    data={DATA}
    renderItem={renderItem}
    keyExtractor={(item) => item.id}
    extraData={selectedId}
  />

    Ciao