PhoneGap + JQueryMobile + HTML5

此文章仅是为了给自己做个备注,或是提供给和我一样初学的、碰到相同问题的人们,高手请勿吐槽...

 

最近自己搞了一个PhoneGap + JQueryMobile + HTML5做Android的小应用,安装在手机上后,发现在转场的过程中,页面会有非常强列的闪屏,这对于用户体验来说是非常不爽的,这个硬伤必须克服。

所以就找资料,网上说的最多的无非就是两种方式:

1)官方提供的修改css

.ui-page { -webkit-backface-visibility: hidden; }

这是我现在试下来最没有效果的,不知道会不会根据各版本不同而有不同的效果,我使用的JQueryMobile版本是1.4.2

2)修改JQueryMobile的默认配置

$(document).bind("mobileinit", function(){
  $.extend(  $.mobile , {
     defaultPageTransition: ‘none‘
  });
});

这个确实有些效果,至少闪屏抖动不像原来那么大,但还是没彻底解决,体验还是不佳

 

终于在某一天,被我找到一个第三种可尝试的方法,Oh my god,原来这就是我想要的

在AndroidManifest.xml中设置

PhoneGap + JQueryMobile + HTML5
<application android:debuggable="true"   
android:hardwareAccelerated="false"  
android:icon="@drawable/icon"  
android:label="@string/app_name">
        <activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" 
android:label="@string/app_name"
android:name="CST" android:theme="@android:style/Theme.Black.NoTitleBar">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
PhoneGap + JQueryMobile + HTML5

以上代码第二行,默认为[ android:hardwareAccelerated="true" ],把它改成false,意思是关闭Android的硬件加速


PhoneGap + JQueryMobile + HTML5,布布扣,bubuko.com

PhoneGap + JQueryMobile + HTML5

上一篇:基于视觉的Web页面分页算法VIPS的实现源代码下载


下一篇:Linux基础入门(一)初识Shell