zoukankan      html  css  js  c++  java
  • 设置 phoneGap/Cordova 3.4 应用程序启动动画闪屏 SplashScreen

    当Cordova 程序打包并安装到手机中后,我们会发现启动程序时,会有数秒的黑屏现象,常见的解决方法则是设置闪屏后面。

    这里以 Android 程序为例,介绍Cordova设置启动画面的方法。

    1. 添加动画闪屏支持

    打开cmd,进入项目目录下,执行命令:

    cordova plugin add org.apache.cordova.splashscreen

    2. 制作启动画面图片

    根据 platformsandroid es 目录下的不同目录下的图片大小,分别制作不同屏幕适应的 png 格式图片,并一一替换。

    3. 增加项目配置项

    在项目根目录下的config.xml中添加两个配置项:

    <preference name=”SplashScreen”value=”splash” />
    <preference name=”SplashScreenDelay” value=”30000″ />

    第一个配置指定了启动画面的文件名;
    第二个设置指定启动画面停留的时间(单位为毫秒)。

    4. 增加隐藏闪屏画面处理

    当设备就绪后,即可及时隐藏闪屏。在 deviceready 事件处理函数中,加入隐藏闪屏画面的代码。参考如下:

    1 bindEvents: function() {
    2     document.addEventListener('deviceready', this.onDeviceReady, false);
    3 },
    4     onDeviceReady: function() {    
    5     app.receivedEvent('deviceready');
    6     <strong><span style="color: #ff0000;">navigator.splashscreen.hide();</span></strong>
    7 }

    注意:

    配置项 SplashScreenDelay 的值建议尽量设置大一些,比如 30000(30秒)。闪屏画面显示时,其他资源文件是按正常情况加载的(即程序不会等到启动画面消失再开始加载),如果设置的delay值太小,比如3000(3秒),而首页加载需要5000(5秒),则有2秒的时间屏幕会处于黑屏状态。所以我们设置的值应大于首页加载时间值时,当设备就绪后隐藏闪屏画面即可。

  • 相关阅读:
    SQL Server 日期和时间函数
    sql日期格式化函数
    C#中事件的使用
    CSS中的display:inline-block
    用aspnet_regiis注册Framework4.0框架
    什么是CSS hack
    第一次MySQL的SQL注入实验
    (二分)Block Towers(cf626)
    (多线程dp)Matrix (hdu 2686)
    (数位dp)Bomb (hdu 3555)
  • 原文地址:https://www.cnblogs.com/justTheOne-bin/p/3762865.html
Copyright © 2011-2022 走看看