[Phonegap+Sencha Touch] 移动开发24 打包wp8.1的App,运行时输入框聚焦弹出软键盘之后,界面上移而不恢复原位的解决办法

这个现象只出现在phonegap打包sencha touch的wp8.1程序会出现(仅wp8.1,wp8正常),其它js框架我测试了几个(app framework, jquery mobile),好像没有这个问题。

我来描述一下这个现象:

1、运行phonegap打包的wp8程序,打开一个有输入框的界面,如下图:

2、点击输入框,使其弹出软键盘,界面会上移,如下图:

3、点返回键隐藏软键盘(或者点击界面上其它地方隐藏软键盘),此时界面不恢复原位,如下图:

我的一些研究结果:

1、这种现象只出现在隐藏了app的状态栏的时候(即修改了MainPage.xaml文件shell:SystemTray.IsVisible="False")。

2、sencha app build native:运行时会出现这种现象

3、我做了一个phonegap app,用来加载远程网站(而不是本地的html+js),测试出来:

sencha app build production:这种方法编译出来的网站,用phonegap app浏览,没有这种现象

sencha app build package:这种方法编译出来的网站,用phonegap app浏览,有这种现象

4、wp8.1自带的IE浏览器,无论浏览production还是package的网站,都没有这种现象

综上:估计这个问题,既是sencha touch的问题,好像也是phonegap的问题(或者wp8.1的webbrowser的问题)

今天弄出来一个解决办法:

修改此文件:\platforms\wp8\MainPage.xaml ,

把:

<my:CordovaView HorizontalAlignment="Stretch"
               Margin="0,0,0,0"
               x:Name="CordovaView"
               VerticalAlignment="Stretch" />

改成:

<my:CordovaView HorizontalAlignment="Stretch"
               Margin="1,0,0,0"
               x:Name="CordovaView"
               VerticalAlignment="Stretch" />

当然,还有要去掉状态栏显示,shell:SystemTray.IsVisible="False"

欢迎加入Sencha Touch + Phonegap 群:194182999

共同学习交流(博主QQ:479858761

[Phonegap+Sencha Touch] 移动开发24 打包wp8.1的App,运行时输入框聚焦弹出软键盘之后,界面上移而不恢复原位的解决办法,布布扣,bubuko.com

时间: 2024-08-02 11:00:22

[Phonegap+Sencha Touch] 移动开发24 打包wp8.1的App,运行时输入框聚焦弹出软键盘之后,界面上移而不恢复原位的解决办法的相关文章

[Phonegap+Sencha Touch] 移动开发24 包wp8.1的App,弹出软键盘输入框聚焦实施后,无移动采收率方法来解决接口

这种现象不仅是现在显示phonegap包sencha touch的wp8.1该程序将出现(只wp8.1,wp8正常).其他js我测试了几个框架(app framework, jquery mobile),好像没有这个问题. 我来描写叙述一下这个现象: 1.执行phonegap打包的wp8程序,打开一个有输入框的界面,例如以下图: 2.点击输入框,使其弹出软键盘.界面会上移.例如以下图: 3.点返回键隐藏软键盘(或者点击界面上其他地方隐藏软键盘),此时界面不恢复原位.例如以下图: 我的一些研究结果

[Phonegap+Sencha Touch] 移动开发18 Sencha Touch项目通过phonegap打包后的程序名字的问题

之前说过 sencha phonegap init com.pushsoft.myapp MyApp 之后打包的程序安装包apk的名字是"MyApp.apk",显示在手机桌面上的程序名称(图标下面的文字)也是"MyApp" 如果要换成其他名字,修改 MyApp\config.xml 文件,把顶部"<name>MyApp</name>"中间MyApp的改成需要的名字. 注意如果xml内容有中文,要改成utf-8编码,注意是文

[Phonegap+Sencha Touch] 移动开发18 Sencha Touch项目通过phonegap打包后的程序名字的问题

之前说过 sencha phonegap init com.pushsoft.myapp MyApp 之后打包的程序安装包apk的名字是"MyApp.apk",显示在手机桌面上的程序名称(图标以下的文字)也是"MyApp" 假设要换成其它名字,改动 MyApp\config.xml 文件,把顶部"<name>MyApp</name>"中间MyApp的改成须要的名字. 注意假设xml内容有中文,要改成utf-8编码,注意是文

[Phonegap+Sencha Touch] 移动开发19 某些安卓手机上弹出消息框 点击后不消失的解决办法

Ext.Msg.alert等弹出框在某些安卓手机上,点击确定后不消失. 原因是: 消息框点击确定后有一段css3 transform动画,动画完成后才会隐藏(display:none).有些奇葩手机就是不一样. 解决办法就是禁用消息框的动画: 方法一: 在app.js的launch方法里面加上 Ext.Msg.defaultAllowedConfig.showAnimation = false Ext.Msg.defaultAllowedConfig.hideAnimation = false

[Phonegap+Sencha Touch] 移动开发30、phonegap的camera插件的几个问题

<span style="font-size:14px;">navigator.camera.getPicture(function(uri){ //得到拍摄的图片路径 }, function(err){}, { quality: 70, allowEdit: true, //拍摄完进行裁剪编辑 targetWidth: 250, targetHeight: 250, destinationType: navigator.camera.DestinationType.FIL

[Phonegap+Sencha Touch] 移动开发23 Android和IOS的webview点击穿透的缓解办法

安卓的webview和自带浏览器下有个奇怪的现象. 现象: 1.如果输入框input或者textarea的正上方(z轴方向,即上层)有个div,当点击这个div使得div隐藏了之后,input会得到焦点,导致软键盘弹出. 2.浏览视图点击某个地方切换到编辑视图,如果浏览视图点击的位置 在 编辑视图相应位置有个输入框,那么切换过去之后,编辑页的输入框会自动得到焦点. 这个体验很不舒服. 讨论: 这个不是点击事件的事件冒泡导致的(因为e.stopPropagation()和return false是

[Phonegap+Sencha Touch] 移动开发29 安卓navigator.camera.getPicture得到图片的真实路径

phonegap的拍照插件选择图库中的图片,代码如下: navigator.camera.getPicture(function(uri){ console.log(uri);//这里得到图片的uri }, function(err){ console.log(err); }, { quality: 70, destinationType: navigator.camera.DestinationType.FILE_URI, sourceType: navigator.camera.Pictur

[Phonegap+Sencha Touch] 移动开发77 Cordova Hot Code Push插件实现自己主动更新App的Web内容

原文地址:http://blog.csdn.net/lovelyelfpop/article/details/50848524 插件地址:https://github.com/nordnet/cordova-hot-code-push 以下是我对GitHub项目readme的翻译 ---------------------------------------------- Cordova Hot Code Push Plugin 此插件提供了能够使cordova app自己主动更新web内容的功

[Phonegap+Sencha Touch] 移动开发43 WebApp字体图标的制作

Sencha touch从2.2开始,里面用到的图标全部是字体图标(icon font),也就是字体文件里面的字符作为图标来用. 主要特性 字体是矢量的,使用icon font来生成图标相对于基于图片的图标来说,有如下的好处: 自由的变化大小而不失真,适用于不同分辨率和尺寸的屏幕 自由的修改颜色 添加阴影效果 支持图片图标的其它属性,例如,透明度和旋转等等 可以添加text-stroke和background-clip:text等属性,只要浏览器支持 字体图标的用法 我们来看下sencha to