如何让 BottomNavigationBar 粘在键盘颤动的顶部

2024-05-10

我正在尝试制作一个简单的聊天应用程序,所以我创建了一个脚手架和我的身体,将是消息和我的bottomNavigationBar将是我的打字字段和发送图标。

我添加了一个文本字段,但键入时导航栏被键盘隐藏。

这是我的代码BottomNavigationBar :

bottomNavigationBar: new Container(
          height: ScreenSize.height/12,
          /*color: Colors.red,*/

          child: new Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,

            children: <Widget>[
              new Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: <Widget>[
                  new Container(
                    child: new Icon(Icons.send),

                    width:ScreenSize.width/6,
                  ),
                ],
              ),
              new Column(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: <Widget>[
                  Material(
                    child: new Container(
                      child: new TextField(
                        autofocus: false,
                        decoration: InputDecoration(
                          contentPadding: EdgeInsets.all(9.0),
                          border: InputBorder.none,
                          hintText: 'Please enter a search term',
                        ),
                      ),
                      width:ScreenSize.width*4/6,
                    ),
                      elevation: 4.0,
                    /*borderRadius: new BorderRadius.all(new Radius.circular(45.0)),*/
                    clipBehavior: Clip.antiAlias,
                    type: MaterialType.card,
                  )
                ],
              ),
              new Column(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: <Widget>[
                  new Container(
                    child: Text('HELLO C1'),
                    color: Colors.green,
                    width:ScreenSize.width/6,
                  ),
                ],
              )




            ],
          ),
        ),

这是聚焦时的样子:


只需用 Padding 包裹底部导航栏并将其设置为 MediaQuery.of(context).viewInsets,

  bottomNavigationBar: Padding(
       padding: MediaQuery.of(context).viewInsets,
        child: ChatInputField(),
     ),
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何让 BottomNavigationBar 粘在键盘颤动的顶部 的相关文章

随机推荐

  • 在基于视图的 NSTableView 中,如何通过单击使控件成为第一响应者?

    基于视图的 NSTableView 似乎只有标准行为 为了使表内的文本字段成为第一响应者 用户必须双击或单击并 保持冷静 然而 考虑到基于视图的 NSTableViews 提供的灵活性 这种行为并不总是可取的 因为现在可能有很多不同且复杂的
  • 发送 OneSignal 推送通知时 Android 应用程序崩溃

    Android 应用程序在发送信号推送通知后立即崩溃 我收到这个错误 尝试查看其他 stackoverflow 答案 但没有帮助 请检查下面的代码 build gradle 和错误 不明白为什么它不起作用 P 请检查下面的代码 build
  • wait task.delay 有助于加快 UI 刷新速度,但是如何实现呢?

    我有一个视图模型 它正在获取一行记录并显示在 Windows Phone UI 上 这个获取数据的视图模型方法正在执行大量任务 所有任务都标记为等待操作 如下所示 async Task GetData var dataCollection
  • 如何使用 grid.arrange 移动图例位置

    我试图在一页中排列 4 个图 将图例放在底部中心 我用它来获取其中一个图的图例 因为它们对于四个图来说是相同的 get legend lt function myggplot tmp lt ggplot gtable ggplot buil
  • Java 的 QP 求解器 [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • Angular flex-layout - fxLayoutGap 导致包裹行末尾出现恼人的间隙

    使用fxLayoutGap 和wrap 在被换行的每一行的末尾留下令人讨厌的边距 有没有办法来解决这个问题 https stackblitz com edit angular fxlayoutgap calc mralnz file app
  • 在 Spring 中设置 WS https 调用超时 (HttpsUrlConnectionMessageSender)

    我正在尝试为 WS 调用设置超时 我延长了WebServiceGatewaySupport并尝试将发送者超时设置为如下 public Object marshalSendAndReceive Object requestPayload We
  • 颤动附近的连接

    当我尝试在设备上做广告或发现时 我收到此错误 但是前一天在环路上效果很好 PlatformException Failure 17 API Nearby CONNECTIONS API is not available on this de
  • 在 Django Rest Framework 中过滤多个值

    我有一个模型想要过滤多个值 我的模型 class Product models Model ean models CharField max length 13 unique True product id models CharField
  • 不支持函数调用。考虑用对导出函数的引用替换函数或 lambda

    我在我的应用程序中使用 APP INITIALIZER 并在 app module ts 中将其设置如下 并进行必要的导入 NgModule providers ContextService provide APP INITIALIZER
  • F# 对于 OO 或命令式来说缺少什么? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 基本 C++ 文本对齐

    我正在尝试编写一个程序 该程序从文件中获取输入行并使其恰好为 80 个字符 假设输入行始终小于 80 然后打印该行 这是通过在以下标点符号后添加最多两个空格来完成的 如果一行少于 41 个字符 则不加修改地打印 如果该行仍然不是 80 个字
  • 将本机 swift Set 转换为数组[重复]

    这个问题在这里已经有答案了 我需要将 Set 转换为 AnyObject 或 String 的数组 这可能吗 我知道使用 NSSet 我可以使用 allObjects 但对于本机集似乎没有任何函数 只需直接强制转换为数组即可 let arr
  • History.pushState和页面刷新

    我开始研究 HTML5 新历史 API 不过 我有一个问题 如何处理页面刷新 例如 用户单击一个链接 该链接由 js 函数处理 该函数 异步加载页面内容 使用history pushState 更改URL 用户刷新页面 但是服务器上当然不存
  • 如何自定义 ckeditor 4.2 内置插件(如链接)?

    如果我想向链接插件添加选项卡 最佳实践方法是什么 我不想更改发布代码 只需用带有我的自定义的版本覆盖它即可 因此 很容易更新新版本 CKEDITOR 4 2 有这方面的操作方法吗 我正在使用新的内联样式工具栏 如果我获得源代码 我可以在没有
  • Windows、Emacs、Git Bash 和 shell 命令

    Windows 7 Emacs 24 3 1 git 1 8 1 msysgit 1 我的等效 emacs 文件中有以下内容 if equal system type windows nt progn setq explicit shell
  • Tesseract 是否会忽略扫描文档中的任何非文本区域?

    我正在使用 Tesseract 但我不知道它是否忽略任何非文本区域并仅针对文本 我是否必须删除任何非文本区域作为预处理步骤以获得更好的输出 Tesseract 有一个非常好的算法来检测文本 但它最终会给出误报匹配 理想情况下 您应该在将图像
  • 使用javascript向url添加哈希而不滚动页面?

    在不滚动页面的情况下向 url 添加哈希 使用 JavaScript 我打开页面 我向下滚动 我单击添加哈希的链接 可能带有值 test 示例 http www example com test http www example com t
  • 如何在 Material UI 的 webpack 构建中包含 Roboto 字体?

    For a 进步网络应用程序基于材质用户界面 http www material ui com 反应 并构建Webpack 我如何正确包含 Roboto 字体 以便该应用程序不依赖于 Google 服务器并且字体也可以工作offline T
  • 如何让 BottomNavigationBar 粘在键盘颤动的顶部

    我正在尝试制作一个简单的聊天应用程序 所以我创建了一个脚手架和我的身体 将是消息和我的bottomNavigationBar将是我的打字字段和发送图标 我添加了一个文本字段 但键入时导航栏被键盘隐藏 这是我的代码BottomNavigati