react-native - 如何在 React Native 中实现这样的设计

Question

我必须在我的项目中实现这样的设计。我不知道如何实现这样的设计。

是否有可用于实现此类设计的软件包？

我正在使用 FlatList 组件来呈现列表项。

我在react-native中做这个项目

工作环境:-

react-native: 0.64.1

Answer 1

尝试使用 react-native-masonry-list

<MasonryList
  data={filteredItems}
  keyExtractor={(item, index): string => index.toString()}
  numColumns={2}
  showsVerticalScrollIndicator={false}
  renderItem={({item}) => <CardItem />}
  refreshing={isLoadingNext}
  onRefresh={() => refetch({first: ITEM_CNT})}
  onEndReachedThreshold={0.1}
  onEndReached={() => loadNext(ITEM_CNT)}
/>

对于自定义实现，此 article会帮助你