TabBarView with dynamic container height and futurebuilder Flutter

Lucas Barreto Luz 0
Viewed 17

I'm using a SizedBox and passing the screen height to it, but I have a RenderFlex overflowed error. This is the structure of my code:

 return DefaultTabController(
  length: 2,
  initialIndex: 0,
  child: Scaffold(
      drawer: const NavigationDrawerWidget(),
      appBar: CustomAppBar(),
      body: SingleChildScrollView(
        child: Column(
          children: [
            TabBar(
              isScrollable: true,
              tabs: myTabs,
            ),
            SizedBox(
              height: (MediaQuery.of(context).size.height),
              child: TabBarView(
                children: [
                  futureBuilder,
                  const Icon(Icons.directions_bike),
                ],
              ),
            )
          ],
        ),
      )),
);

FutureBuilder returns a container where the height is varied and has other expansive children. How can I get rid of using SizedBox and pass a height to it? I tried using Expanded in place of SizedBox but got errors.

tabbar flutter-layout flutter
1 Answers

Try using NestedScrollView

return Scaffold(
  body: DefaultTabController(
    length: 2,
    initialIndex: 0,
    child: NestedScrollView(
      headerSliverBuilder: (context, innerBoxIsScrolled) {
        return [
          SliverAppBar(
              bottom: TabBar(isScrollable: true, tabs: [
            Tab(
              icon: Icon(Icons.ac_unit),
            ),
            Tab(
              icon: Icon(Icons.ac_unit),
            ),
          ]))
        ];
      },
      body: TabBarView(
        children: [
          SingleChildScrollView(
            child: Container(
              color: Colors.red,
              child: Column(
                children: [
                  for (int i = 0; i < 34; i++)
                    Container(
                      height: kToolbarHeight,
                      color: i.isEven ? Colors.amber : Colors.pink,
                    )
                ],
              ),
            ),
          ),
          const Icon(Icons.directions_bike),
        ],
      ),
    ),
  ),
);
Yeasin Sheikh0
Related