flutter - Flutter:启用标签时TabBar溢出AppBar底部
问题描述
我有以下 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(),
],
)
)
),
如何在保持安全区域和灵活空间的同时避免底部溢出?
解决方案
移除 SafeArea 和 Column 应该可以解决问题:
appBar: AppBar(
flexibleSpace: 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),)
],
),
),
推荐阅读
- android - 如何从 Firebase 中的实时数据库中获取数组
- arrays - React - 使用 .map 和 .fill 用随机数填充二维数组
- arduino - Arduino if 语句始终为真
- oracle - 为什么 Oracle 在 UWP 的 .net 标准中崩溃但 winform 没有?
- c# - 如何获取元素的 x 和 y 位置,以便在 WPF C# 应用程序中将新控件放置在其附近
- c - 如何读入二进制文件并将数据存储在C中的指针处
- c# - C#:全局鼠标事件处理程序仅触发一次
- typescript - 打字稿 - 前面 - 我想合并静态导入,但不合并动态导入
- python - 带有打印语句的VS代码python调试器错误
- c++ - 以下声明中指针的用法有什么区别?