如下面的示例代码所示,我创建了一个nestedScrollView,其主体中带有TabBarView。在其中一个标签中,我创建了一个ListView。我想在单击FloatingactionButton跳到列表底部时使用滚动控制器。但是,从代码中可以看出,我决不能跳过nestedScrollView headerSliverBuilder主体的范围。我尝试使用CustomScrollView来实现这一点,并且获得了相同的UI,但是ScrollControllers对于嵌套的ListView和CustomScrollView变得脱节,并且其滚动效果与我将在此处发布的示例没有相同。
请让我知道如何滚动到此源代码中包含的列表视图。我很茫然。
import 'package:flutter/material.dart';
void main() => runApp(MaterialApp(
home: MyApp(),));
class MyApp extends StatefulWidget {
MyAppState createState() => MyAppState();
}
class MyAppState extends State<MyApp> with SingleTickerProviderStateMixin {
ScrollController _scrollController;
TabController _tabController;
FloatingactionButton floatingactionButton;
@override
void initState() {
_scrollController = ScrollController();
_tabController = TabController(length: 2,vsync: this);
floatingactionButton = FloatingactionButton(
onpressed: () {
// TODO: figure out how to jump to the bottom of the listView
_scrollController.jumpTo(10000);
},);
super.initState();
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
floatingactionButton: floatingactionButton,body: nestedScrollView(
controller: _scrollController,headerSliverBuilder: (BuildContext context,bool boxIsScrolled) {
return <Widget>[
SliverAppBar(
flexibleSpace: FlexibleSpaceBar(
collapseMode: CollapseMode.pin,),floating: false,pinned: false,snap: false,expandedHeight: 180,SliverPersistentHeader(
pinned: true,floating: true,delegate: _SliverAppBarDelegate(
TabBar(
indicatorColor: Colors.grey,tabs: <Widget>[
Tab(child: Text("Tab 1")),Tab(child: Text("Tab 2"))
],controller: _tabController,)
];
},body: _buildnestedScrollViewBody(),)));
}
Widget _buildnestedScrollViewBody() {
return TabBarView(
controller: _tabController,children: <Widget>[
Center(child: Text("Stuff Goes Here")),_buildListView()
],);
}
Widget _buildListView() {
// TODO: this is the list view I want to scroll to the bottom of
return ListView.builder(
shrinkWrap: true,physics: AlwaysScrollableScrollPhysics(),itemCount: 100,itemBuilder: (BuildContext conext,int position) {
return Text("$position text");
});
}
}
class _SliverAppBarDelegate extends SliverPersistentHeaderDelegate {
_SliverAppBarDelegate(this._tabBar);
final TabBar _tabBar;
@override
double get minExtent => _tabBar.preferredSize.height;
@override
double get maxExtent => _tabBar.preferredSize.height;
@override
Widget build(
BuildContext context,double shrinkOffset,bool overlapsContent) {
return new Container(
child: _tabBar,decoration: BoxDecoration(
color: Colors.grey,);
}
@override
bool shouldRebuild(_SliverAppBarDelegate oldDelegate) {
return false;
}
}