Блог

Я пытаюсь заставить прокручиваемую панель вкладок работать внутри постоянного заголовка. Вкладки доступны для просмотра, но я не могу прокручивать их. Я делаю что-то не так? Я использую последнюю версию flutter, основанную на симуляторе iPhone.

Класс делегата SliverPersistentHeader

  class SliverTabBarHeader extends SliverPersistentHeaderDelegate {  final TabBar tabBar;  final Color color;   const SliverTabBarHeader({  Color color = Colors.transparent,  required this.tabBar,  }) : this.color = color;   @override  Widget build(  BuildContext context, double shrinkOffset, bool overlapsContent) {  return Stack(  fit: StackFit.expand,  children: [  Container(  color: Colors.white,  ),  Positioned(  child: tabBar,  bottom: 20,  ),  ],  );  }   @override  double get maxExtent =gt; tabBar.preferredSize.height   70;   @override  double get minExtent =gt; tabBar.preferredSize.height   60;   @override  bool shouldRebuild(covariant SliverPersistentHeaderDelegate oldDelegate) {  return false;  } }  

Реализация Постоянного заголовка Щепки

 SliverPersistentHeader(  delegate: SliverTabBarHeader(  tabBar: TabBar(  indicator: BoxDecoration(  borderRadius: BorderRadius.circular(10),  border: Border.all(),  color: Colors.yellow[400],  ),  padding: EdgeInsets.symmetric(horizontal: 20.0),  isScrollable: true,  unselectedLabelColor: Colors.black,  labelColor: Colors.black,  tabs: [  tabItem(tabName: "All"),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  ],  controller: _tabController,  ),  ),  floating: true,  );  

Вы можете использовать SliverAppBar вместо SliverPersistentHeader и дать TabBar в качестве заголовка SliverAppBar , например:

 SliverAppBar(  automaticallyImplyLeading: false,  title: TabBar(  indicator: BoxDecoration(  borderRadius: BorderRadius.circular(10),  border: Border.all(),  color: Colors.yellow[400],  ),  padding: EdgeInsets.symmetric(horizontal: 20.0),  isScrollable: true,  unselectedLabelColor: Colors.black,  labelColor: Colors.black,  tabs: [  tabItem(tabName: "All"),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  tabItem(tabName: "Pizza", icon: Icons.ac_unit),  ],  controller: _tabController,  ),  pinned: true, );