应用栏不会隐藏在 nestedscrollview flutter 中的滚动中
App bar doesn't hide on scroll in nestedscrollview flutter
所以我想显示帖子,为此我在 nestedscrollview 的正文中使用 listview.builder,但是当我向下滚动时,appbar 不会被隐藏。这是在 listview.builder 的情况下,仅当我将控制器分配给它时。如果我不这样做,那么它会完美地工作。
return Scaffold(
backgroundColor: Colors.white,
body: SafeArea(
child: NestedScrollView(
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
return <Widget>[
SliverAppBar(
pinned: false,
floating: true,
snap: true,
forceElevated: innerBoxIsScrolled,
backgroundColor: Themes.secondaryColor,
automaticallyImplyLeading: false,
elevation: 0.0,
titleSpacing: 0,
toolbarHeight: 90,
title: Padding(
padding: const EdgeInsets.only(left:8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Trending",
style: GoogleFonts.roboto(
textStyle: const TextStyle(
fontSize: 20,
color: Color(0xff000000),
fontWeight: FontWeight.w500,
),
),
textAlign: TextAlign.left,
),
const SizedBox(height: 10,),
SizedBox(
width: double.infinity,
height: 27,
child: ListView.separated(
scrollDirection: Axis.horizontal,
physics: const BouncingScrollPhysics(),
itemCount: categories.length,
separatorBuilder: (context,index)=>const SizedBox(width: 5,),
itemBuilder: (context,index){
return Container(
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5),
color: selectedIndex==index?Themes.primaryColor:Themes.primaryColor.withOpacity(0.5),
),
padding: const EdgeInsets.symmetric(vertical:5,horizontal: 12),
child: Text(
categories[index],
style: const TextStyle(color: Colors.white,fontSize: 13),
),
);
},
),
),
],
),
),
),
];
},
body: loading?const Center(child: CircularProgressIndicator(),
):ListView.separated(
controller: scrollController,
padding: const EdgeInsets.symmetric(vertical:15),
itemCount: posts.length,
separatorBuilder: (context,index)=>const SizedBox(height: 6,),
itemBuilder: (context,index)=>posts[index],
),
),
),
);
如果您只需要控制器执行诸如分页或监听滚动事件之类的操作,请使用 NotificationListener
它将允许您执行此操作。
所以我想显示帖子,为此我在 nestedscrollview 的正文中使用 listview.builder,但是当我向下滚动时,appbar 不会被隐藏。这是在 listview.builder 的情况下,仅当我将控制器分配给它时。如果我不这样做,那么它会完美地工作。
return Scaffold(
backgroundColor: Colors.white,
body: SafeArea(
child: NestedScrollView(
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
return <Widget>[
SliverAppBar(
pinned: false,
floating: true,
snap: true,
forceElevated: innerBoxIsScrolled,
backgroundColor: Themes.secondaryColor,
automaticallyImplyLeading: false,
elevation: 0.0,
titleSpacing: 0,
toolbarHeight: 90,
title: Padding(
padding: const EdgeInsets.only(left:8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Trending",
style: GoogleFonts.roboto(
textStyle: const TextStyle(
fontSize: 20,
color: Color(0xff000000),
fontWeight: FontWeight.w500,
),
),
textAlign: TextAlign.left,
),
const SizedBox(height: 10,),
SizedBox(
width: double.infinity,
height: 27,
child: ListView.separated(
scrollDirection: Axis.horizontal,
physics: const BouncingScrollPhysics(),
itemCount: categories.length,
separatorBuilder: (context,index)=>const SizedBox(width: 5,),
itemBuilder: (context,index){
return Container(
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5),
color: selectedIndex==index?Themes.primaryColor:Themes.primaryColor.withOpacity(0.5),
),
padding: const EdgeInsets.symmetric(vertical:5,horizontal: 12),
child: Text(
categories[index],
style: const TextStyle(color: Colors.white,fontSize: 13),
),
);
},
),
),
],
),
),
),
];
},
body: loading?const Center(child: CircularProgressIndicator(),
):ListView.separated(
controller: scrollController,
padding: const EdgeInsets.symmetric(vertical:15),
itemCount: posts.length,
separatorBuilder: (context,index)=>const SizedBox(height: 6,),
itemBuilder: (context,index)=>posts[index],
),
),
),
);
如果您只需要控制器执行诸如分页或监听滚动事件之类的操作,请使用 NotificationListener
它将允许您执行此操作。