feed_slider_container.dart

class FeedSliderContainer extends StatefulWidget {
  const FeedSliderContainer({
    Key? key,
  }) : super(key: key);

  @override
  _FeedSliderContainerState createState() => _FeedSliderContainerState();
}

class _FeedSliderContainerState extends State<FeedSliderContainer>
    with SingleTickerProviderStateMixin {
  /*
    FOR TESTING PURPOSES ONLY, DO NOT USE IN PRODUCTION
  */
  List<String> categories = ['All', 'Women', 'Men', 'Kids', 'Gadgets', 'Shoes'];

  late TabController _tabController;

  GridContainerData? _products;
  GridContainerData _getProductData() {
    return productGridContainerData;
  }

  @override
  void initState() {
    super.initState();
    _products = _getProductData();
    _tabController = TabController(vsync: this, length: categories.length);
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Builder(
        builder: (BuildContext context) {
          // final TabController tabController = DefaultTabController.of(context);
          // tabController.addListener(() {
          //   if (!tabController.indexIsChanging) {
          //     int index = tabController.index;
          //     setState(() {});
          //   }
          // });
          _tabController.addListener(() {
            if (!_tabController.indexIsChanging) {
              int index = _tabController.index;
              setState(() {});
            }
          });
          return Column(
            children: <Widget>[
              getTabBar(context, _tabController),
              Expanded(
                child: Container(
                  child: TabBarView(
                    controller: _tabController,
                    children: [
                      _buildProductFeed(),
                      _buildProductFeed(),
                      _buildProductFeed(),
                      _buildProductFeed(),
                      _buildProductFeed(),
                      _buildProductFeed(),
                    ],
                  ),
                ),
              ),
            ],
          );
        },
      ),
    );
  }

  List<Widget> getTabs(TabController tabController) {
    return categories.map((category) {
      return Tab(
        icon: Container(
          width: MediaQuery.of(context).size.width * 0.3,
          height: MediaQuery.of(context).size.height * 0.06,
          decoration: tabController.index == categories.indexOf(category)
              ? BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(10),
                  boxShadow: const [
                    BoxShadow(
                      color: Colors.black12,
                      blurRadius: 10,
                      offset: Offset(3, 7),
                    )
                  ],
                )
              : const BoxDecoration(),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Center(
                child: Text(
                  category,
                ),
              ),
              const SizedBox(width: 5),
            ],
          ),
        ),
      );
    }).toList();
  }

  Widget getTabBar(BuildContext context, TabController tabController) {
    return TabBar(
      tabs: getTabs(tabController),
      labelColor: CustomColors.primary,
      unselectedLabelColor: CustomColors.secondary.withOpacity(0.5),
      indicatorColor: Colors.transparent,
      isScrollable: true,
      padding: const EdgeInsets.all(3),
      controller: tabController,
    );
  }

  Widget _buildProductFeed() {
    return Container(
      padding: EdgeInsets.all(10),
      child: GridContainer(
        data: _products,
        isScrollable: true,
      ),
    );
  }
}