ListView吸顶效果

问题:

在React Native 中,ScorllView组件可以使用stickyHeaderIndices 轻松实现sticky 效果。而使用ListView组件时,使用 stickyHeaderIndices 则不生效。

如何实现滚动时每个section header 会吸顶

  在ListView中要实现sticky,需要使用 cloneWithRowsAndSections 方法,将 dataBlob(object),sectionIDs(array),rowIDs(array)三个值传进去。

1、dataBlob

 dataBlob 包含ListView所需的所有数据(section header 和 rows),在ListView渲染数据时,使用getSectionData 和 getRowData 来渲染每一行数据。dataBlob 的 key 值包含 sectionID + rowId

2、sectionIDs

 sectionIDs 用于标识每组section

3、rowIDs

 rowIDs 用于描述每个section 里的每行数据的位置及是否需要渲染。在ListView渲染时,会先遍历rowIDs 获取对应的 dataBlob 数据。
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 前言 学习本系列内容需要具备一定 HTML 开发基础,没有基础的朋友可以先转至 HTML快速入门(一) 学习 本人...
    珍此良辰阅读 14,574评论 11 24
  • 点击查看文档 ListView常用的属性 ScrollView 相关属性样式全部继承 dataSource Lis...
    黄晓坚阅读 3,093评论 0 1
  • Demo展示 之前两篇文章ListView的学习都是展示了每一row的数据,而上面的效果图中不仅展示了row数据,...
    BlainPeng阅读 11,080评论 3 16
  • 小时候,我们都很期待长大,因为可以做很多很多,我们做不到的事情,我记得,三岁的时候,我跟妈妈来到南风广场,我想...
    流泪de天使何嘉仪阅读 1,666评论 0 2
  • 今天用25分钟时间快读了一本书《图画书应该这样读》,看完打算做笔记,发现书里的重点是教你7步怎么看图画书(绘本)。...
    童楚涵阅读 3,255评论 1 1

友情链接更多精彩内容