在键盘上方显示文本字段

Question

我知道这方面有很多悬而未决的问题，我已经尝试了很多，但在我的情况下没有一个起作用。所以我想让 TextField 在键盘上方弹出，然后在键盘没有打开时返回到其原始位置显示。

原位置：

当键盘弹出时，我的屏幕像这样溢出：

代码：

    @override
      Widget build(BuildContext context) {
        return Scaffold(
          resizeToAvoidBottomInset: true,
          appBar: AppBar(
            title: Text(
              'Chat',
              style: TextStyle(
                  fontFamily: 'Chalet',
                  fontWeight: FontWeight.w300,
                  fontSize: widget.deviceWidth * 0.06),
            ),
          ),
          backgroundColor: whitePrimary,
          body: Column(
            children: [
              SizedBox(
                height: widget.deviceHeight * 0.8,
                child: ListView.builder(
                    itemCount: _messages.length,
                    itemBuilder: (BuildContext context, int index) {
                      return ListView(
                        children: [Text(_messages[index])],
                      );
                    }),
              ),
              const Divider(height: 1.0),
              _buildTextComposer()
            ],
          ),
        );
      }
    
      Widget _buildTextComposer() {
        return SizedBox(
          width: widget.deviceWidth,
          child: TextField(
            controller: _textFieldController,
            decoration: InputDecoration(
              border: InputBorder.none,
              focusedBorder: InputBorder.none,
              enabledBorder: InputBorder.none,
              errorBorder: InputBorder.none,
              disabledBorder: InputBorder.none,
              filled: true,
              fillColor: whitePrimary,
              suffixIcon: IconButton(
                icon: const Icon(
                  Icons.send_rounded,
                  color: orangePrimary,
                ),
                onPressed: () {},
              ),
              hintStyle: TextStyle(fontSize: widget.deviceWidth * 0.03),
              hintText: 'Write a message...',
            ),
          ),
        );
      }

哪里

deviceHeight

和

deviceWidth

    final size = MediaQuery.of(context).size;
    
        double deviceWidth = size.width;
        double deviceHeight = size.height;

Answer 1

您可以使用

signleChildScrollView

修复它。