Flutter（76）：Sliver组件之SliverPrototypeExtentList

Flutter教学目录持续更新中

Github源代码持续更新中

1.SliverPrototypeExtentList介绍

可以依照提供的widget来约束Item高度的SliverList

2.SliverPrototypeExtentList属性

• delegate：SliverChildDelegate
• prototypeItem：widget 以这个组件的主轴方向的高度来约束其他的item的高度

3.使用

与SliverList的区别不大：Flutter（72）：Sliver组件之SliverList

  _mySliverAppBar() {
    return SliverAppBar(
      title: Text('SliverPrototypeExtentList'),
      expandedHeight: 250,
      flexibleSpace: FlexibleSpaceBar(
        background: Image.network(
          ImageUrlConstant.imageUrl1,
          fit: BoxFit.cover,
        ),
        collapseMode: CollapseMode.parallax,
      ),
    );
  }

  _mySliverChildBuilderDelegate() {
    return SliverChildBuilderDelegate(
      (BuildContext context, int index) {
        return Container(
          height: 80,
          color: Colors.primaries[index % 11],
        );
      },
      childCount: 30,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.white,
      child: CustomScrollView(
        slivers: [
          _mySliverAppBar(),
          SliverPrototypeExtentList(
            delegate: _mySliverChildBuilderDelegate(),
            prototypeItem: Container(
              height: 150,
            ),
          ),
        ],
      ),
    );
  }

image.png

下一节：Sliver组件之SliverToBoxAdapter

Flutter（77）：Sliver组件之SliverToBoxAdapter

Flutter教学目录持续更新中

Github源代码持续更新中