flutter - Flutter:启用标签后，TabBar会溢出AppBar的底部

Question

我有以下TabBar(我已使用flexibleSpace删除了填充，将空的AppBar放在TabBar和SafeArea上方，以使TabBar不会出现在android状态栏下方):

home: DefaultTabController(
                length: 3,
                child: Scaffold(
                    appBar: AppBar(
                        flexibleSpace: SafeArea(
                          child: Column(
                              mainAxisAlignment: MainAxisAlignment.end,
                              children: [
                                  TabBar(
                                      indicatorColor: Color(0xfffffffe),
                                      tabs: [
                                          Tab(
                                              text: "Diary",
                                              icon: Icon(Icons.book),
                                          ),
                                          Tab(
                                              text: "Charts",
                                              icon: Icon(Icons.insert_chart),
                                          ),
                                          Tab(
                                              text: "Settings",
                                              icon: Icon(Icons.settings),
                                          )
                                      ],
                                  ),
                              ],
                          ),
                        ),
                    ),
                    body: TabBarView(
                        children: [
                            Diary(),
                            Charts(),
                            Settings(),
                        ],
                    )
                )
            ),

渲染时看起来像这样:


如何在保持安全区域和flexibleSpace的同时避免底部溢出？

Answer 1

如果将TabBar包装在Expanded小部件中，则应该可以解决您的问题

AppBar(
            flexibleSpace: SafeArea(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.end,
                children: [
                  Expanded(
                    child: TabBar(
                      indicatorColor: Color(0xfffffffe),
                      tabs: [
                        Tab(
                          text: "Diary",
                          icon: Icon(Icons.book),
                        ),
                        Tab(
                          text: "Charts",
                          icon: Icon(Icons.insert_chart),
                        ),
                        Tab(
                          text: "Settings",
                          icon: Icon(Icons.settings),
                        )
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ),

让我知道这对您如何工作。