我正在尝试在滚动时用消失的appbar构建帖子(例如Instagram(。这是我的代码:
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.pink[100]
),
body: postImagesWidget()
);
}
Widget postImagesWidget() {
return
FutureBuilder(
future: _future,
builder: ((context, AsyncSnapshot<List<DocumentSnapshot>> snapshot) {
return LiquidPullToRefresh(
onRefresh: _refresh, // refresh callback
child: ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: ((context, index) =>
SinglePost(
list: snapshot.data,
index: index,
followingUser: followingUser,
currentUser: currentUser,
fetch: fetchFeed,
)))
);
}),
);}
您可以看到,我目前正在使用一个普通的Appbar和listView.builder来创建帖子。我听说了 sliverAppbar 并尝试在我的设置中实现它,但无法与我的listView.builder一起使用。
关于如何在滚动时删除Appbar的任何建议或想法?
最好的问候。
flutter具有一个名为sliverAppbar的小部件。确实要做您想要的!
文档链接到SliverAppbar:Flutter Docs -SliverAppbar
编辑
我对我的瘦弱答案说明了,我正处于繁忙的一天;(。Slivers是另一种小部件,它们只是与其他SliverWidget(这不是规则(相关联的,例如School Haha。好吧,波纹管我写了一些带有一些评论的代码,您可以在达台上尝试。
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
// Your code starts here
home: Scaffold(
// NestedScrollView to hold a Body Widget (your list) and a SliverAppBar.
body: NestedScrollView(
// SingleChildScrollView to not getting overflow warning
body: SingleChildScrollView(child: Container() /* Your listview goes here */),
// SliverAppBar goes inside here
headerSliverBuilder: (context, isOk) {
return <Widget>[
SliverAppBar(
expandedHeight: 150.0,
flexibleSpace: const FlexibleSpaceBar(
title: Text('Available seats'),
),
actions: <Widget>[
IconButton(
icon: const Icon(Icons.add_circle),
tooltip: 'Add new entry',
onPressed: () { /* ... */ },
),
]
)
];
}),
),
);
}
}