您好,我试图制作两个动态标签页,如上图所示,但是我停留在第二个标签页上,这是父标签页的子类别。任何人都有一个想法如何使其动态? ps:在上面的示例图片中,当您单击子类别选项卡时,它会在页面的特定部分向下滚动并显示相关的类别。因此,我的意思是,每当您向下滚动页面时,父类别选项卡页面都会垂直划分为不同的部分,子类别选项卡会根据部分而变化。
这是我的第一层标签的代码
DefaultTabController(
length: _con.categories.length,
child: Scaffold(
key: _con.scaffoldKey,
appBar: AppBar(
bottom: TabBar(
onTap: (int index) {
_con.listenForProductsByCategory(
_con.categories.elementAt(index).id.toString(), null);
},
labelStyle: TextStyle(
fontSize: 20.0,
fontFamily: 'Family Name'), //For Selected tab
unselectedLabelStyle:
TextStyle(fontSize: 15.0, fontFamily: 'Family Name'),
indicatorWeight: 6.0,
indicatorSize: TabBarIndicatorSize.tab,
isScrollable: true,
indicatorColor: Colors.white,
tabs: List.generate(_con.categories.length, (index) {
return Tab(
text: _con.categories.elementAt(index).name ?? '');
}),
labelColor: Theme.of(context).primaryColor,
),),),),
child: TabBarView(
physics: NeverScrollableScrollPhysics(),
children: List.generate(_con.categories.length, (index) {
return SingleChildScrollView(
padding:
EdgeInsets.symmetric(horizontal: 20, vertical: 25),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
SizedBox(height: 15),
GridView.count(
scrollDirection: Axis.vertical,
shrinkWrap: true,
primary: false,
crossAxisSpacing: 10,
mainAxisSpacing: 20,
padding: EdgeInsets.symmetric(horizontal: 0),
// Create a grid with 2 columns. If you change the scrollDirection to
// horizontal, this produces 2 rows.
crossAxisCount:
MediaQuery.of(context).orientation ==
Orientation.portrait
? 3
: 3,
// Generate 100 widgets that display their index in the List.
children: List.generate(_con.products.length + 1,
(index) {
if (index == _con.products.length) {
return _con.isLoadingProducts == true
? CupertinoActivityIndicator()
: Container();
}
return ProductGridItemWidget(
heroTag: 'favorites_grid',
product: _con.products.elementAt(index),
onPressed: () {
{
_con.addToCart(
_con.products.elementAt(index));
}
});
}),
)
],
),
);
}),
),