Bra*_*ell 5 floating-action-button flutter bottom-sheet bottomnavigationview flutter-layout
我正在开发一个 flutter 应用程序,该应用程序有一个页面,其中包含一个(圆形凹口矩形)BottomAppBar、一个 FloatingActionButton 和一个 BottomSheet,当用户单击地图上的标记时会出现该页面。我的问题是,当 BottomSheet 显示在屏幕上时,它将 FloatingActionButton 向上移动到 BottomSheet 的顶部。以下是我的应用程序中发生的情况的屏幕截图:
即使打开 BottomSheet,我也想将此 FloatingActionButton 保持在同一位置(因此位于 BottomAppBar 的中间)。是否可以通过更改某些现有属性来做到这一点?或者我是否必须构建自己的 BottomSheet 元素,以便它不会以这种方式与 FloatingActionButton 交互?
这是 Home.dart 中 FloatingActionButton/Scaffold 的代码片段:
@override
Widget build(BuildContext context) {
return Scaffold(
extendBodyBehindAppBar: true,
extendBody: true,
bottomNavigationBar: bottomAppBar(),
floatingActionButton: Container(
height: MediaQuery.of(context).size.width * 0.1625,
width: MediaQuery.of(context).size.width * 0.1625,
child: FittedBox(
child: FloatingActionButton(
elevation: 0.0,
onPressed: () {},
child: Icon(
Icons.bolt,
size: MediaQuery.of(context).size.width * 0.075,
),
),
),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
body: someWidget,
);
}
Run Code Online (Sandbox Code Playgroud)
这是我的 Map.dart 中的 BottomSheet(这里的 Map.dart 只是 Home.Dart PageView 中的一个小部件):
showBottomSheet(
context: context,
builder: details(marker),
backgroundColor: Colors.transparent,
);
Run Code Online (Sandbox Code Playgroud)
最后这是 Home.dart 中的 BottomAppBar 代码:
Widget bottomAppBar() {
return BottomAppBar(
color: lightBlackApp,
shape: CircularNotchedRectangle(),
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: options(),
),
);
Run Code Online (Sandbox Code Playgroud)
一些要求:
感谢您的时间 !
| 归档时间: |
|
| 查看次数: |
1109 次 |
| 最近记录: |