flutter-在列表顶部放置一个浮动的 app bar

2024-05-06  本文已影响0人  GitArtOS

通过 CustomScrollView 来生成一个带有随着用户滑动列表同时会在屏幕外随之滚动的 app bar 的列表。

  1. 创建一个 CustomScrollView

  2. 通过 SliverAppBar 来添加一个浮动的 app bar

  3. 通过 SliverList 来添加列表

效果:


截屏2024-05-07 15.42.46.png

class Sliver_customScrollView extends StatelessWidget {
  const Sliver_customScrollView({super.key});

  @override
  Widget build(BuildContext context) {
    return CustomScrollView(
      slivers: [
       const SliverAppBar(
          title: Text("Floating APP Bar"),
          floating: false,
          flexibleSpace: Placeholder(color: Colors.red,),
          expandedHeight: 20.0,
        ),
        SliverList(
          delegate: SliverChildBuilderDelegate(
            (context, index) => ListTile(title: Text("List Item $index")),
            childCount: 100,
          ))

      ],

    );
  }
}
上一篇下一篇

猜你喜欢

热点阅读