我有一个像这样的扩展小部件列:
return new Container(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
new Expanded(
flex: 1,
child: convertFrom,
),
new Expanded(
flex: 1,
child: convertTo,
),
new Expanded(
flex: 1,
child: description,
),
],
),
);
它是这样的:
convertFrom，包括一个TextField。当我点击这个文本框时，Android键盘就会出现在屏幕上。这会改变屏幕大小，所以小部件会像这样调整大小:
有没有办法让键盘“覆盖”屏幕，使我的列不调整大小?如果我不使用Expanded widgets，并为每个widget硬编码一个高度，这些widget就不会调整大小，但是当键盘出现时，我会得到一个黑黄条纹错误(因为没有足够的空间)。这也不是对所有屏幕尺寸都灵活。
我不确定这是android特有的还是flutter特有的。
这是一个完美的解决方案，使您能够在SingleChildScrollView中拥有一个全屏列。这可以让你为所有屏幕大小创建一个完美的布局+有一个可滚动的屏幕，只有当你打开键盘或屏幕在呈现后溢出时才滚动(例如文本输入字段验证)
class PerfectFullScreen extends StatelessWidget {
const PerfectFullScreen({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
backgroundColor: Theme.of(context).backgroundColor,
appBar: AppBar(),
body: Builder(
builder: (context) => SingleChildScrollView(
child: ConstrainedBox(
constraints: BoxConstraints(
minHeight: MediaQuery.of(context).size.height -
(MediaQuery.of(context).padding.top + kToolbarHeight)),
child: IntrinsicHeight(
child: Column(
children: [
Container(
height: randomImageHeight,
child: Image.asset(
"assets/images/change_password.png",
fit: BoxFit.cover,
),
),
Expanded(
child: WidgetThatShouldTakeRemainingSpace() )
],
)))),
),
));
}
}
重要的部分是带有正确BoxConstraints和InstrinsicHeight小部件的ConstrainedBox。
PS: MediaQuery.of .padding(上下文)。top + kToolbarHeight) == Appbar的高度
这是一个完美的解决方案，使您能够在SingleChildScrollView中拥有一个全屏列。这可以让你为所有屏幕大小创建一个完美的布局+有一个可滚动的屏幕，只有当你打开键盘或屏幕在呈现后溢出时才滚动(例如文本输入字段验证)
class PerfectFullScreen extends StatelessWidget {
const PerfectFullScreen({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
backgroundColor: Theme.of(context).backgroundColor,
appBar: AppBar(),
body: Builder(
builder: (context) => SingleChildScrollView(
child: ConstrainedBox(
constraints: BoxConstraints(
minHeight: MediaQuery.of(context).size.height -
(MediaQuery.of(context).padding.top + kToolbarHeight)),
child: IntrinsicHeight(
child: Column(
children: [
Container(
height: randomImageHeight,
child: Image.asset(
"assets/images/change_password.png",
fit: BoxFit.cover,
),
),
Expanded(
child: WidgetThatShouldTakeRemainingSpace() )
],
)))),
),
));
}
}
重要的部分是带有正确BoxConstraints和InstrinsicHeight小部件的ConstrainedBox。
PS: MediaQuery.of .padding(上下文)。top + kToolbarHeight) == Appbar的高度
好吧，我认为如果我们实现@Aman的解决方案，它将使我们的应用程序行为丑陋，因为当键盘出现时，它不会调整我们的屏幕视口根据可用的高度，它将使其他字段隐藏在键盘后面。所以我建议用esinglechildscrollview代替。
包装您的代码与SingleChildScrollView如下所示，
return new Container(
child: SingleChildScrollView(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
new Expanded(
flex: 1,
child: convertFrom,
),
new Expanded(
flex: 1,
child: convertTo,
),
new Expanded(
flex: 1,
child: description,
),
],
),
),
);
