• 首页 首页 icon
  • 工具库 工具库 icon
    • IP查询 IP查询 icon
  • 内容库 内容库 icon
    • 快讯库 快讯库 icon
    • 精品库 精品库 icon
    • 问答库 问答库 icon
  • 更多 更多 icon
    • 服务条款 服务条款 icon

Flutter 弄一个输入框和键盘的弹窗

武飞扬头像
氤氲息
帮助1

一个问题:怎么让输入框贴着键盘:
可用如下方法解决

Padding(
  padding: EdgeInsets.only(
    bottom: MediaQuery.of(context).viewInsets.bottom
  ),
  child: TextField(
  )
)

但是想在row里面嵌套输入框
那就在textFidle外面套个Expanded

一个问题:弹窗没有状态,怎么setState:StatefulBuilder

我自己的代码

return Container(
      ///弹框大小
      child: Column(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          Padding(
            padding: EdgeInsets.only(
                bottom: MediaQuery.of(context).viewInsets.bottom),
            child: Row(
              children: [
                Expanded(
                  child: Container(
                    padding: EdgeInsets.only(left: 20, right: 10),
                    margin: EdgeInsets.only(left: 15, right: 12, bottom: 25),
                    decoration: BoxDecoration(
                        color: Color(0xFF2D2D2D),
                        borderRadius: BorderRadius.circular(50)),
                    child: TextFormField(
                      maxLines: 1,
                      style: const TextStyle(color: Color(0xFFFFFFFF)),
                      controller: _Controller,
                      focusNode: _focusNode,
                      decoration: const InputDecoration(
                        //去除下划线
                        border: InputBorder.none,
                        hintText: "這裡還缺一條你的優質評論",
                        hintStyle: TextStyle(color: Color(0xFF666666)),
                      ),
                    ),
                  ),
                ),
                Container(
                  height: 30,
                  width: 30,
                  margin: const EdgeInsets.only(bottom: 25, right: 5),
                  decoration: const BoxDecoration(
                    image: DecorationImage(
                      image: AssetImage(
                          "assets/base_widgets/icon_dynamic_details_smiley.png"),
                      fit: BoxFit.fitWidth,
                    ),
                  ),
                ),
                if (canSeeButton)
                  GestureDetector(
                    onTap: () {
                      _focusNode.unfocus();
                    },
                    child: Container(
                      margin: EdgeInsets.only(left: 5, right: 10, bottom: 25),
                      padding: EdgeInsets.only(
                          left: 10, right: 10, top: 5, bottom: 5),
                      decoration: BoxDecoration(
                          color: Color(0xFFE6CFA1),
                          borderRadius: BorderRadius.circular(8)),
                      child: Text(
                        "发送",
                        style: TextStyle(fontSize: 16),
                      ),
                    ),
                  ),
              ],
            ),
          ),
        ],
      ),
    );
学新通

这篇好文章是转载于:学新通技术网

  • 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
  • 本站站名: 学新通技术网
  • 本文地址: /boutique/detail/tanhfkjcbf
系列文章
更多 icon
同类精品
更多 icon
继续加载