重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
1、点击输入flutter框弹出软键盘时,遮挡本输入框一部分。
网站建设哪家好,找创新互联公司!专注于网页设计、网站建设、微信开发、小程序定制开发、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了阿荣免费建站欢迎大家使用!
2、点击输入框,输入框跟随软键盘自动上移时其他不该移动的内容也跟随上移导致的flutter键盘弹出时listview置底。
webview的版本是webview_flutter: ^0.3.22+1
现在遇到的问题是如果webview中输入密码的话,像华为这种会调用自己的安全键盘,这时候就会黑屏,应该是内部计算键盘高度的问题。这时候没办法了,网页web端密码框需要修改一下了自己自定义一下不调用密码类型就好,但是无法被输入框弹上去,后来解决方案是用SingleChildScrollView包裹一下,然后自己监听一下键盘的弹窗和隐藏做一下jump的高度就好了
ps: jump的时候要注意高度,可以在键盘出来的时候底部增加一个只有高度的view,键盘收起隐藏就好了
可以使用 SingleChildScrollView 包裹布局
这里还需要了解一个 Scaffold 中的一个属性 resizeToAvoidBottomInset
官方文档给出的解释就是处理键盘遮挡问题,默认是 true,如果不希望顶起需要设置为 false。
在 sdk 低版本的时候是使用 resizeToAvoidBottomPadding 需要将其设置为 false,现在已经弃用。但网上很多文章还没有改正,仍然用的 resizeToAvoidBottomPadding。
分两种情况
一种是使用系统的返回键,比如 android 底部导航自带的返回,
另一种是使用导航栏自定义的返回键
第一种情况需要在页面根布局使用 WillPopScope 在 onWillPop 中拦截返回处理。
原理都是通过判断输入框是否获取了焦点
当底部有固定的组件,比如提交按钮,我们在键盘弹起的时候希望按钮贴着键盘顶部固定,但是中间滚动视图可以自由滚动
可以在 SingleChildScrollView 外部再使用 Stack 包裹,悬浮按钮使用 Positioned 定位,
还要⚠️注意要给滚动组件底部留出距离防遮挡,同时还有动态加上 bottomBar 的高度,因为在 iphoneX 以上的手机,会有个虚拟按键,如果不加上该按键高度,同样会被遮挡
高度获取方法: MediaQuery.of(context).padding.bottom
在 showDialog 布局中使用 Scaffold 包裹,不要忘了将 backgroundColor 设为透明。
如果弹窗过高,还是需要将高度固定,然后使用 SingleChildScrollView ,弹窗中同样也可以在执行关闭的时候拦截,判断键盘是否弹起,如果弹起则要先关闭键盘。
给所有输入框绑定 FoucusNode
在 maxLines=1 的情况下,输入框不支持换行,换行按钮会变成 done
监听 onEditingComplete 方法
根布局使用 GestureDetector 或者 InkWell 包裹,点击的时候收起键盘。
最后要记得销毁