Flutter 点击输入框后键盘闪出后立刻消失

是南极熊啊

已于 2022-05-27 17:14:14 修改

阅读量1.9k

点赞数 1

分类专栏： Flutter开发随笔文章标签： flutter android ios

于 2022-05-20 20:04:54 首次发布

本文链接：https://blog.csdn.net/phetppy/article/details/124889696

版权

在Flutter应用中，Scaffold组件在键盘弹出时会改变布局，可通过设置`resizeToAvoidBottomPadding:false`阻止布局刷新。但键盘仍影响MediaQuery的尺寸，若父组件依赖MediaQuery调整大小，键盘弹出时组件仍可能刷新。解决方法是启动前保存屏幕大小，避免键盘影响。此外，更新提到在iOS上，`window.physicalSize`可能存在返回0的bug，通过延迟加载可解决。

摘要由CSDN通过智能技术生成

flutter 在布局最顶端使用的是Scaffold组件，在点击输入框键盘弹出后，布局的默认反应是改变屏幕大小重新布局。

这时通常会在Scaffold中添加选项：

resizeToAvoidBottomPadding:false

添加之后，应用整体布局不会随着键盘弹出而刷新改变。

但是键盘的弹出仍然会改变 MediaQuery.of(context).size获取到的数值，因此如果有输入框的父组件通过MediaQuery来决定自身大小的话，在键盘弹出的时候整个组件仍然会进行刷新导致键盘隐藏。

因为只考虑移动端，屏幕大小不会发生改变，所以考虑将屏幕大小提前保存成固定的数值。

import 'dart:ui';

//1.获取屏幕物理大小

double physicalWidth = window.physicalSize.width;

double physicalHeight = window.physicalSize.height;

// 2.获取dpr

double dpr = window.devicePixelRatio;

// 3.宽度和高度

double screenWidth = physicalWidth / dpr;

double screenHeight = physicalHeight / dpr;

app启动之前提前获取好屏幕大小，在布局时直接引用，键盘弹出时就不会出现组件刷新导致键盘隐藏的问题。

-------------------------------------2022.5.27 更新------------------------