Android Flatlist getItemLayout用例

Android Flatlist getItemLayout用例,android,performance,react-native,react-native-flatlist,Android,Performance,React Native,React Native Flatlist,为什么我们在平面列表中使用getItemLayout,它如何帮助提高平面列表的性能。检查react原生文档,但没有找到令人满意的答案 getItemLayout={(data, index) => ( {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index} )} 这里的偏移量是什么,它的作用是什么?React Native FlatList通过只渲染当前在屏幕上可见的行,并卸载已滚动过去的行来优化列表视图性能 为

为什么我们在平面列表中使用getItemLayout,它如何帮助提高平面列表的性能。检查react原生文档,但没有找到令人满意的答案

  getItemLayout={(data, index) => (
    {length: ITEM_HEIGHT, offset: ITEM_HEIGHT * index, index}
  )}

这里的偏移量是什么,它的作用是什么?

React Native FlatList通过只渲染当前在屏幕上可见的行,并卸载已滚动过去的行来优化列表视图性能

为了使FlatList能够做到这一点,它需要知道当前可见视口上方行的总高度,以便能够正确设置底层ScrollView滚动位置

FlatList有两种方法来实现这一点。或者

  • 它可以在安装行后计算行的高度,或者
  • 你可以告诉它你希望排成多高
在前一种情况下,它需要完全布局、渲染、装载和测量前一行,直到能够计算下一行的位置

在后者中,它可以提前计算位置,避免动态测量成本

getItemLayout
回调函数的三个参数是:

  • 长度
    :每行的高度。它们可以具有不同的高度,但高度应该是静态的。当高度恒定时,优化效果最佳
  • 偏移量
    :当前行距平面列表顶部的距离(以像素为单位)。对于恒定高度行,最简单的计算方法是
    height*index
    ,它会在前一行之后立即生成位置
  • 索引
    :当前行索引

如果平面列表是水平的,则将每列视为列表行,列宽与行高相同。

如果水平道具为true,则高度变为项目宽度,行变为列,在您的回答中???正确。编辑我的答案以反映这一点。如果我的平面列表上有一个ItemSeparator,那么
{length:ItemHeight,offset:(ItemHeight+SeparatorHeight)*index,index}
使用是否正确?在使用getItemLayout时是否应该包括项目的边距和填充?@jevakallio项目高度是否包括填充和边距?还是应该有这些?