在没有预定义大小的列中颤动可滚动 TabBarView

Question

我想要一个屏幕，顶部有一个小部件，后面跟着一个选项卡栏。我希望所有内容都位于 SingleChildScrollView 内，以便可以滚动整个屏幕（而不仅仅是单个选项卡的内容）。

--------------------
|      Widget      |
--------------------
|      TabBar      |
--------------------
|                  |
|                  |
|    TabBarView    |
|                  |
|                  |
--------------------

我查看了类似的问题，但它们对我想要实现的目标没有帮助：

如何在 flutter 上的列小部件内添加选项卡

让TabBarView占据所有剩余空间

我无法设置固定高度，因为我不知道（标签栏内容）。

我的方法不起作用：

class TestScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Test'),
      ),
      body: SingleChildScrollView(
        child: DefaultTabController(
          length: 2,
          child: Column(
            children: [
              Padding(
                padding: const EdgeInsets.all(16.0),
                child: Text('My Top Widget'),
              ),
              TabBar(
                tabs: [
                  Tab(child: Text('Available')),
                  Tab(child: Text('Taken')),
                ],
              ),
              TabBarView(
                children: [
                  Center(child: Text('1')),
                  Center(child: Text('2')),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

我收到以下错误：

Horizontal viewport was given unbounded height.

Viewports expand in the cross axis to fill their container and constrain their children to match their extent in the cross axis. In this case, a horizontal viewport was given an unlimited amount of vertical space in which to expand.
The relevant error-causing widget was: 
  TabBarView file:///home/kay/Code/emat/frontend/lib/ui/TestScreen.dart:26:15

最终应该如何：

Answer 1

我终于解决了这个问题。我了解了条子的工作原理并选择使用它们。我可以建议将此视频作为介绍，并建议使用在线文档以供进一步阅读。

现在这是我的方法：

class TestScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Test'),
      ),
        body: DefaultTabController(
          length: 2,
          child: NestedScrollView(
            scrollDirection: Axis.vertical,
            headerSliverBuilder: (context, innerBoxIsScrolled) => [
              SliverToBoxAdapter( //headerSilverBuilder only accepts slivers
                child: Column(
                  children: [
                    Padding(
                      padding: const EdgeInsets.all(16.0),
                      child: Text('My Top Widget'),
                    ),
                    TabBar(
                      tabs: [
                        Tab(child: Text('Available')),
                        Tab(child: Text('Taken')),
                      ],
                    ),
                  ],
                ),
              ),
            ],
            body: TabBarView(
              children: [
                // I wrapped large widgets in the SingleChildScrollView
                SingleChildScrollView(
                  child: Text('1')/*Very large widget*/,
                ),
                Text('2'),
              ],
            ),
          ),
        ),
    );
  }
}