粘性和可展开列表

Flutter 实现粘性标题和可展开列表。支持在 CustomScrollView 中使用。

sticky_and_expandable_list

特点

  • 支持构建可展开的ListView，可以展开/折叠分组或固定分组标题。
  • 与CustomScrollView、SliverAppBar一起使用。
  • 监听当前粘性标题的滚动偏移量，
    以及当前粘性标题的索引。

入门

在您的 flutter 项目的 pubspec.yaml 文件中，添加以下依赖项

dependencies:
  sticky_and_expandable_list: '^0.1.0'

基本用法

    //sectionList is a custom data source for ExpandableListView.
    //echo Section class must implement ExpandableListSection.
    List<Section> sectionList = MockData.getExampleSections();
    return ExpandableListView(
      builder: SliverExpandableChildDelegate<String, Section>(
          sectionList: sectionList,
          headerBuilder: (context, section, index) => Text("Header #$index"),
          itemBuilder: (context, section, item, index) => ListTile(
                leading: CircleAvatar(
                  child: Text("$index"),
                ),
                title: Text(item),
              )),
    );

详细示例

常见问题

如何展开/折叠列表项？

section.setSectionExpanded(true)

示例

如何监听当前粘性标题或粘性标题的滚动偏移量？

  @override
  Widget build(BuildContext context) {
    ExpandableListView(
      builder: SliverExpandableChildDelegate<String, Section>(
        headerController: _getHeaderController(),
      ),
    )
  }

  _getHeaderController() {
    var controller = ExpandableListHeaderController();
    controller.addListener(() {
      print("switchingSectionIndex:${controller.switchingSectionIndex}, stickySectionIndex:" +
          "${controller.stickySectionIndex},scrollPercent:${controller.percent}");
    });
    return controller;
  }

GitHub

https://github.com/tp7309/flutter_sticky_and_expandable_list