Question

我有一个聊天应用程序的代码，该应用程序呈现了一系列消息。问题是页面显示正常，但尝试发送消息时出现渲染溢出。就像我的输入一直在上升，而不是在显示的键盘上自行设置一样。

这是我用于呈现页面的代码

 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理论。如果您有一些见解，我也将不胜感激，这样我就可以深入了解它的行为。

Answer 1

resizeToAvoidBottomPadding: false可能会有所帮助。看看here

正如@diegoveloper的评论一样，它不会调整大小，这意味着它不会在键盘后面显示内容。根据您的用例，您可以在上面的链接中选择选项1或2

颤振渲染listView溢出

1 个答案: