【发布时间】:2019-01-29 22:29:14
【问题描述】:
我有一个用于呈现一系列消息的聊天应用程序的代码。问题是页面显示正常,但是在尝试发送消息时出现渲染溢出。就像我的输入一直在上升,而不是在我显示的键盘上设置自己。
这是我渲染页面的代码
return Scaffold(
body: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Flexible(
child: ListView.builder(
itemBuilder: (_, index) => _messages[index],
itemCount: _messages.length,
//El reverse hace que vaya de abajo hacia arriba
reverse: true,
padding: EdgeInsets.all(6.0),
),
),
Divider(
height: 1.0,
),
Container(
child: _buildComposer(),
decoration: BoxDecoration(color: Theme.of(context).cardColor),
)
],
),
);
这里我有我认为错误所在的输入代码
Widget _buildComposer() {
return IconTheme(
data: IconThemeData(color: Theme.of(context).accentColor),
child: Container(
margin: const EdgeInsets.symmetric(horizontal: 9.0),
child: Row(
// mainAxisSize: MainAxisSize.min,
children: <Widget>[
Flexible(
child: TextField(
controller: _textController,
onChanged: (String texto) {
setState(() {
_isWriting = texto.length > 0;
});
},
onSubmitted: _enviarMensaje,
decoration:
InputDecoration.collapsed(hintText: "Envie un mensaje!"),
),
),
Container(
margin: EdgeInsets.symmetric(horizontal: 3.0),
child: IconButton(
icon: Icon(Icons.message),
onPressed: _isWriting
? () => _enviarMensaje(_textController.text)
: null,
),
)
],
),
),
);
}
这是我用于初始渲染的打印捕获,在单击输入后写入一些消息
这是我的日志,应该很容易理解我应该采取的方法,但我没有任何运气。
仅供参考:我已经尝试过这种方法,但似乎没有用 StackOverflow answer on rendering
我已经阅读了 flutter.io 文档,但我不了解整个 listview 理论。如果您有一些见解,我也将不胜感激,这样我就可以深入了解它的行为方式。
【问题讨论】:
-
resizeToAvoidBottomPadding: false可能会有所帮助.. 看看stackoverflow.com/questions/51972371/bottom-overflow-by-30px/… -
Dinesh,你太棒了,先生,拯救了我的一天!谢谢你快速的回复。如果可以的话,请将此回复设置为回答,以便我可以结束这个问题。
-
resizeToAvoidBottomPadding 的问题是它不会将内容推到顶部,因此您不会在屏幕上看到最后一条消息。
-
很高兴它有帮助。添加为答案