DefaultTabController & SingleChildScrollView & TabBarView is not working collectly

2k Views Asked by At

I want to implement like attached image.
But I get error again and again...

A page that displays contents on top of the screen.
Below that, I want to display TabBar and TabBarView.
Whole page can be scrollable.
How can I do?
How do you implement this?

My code currently looks like here.

Widget build(BuildContext context) {
  return DefaultTabController(
    length: someLength,
    child: Scaffold(
      appBar: buildAppBar(...),
      body: LayoutBuilder(
        builder: (ctx, constraints) {
          return SingleChildScrollView(
            child: ConstrainedBox(
              constraints: BoxConstraints(minHeight: constraints.maxHeight),
              child: Column(
                children: [
                  // Contents widget...
                  TabBar(tabs: ...),
                  Expanded(
                    child: TabBarView(
                      children: ...
                  ),
                ],
              ),
            ),
          );
        },
      ),
    ),
  );
}

And I tried everything I can think...

・Wrap Column by Expanded.
・LayoutBuilder and SingleChildScrollView.
・Use ListView instead of SingleChildScrollView.
・FlexFit loose and Column MainAxisSize.min.

The error I get is as you might think

Horizontal viewport was given unbounded height.
or
Incorrect use of ParentDataWidget.
or
RenderFlex children have non-zero flex but incoming height constraints are unbounded.
and something like that.

Please help me.

Thanks for your reading.
I think any comment will help me.

goal

0

There are 0 best solutions below