I'm trying to get a scrollable TabBar working inside a Sliver Persistent Header. The tabs are clickable, but I cannot scroll through the tabs. Am I doing something wrong? I'm using the latest version of flutter, building on iPhone simulator.
SliverPersistentHeader Delegate Class
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 => tabBar.preferredSize.height + 70;
@override
double get minExtent => tabBar.preferredSize.height + 60;
@override
bool shouldRebuild(covariant SliverPersistentHeaderDelegate oldDelegate) {
return false;
}
}
Sliver Persistent Header Implementation
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,
);