因此,我想先创建一个页面,其中包含一些内容,然后是两个带有两个不同列表的选项卡。选项卡栏的行为应类似于PersistentHeader(粘贴在顶部)。 TabBarView中的这些列表之一也包含SliverPersistentHeader,但是这些列表不会堆积在TabBar PersistentHeader上,而是向后滚动。一个人如何实现这种行为?
以下是显示当前行为的gif:
这是我到目前为止尝试过的:
@override
Widget build(BuildContext context) {
return NestedScrollView(
controller: _scrollViewController,
headerSliverBuilder:
(BuildContext context, bool boxIsScrolled) {
return <Widget>[
SliverList(
delegate: SliverChildListDelegate([
_buildTopImage(),
Padding(
padding: EdgeInsets.symmetric(
horizontal: defaultPagePadding),
child: _buildTopText(),
),
]),
),
SliverAppBar(
pinned: true,
floating: true,
expandedHeight: 0,
backgroundColor: Colors.white,
bottom: TabBar(
labelColor: Theme.of(context).primaryColor,
unselectedLabelColor: Colors.grey,
tabs: <Widget>[
Tab(
text: "Tab 1",
),
Tab(
text: "Tab 2",
)
],
controller: _tabController,
),
)
];
},
body: TabBarView(
children: <Widget>[
_buildList1(),
_buildList2(),
],
controller: _tabController,
),
),
}
Widget _buildList2() {
return CustomScrollView(slivers: <Widget>[
SliverAppBar(
pinned: true,
title: Text('Test'),
),
SliverAppBar(
pinned: true,
title: Text('Test'),
),
SliverAppBar(
pinned: true,
title: Text('Test'),
),
]);
}
我是Flutter的新手,所以我非常感谢你们的任何帮助!