flutter - 将固定标题添加到 SliverList

Question

如何将标题添加到 SliverList，我显示餐厅列表，我需要显示此列表的标题，例如顶级餐厅

          SliverList(
            delegate: SliverChildBuilderDelegate(
                  (context, index) => Padding(
                padding:
                const EdgeInsets.only(left: 15.0, right: 15, bottom: 5),
                child: RestaurantWidget(restaurant: _con.topRestaurants[index]),
              ),
              childCount: _con.topRestaurants.length,
            ),
          ),

Answer 1

尝试在你的 SliverList 之前添加 SliverPersistentHeader，参考这篇文章， Sliver ：

这是在您的页面类中：

...
          SliverPersistentHeader(
            pinned: true,
            floating: false,
            delegate: HeaderDelegate(backgroundColor, _title),
          ),
          SliverList(
            delegate: SliverChildBuilderDelegate(
                  (context, index) => Padding(
                padding:
                const EdgeInsets.only(left: 15.0, right: 15, bottom: 5),
                child: RestaurantWidget(restaurant: _con.topRestaurants[index]),
              ),
              childCount: _con.topRestaurants.length,
            ),
          ),
...

把它放在你的页面类之外：

class HeaderDelegate extends SliverPersistentHeaderDelegate {
  final Color backgroundColor;
  final String _title;

  Delegate(this.backgroundColor, this._title);

  @override
  Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
    return Container(
      color: backgroundColor,
      child: Center(
        child: Text(
          _title,
          style: TextStyle(
            color: Colors.white,
            fontSize: 25,
          ),
        ),
      ),
    );
  }

  @override
  double get maxExtent => 80;

  @override
  double get minExtent => 50;

  @override
  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) {
    return true;
  }
}