使浮动操作按钮到固定位置
Make the Floating Action Button to a fixed location
我正在开发一个在导航栏上带有 FAB 的应用程序,当键盘出现时,FAB 会随键盘一起上升。我想让FAB固定在导航栏里
正常UI
带键盘
我试过使用 keyboard_visibility: ^0.5.6 ,如前面的问题所述。
但是这个插件已被弃用,所以我无法使用它。
这是FAB按钮相关的代码。
@override
Widget build(BuildContext context) => Scaffold(
extendBody: true,
body: IndexedStack(
children: pages,
index: index,
),
bottomNavigationBar: TabBarMaterialWidget(
index: index,
onChangedTab: onChangedTab,
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () => print('Hello'),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
);
void onChangedTab(int index) {
setState(() {
this.index = index;
});
}
需要做什么来解决这个问题? (如果有类似上述的任何其他插件,请告诉我如何使用它来解决此问题/或任何其他方法)
来自文档:
bool? resizeToAvoidBottomInset
if there is an onscreen keyboard displayed above the scaffold, the
body can be resized to avoid overlapping the keyboard, which prevents
widgets inside the body from being obscured by the keyboard.
return Scaffold(
resizeToAvoidBottomInset: false,
...
您必须将 FAB 放在 bottomNavigationBar 中,然后它将始终位于底部。
我正在开发一个在导航栏上带有 FAB 的应用程序,当键盘出现时,FAB 会随键盘一起上升。我想让FAB固定在导航栏里
正常UI
带键盘
我试过使用 keyboard_visibility: ^0.5.6 ,如前面的问题所述。
但是这个插件已被弃用,所以我无法使用它。
这是FAB按钮相关的代码。
@override
Widget build(BuildContext context) => Scaffold(
extendBody: true,
body: IndexedStack(
children: pages,
index: index,
),
bottomNavigationBar: TabBarMaterialWidget(
index: index,
onChangedTab: onChangedTab,
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () => print('Hello'),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
);
void onChangedTab(int index) {
setState(() {
this.index = index;
});
}
需要做什么来解决这个问题? (如果有类似上述的任何其他插件,请告诉我如何使用它来解决此问题/或任何其他方法)
来自文档:
bool? resizeToAvoidBottomInset
if there is an onscreen keyboard displayed above the scaffold, the body can be resized to avoid overlapping the keyboard, which prevents widgets inside the body from being obscured by the keyboard.
return Scaffold(
resizeToAvoidBottomInset: false,
...
您必须将 FAB 放在 bottomNavigationBar 中,然后它将始终位于底部。