android 键盘上方浮动,【已解决】点击input输入框时Android端底部的Tab弹出显示在键盘上方...

已经用Preact实现H5页面的移动端app了

iOS和Android分别是原生app去打包加了个壳，内部用Webview去加载H5页面

现在遇到一个问题：

Android端，对于input输入框来说，点击后键盘从底部弹出

但是结果原先在app底部的tab也浮动到键盘上面了，折腾了部分内容，影响输入：

注：iOS不存在此问题：

然后对于整个tab导航栏的div的position从fixed改为absolute：

结果：

问题依旧。

android webview 输入法遮挡

android webview input method

android webview position fixed move up

看起来像是：android中的webview对于position:fixed 有bug？

user-scalable改为no，就可以了？

去试试，问题依旧。

android webview div fixed move up when keyboard show

继续调试：

感觉是：

当android的显示键盘是，底部的边缘就上移了。

-》所以即使上述的bottom为0，所以也还是会上浮

-〉而整个页面的高度，并没有受影响

加上!important：

.wrapper {

// position: fixed;

position: absolute !important;

看看结果如何

问题依旧：

感觉是：

当键盘弹出时，整个webview的高度都减少了

-》所以android远程调试的左边webview的页面的高度就减少了，都看不到键盘

android keyboard show webview height

android keyboard show reduce page height

android keyboard reduce page height

android webview keyboard

android WebKit keyboard

android WebKit keyboard page move up

让原生app的壳中把相关代码改为：

android:windowSoftInputMode="adjustPan"

或：

android:windowSoftInputMode=“adjustNothing"

看看结果

结果就是：

【总结】

不需要改动webkit相关的代码，而是去把android的原生代码改为：

android:windowSoftInputMode="adjustPan"

后，就可以了：

在点击了input弹出键盘后：

android手机端截图：

Mac中Chrome调试的效果是：

从上图可见：

在键盘弹出后，原先的WebKit的高度没有(像之前一样)被压缩和降低，而是正常的(保持不变)

android 键盘上方浮动,【已解决】点击input输入框时Android端底部的Tab弹出显示在键盘上方...相关推荐

解决默写浏览器中点击input输入框时，placeholder的值不消失的方法
解决默写浏览器中点击input输入框时,placeholder的值不消失的方法参考文章: (1)解决默写浏览器中点击input输入框时,placeholder的值不消失的方法 (2)https:// ...
解决浏览器中点击input输入框时，placeholder的值不消失的方法
<input type="text" placeholder="请输入" οnfοcus="this.placeholder=''" ...
[html] android手机的微信H5弹出的软键盘挡住了文本框，如何解决？
[html] android手机的微信H5弹出的软键盘挡住了文本框,如何解决? window.addEventListener("resize", function () {if ...
点击底部input输入框，弹出的软键盘挡住input（苹果手机使用第三方输入法）
测试移动端页面的时候,偶然发现点击底部input输入框时,弹出的虚拟键盘偶尔会挡住input输入框. 输入框固定在页面底部,如图所示: input固定底部设计图.png 点击底部input输入框唤起软 ...
（已解决）ubuntu16.04蓝牙耳机与电脑配对成功，但不出现在声音输出设备里
(已解决)ubuntu16.04蓝牙耳机与电脑配对成功,但不出现在声音输出设备里 Ubuntu 16.04 + 小米1000XM3蓝牙耳机问题:电脑与蓝牙耳机配对成功.连接成功,但是声音设备里只有电 ...
Android监听系统输入法键盘弹出显示与隐藏事件
Android监听系统输入法键盘弹出显示与隐藏事件有时候需要监听Android系统输入法的弹出显示事件,比如:微信聊天时,不管你当前在聊天中的什么位置(上滑查看消息历史),每当你点击输入框时,都会自 ...
Android EditText设置弹出数字输入法键盘
Android EditText 设置弹出数字输入法键盘首先设置只能输入数字: <EditText Android:id="@+id/edit_digit_input" a ...
解决 H5 IOS input 聚焦时，软键盘将页面整个推上去，键盘收起页面未下移 BUG
目录问题描述解决方案问题描述近日在开发H5应用时,测试人员发现在IOS低版本中input,textArea等输入框聚焦时,软键盘弹起会将整个页面向上顶,收回键盘后,页面不会回弹恢复页面,导致页 ...
小程序点击input框时被软键盘挡住解决方案
小程序点击input框时被软键盘挡住解决方案可以正在input上面加 cursor-spacing='10' <input type="number" value=&quo ...

android 键盘上方浮动,【已解决】点击input输入框时Android端底部的Tab弹出显示在键盘上方...

android 键盘上方浮动,【已解决】点击input输入框时Android端底部的Tab弹出显示在键盘上方...相关推荐

最新文章

热门文章