9

我有需要输入手机触摸键盘的游戏。它的显示有问题,每当键盘出现在文本输入焦点上时,我所有的 position: absolute 元素都会搞砸。

是否有一个插件可以使移动键盘始终显示,以便我重新定位所有元素,或者我需要更改 css 以制作元素,以便在键盘出现时不会弄乱?

我应该如何实现这个?

这是元素 css 之一:

#mixer{  
    position: absolute;  
    bottom:29%;
    left:25%;
    width: 234px;  
    height: 210px;  
    background: transparent url(img/mixer.png) 0 50px no-repeat;  
} 

在此处输入图像描述

注意:我在 Android 环境中使用的是 Jquery mobile,phonegap。

4

5 回答 5

18

在您的 AndroidManifest.xml 中,使用键盘在 Activity 下添加以下行:

android:windowSoftInputMode="adjustNothing"

于 2012-11-15T14:16:59.277 回答
1

我认为您的问题在于您的底部属性设置为“在这种情况下”为 29%。您可能希望使用 TOP 而不是底部将其设置为绝对值。

这样它将从顶部推动而不是从底部看,在这种情况下是键盘。

所以你希望它位于底部的 29%,100 - 29 = 71 移除底部 29% 并将其更改为顶部 71%。

于 2012-11-10T05:33:05.130 回答
1

收听显示/隐藏软键盘事件。SO上的这个答案有一个代码示例:

Android中的软键盘事件监听器

当软键盘处于显示状态时,为您的游戏使用单独的“键盘显示”CSS。当软键盘被隐藏时,恢复到以前的“键盘关闭”CSS。

之前关于 SO 的 Q&A 处理了类似的情况:

Android 2.3.6 和 iPhone 5.0 中软键盘的 phonegap 应用程序布局问题

于 2012-11-15T07:04:55.557 回答
1

我在 iPad 应用程序而不是 android 上遇到了这个问题,但它看起来像同样的问题。

当大小发生变化时,jQuery mobile 使用 javascript 设置页面高度 - 与页面底部对齐的任何内容在 html 中向上移动,同时操作系统向上滚动整个视图以保持输入的先前位置可见。

我用一些 css 解决了这个问题,这些 css 使浏览器忽略了高度设置。它还使方向变化更加平滑。

.ui-mobile, .ui-mobile .ui-page {
    min-height: 100% !important;
    }
于 2012-11-16T03:16:12.253 回答
1

查看这些链接-

http://android-developers.blogspot.in/2009/04/updating-applications-for-on-screen.html

http://developer.android.com/reference/android/R.attr.html#windowSoftInputMode

尝试将 manifest android:windowSoftInputMode="adjustResize" 参数添加到您的活动标签中。

希望能帮助到你。

于 2012-11-16T15:19:55.430 回答