颤动的嵌套标签

时间:2020-04-12 15:24:36

标签: flutter tabs categories

enter image description here

您好,我试图制作两个动态标签页,如上图所示,但是我停留在第二个标签页上,这是父标签页的子类别。任何人都有一个想法如何使其动态? 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));
                                    }
                                  });
                            }),
                          )
                        ],
                      ),
                    );
                  }),
                ),

0 个答案:

没有答案