LoadingView 包裹 Scaffold, 获取不到底部导航栏?
时间: 2024-01-22 12:20:51 浏览: 58
如果你的 `LoadingView` 是包裹在 `Scaffold` 中的,那么可以尝试使用 `Builder` 组件来获取 `Scaffold` 的上下文,再从中获取底部导航栏的高度。
示例代码:
```dart
class LoadingView extends StatelessWidget {
final Widget child;
const LoadingView({Key key, this.child}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: Builder(
builder: (BuildContext context) {
// 获取 Scaffold 的上下文
final scaffoldContext = context;
// 显示加载中状态
return Center(
child: CircularProgressIndicator(),
);
},
),
bottomNavigationBar: BottomNavigationBar(
// 底部导航栏代码
),
);
}
}
```
在获取到 `scaffoldContext` 后,就可以通过 `MediaQuery` 来获取底部导航栏的高度了。示例代码:
```dart
// 获取底部导航栏高度
final bottomNavBarHeight = MediaQuery.of(scaffoldContext).padding.bottom;
```
在进行页面布局时,需要将 `bottomNavBarHeight` 的高度减去,以避免遮挡到底部导航栏。例如:
```dart
// 布局代码
child: Container(
height: MediaQuery.of(scaffoldContext).size.height - bottomNavBarHeight,
child: child,
),
```
希望能对你有所帮助!
阅读全文