Как получить матрицу 2X2 в FlatList из React-Native?

Question

каждый, поскольку я новичок, у меня есть некоторые проблемы с использованием FlatList React-Native. Я хочу сделать матрицу 2X2 с помощью FlatList. Я пытался с помощью следующего кода. (Строка 6, 18)

<View style={{ flexDirection: 'row' }}>
          <FlatList
            style={{ width: '50%' }}
            showsHorizontalScrollIndicator={false}
            initialNumToRender={5}
            data={this.state.dataSource3 ? this.state.dataSource3.filter((news, index) => index % 2 === 0) : []}
            renderItem={({ item }) => (
              <View style={{ height: 220, marginBottom: 10 }}>
                <Card id={item.id} name={item.name} description={item.description} imgUrl={item.imgUrl} />
              </View>
            )}
            keyExtractor={item => item.id}
          />
          <FlatList
            style={{ width: '50%' }}
            showsHorizontalScrollIndicator={false}
            initialNumToRender={5}
            data={this.state.dataSource3 ? this.state.dataSource3.filter((news, index) => index % 2 !== 0) : []}
            renderItem={({ item }) => (
              <View style={{ height: 220, marginBottom: 10 }}>
                <Card id={item.id} name={item.name} description={item.description} imgUrl={item.imgUrl} />
              </View>
            )}
            keyExtractor={item => item.id}
          />
        </View>

Они выглядели как 2X2, но они не движутся вместе. Как я могу прокрутить это вместе?