英文:
How to make container fix positioned even after keyboard is displayed
问题
我已经玩了一段时间,但无法使其正常工作。基本上,我有底部导航栏,并且我希望在底部导航栏的顶部有一个固定位置的容器,即使键盘显示时也保持在那里。到目前为止,无论我尝试什么,容器在调用键盘时都会出现在键盘的顶部。这是我迄今为止的代码。基本上,我的最后希望是将其包装在Stack小部件中,但那行不通。
class HomeScreen extends StatefulWidget {
static const String id = '/app';
final FirebaseUser user;
HomeScreen({this.user});
@override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
int _currentIndex = 0;
final List<Widget> _children = [Screen1(), Screen2()];
void bottomTabHandler(int index) {
setState(() {
_currentIndex = index;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
currentIndex: _currentIndex,
onTap: bottomTabHandler,
items: [
BottomNavigationBarItem(
icon: Icon(Icons.receipt),
title: Text('Option1'),
),
BottomNavigationBarItem(
icon: Icon(Icons.receipt),
title: Text('Option2'),
),
BottomNavigationBarItem(
icon: Icon(Icons.add),
title: Text('Option3'),
),
],
),
appBar: AppBar(
centerTitle: true,
title: Text('XXX'),
automaticallyImplyLeading: false,
),
endDrawer: AppbarDrawer(),
body: Stack(
children: <Widget>[
_children[_currentIndex],
Positioned(
bottom: 0,
child: Container(
width: 250,
height: 100,
color: Colors.blue,
),
),
],
),
);
}
}
我在Screen1上有一个简单的TextField,这就是我得到的结果。
英文:
I've been playing with this for some time and can not get this working. Basically I've got bottom navigation bar and I want at the top of the bottom navigation bar fixed positioned container which stay there even if the keyboard is displayed. So far no matter what I tried the container ends up at the top of the keyboard when the keyboard is called. Here is my code where I ended up so far. Basically my last hope was to wrap it in Stack widget but that didn't work.
class HomeScreen extends StatefulWidget { static const String id = '/app'; final FirebaseUser user; HomeScreen({this.user});
@override _HomeScreenState createState() => _HomeScreenState(); }
class _HomeScreenState extends State<HomeScreen> { int _currentIndex
= 0; final List<Widget> _children = [Screen1(), Screen2()];
void bottomTabHandler(int index) {
setState(() {
_currentIndex = index;
}); }
@override Widget build(BuildContext context) {
return Scaffold(
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
currentIndex: _currentIndex,
onTap: bottomTabHandler,
items: [
BottomNavigationBarItem(
icon: Icon(Icons.receipt),
title: Text('Option1'),
),
BottomNavigationBarItem(
icon: Icon(Icons.receipt),
title: Text('Option2'),
),
BottomNavigationBarItem(
icon: Icon(Icons.add), title: Text('Option3')),
],
),
appBar: AppBar(
centerTitle: true,
title: Text('XXX'),
automaticallyImplyLeading: false,
),
endDrawer: AppbarDrawer(),
body: Stack(
children: <Widget>[
_children[_currentIndex],
Positioned(
bottom: 0,
child: Container(
width: 250,
height: 100,
color: Colors.blue,
),
),
],
),
);
}
}
I've got simple TextField at screen1 and this is what I get
答案1
得分: 4
如果您想确保小部件在键盘出现时不会调整大小,可以使用Scaffold
的resizeToAvoidBottomInset
属性:
return Scaffold(
resizeToAvoidBottomInset: false,
body: Stack(
...
英文:
If you want to make sure the Widgets don't get adjusted when the keyboard appears, you can use the resizeToAvoidBottomInset
property of the Scaffold
:
return Scaffold(
resizeToAvoidBottomInset: false,
body: Stack(
...
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论