问题描述:

在ionic2下创建的项目打包生成apk,运行在真机上,进入启动页然后有5秒左右的白屏情况才进入首页,在真实项目中更严重,启动画面后更有时候十几秒都是白屏,体验性非常差。

在各种搜索之下,我只找到了这个解决方案,就是将启动画面延长。

1.添加 cordova-plugin-splashscreen 插件 并查看是否添加成功

cordova plugin add cordova-plugin-splashscreen //添加 cordova-plugin-splashscreen 插件 
cordova plugin list  //查看项目有什么插件

//cordova-plugin-splashscreen 插件更多详细信息以及说明可以到看这里→ https://github.com/apache/cordova-plugin-splashscreen

//更多关于cordova的基本命令已经如何添加已经删除插件请看这里→http://www.cnblogs.com/huangenai/p/6840333.html

2.修改config.xml 配置

打开config.xml 可以看到他最初config.xml配置。

AutoHideSplashScreen 是否自动隐藏启动画面,默认是为true,在这里我们设置未false。

 <preference name="AutoHideSplashScreen" value="false" />

SplashScreenDelay 自动隐藏闪屏之前等待的时间(毫秒)(默认为3000)。在这里我将它延长改为6000。

<preference name="SplashScreenDelay" value="6000"/>

ShowSplashScreenSpinner,默认为true ,在这里设置未false,设置为false为隐藏闪屏。

 <preference name="ShowSplashScreenSpinner" value="false"/>

FadeSplashScreen 默认未true。设置为false,以防止闪屏在其显示状态更改时进入和退出。

<preference name="FadeSplashScreen" value="false"/>

将初始的配置那三行删掉我们将下面的复制进去

     <preference name="SplashShowOnlyFirstTime" value="false"/>
<preference name="SplashScreen" value="screen"/>
<preference name="SplashScreenDelay" value="6000"/>
<preference name="AutoHideSplashScreen" value="false" />
<preference name="ShowSplashScreenSpinner" value="false"/>
<preference name="FadeSplashScreen" value="false"/>
<preference name="ShowSplashScreen" value="true"/>

然后在命令提示符里输入 后回车重新编译一下。

cordova build android

在这个目录下 src/app 打开app.component.ts 中有来确保是否又这段代码

platform.ready().then(() => {
Splashscreen.hide();//启动后关闭splashscreen页面(不用设置)
});

android studio 重新跑一次,在真机上就不会出现开机会有一个圆圈一直转圈了,也不会出现开机启动画面后出现白屏的情况。

3.关于app启动慢的问题

虽然解决了启动出现白屏的问题。可是开机而然很慢。

使用ionic build android 生成的apk启动时间比较长,可以使用ionic build android --prod 来生成的apk启动时间会相对来说快一点。

2017-09-13 08:15 新增:

后面在新建的ionic3项目,相对ionic2来说启动已经快了很多了。

ionic2 关于启动后白屏问题跟app启动慢的问题的更多相关文章

  1. ionic2常见问题-启动后白屏问题

    问题描述 app启动后大概有几秒白屏,才会显示首页,如下gif图 启动有白屏.gif 解决方法1 请查看以下3张图的标注 图 1-最初config.xml配置 图 2-更改后的splash配置 图 3 ...

  2. ionic2常见问题——启动后白屏问题

    问题描述 app启动后大概有几秒白屏,才会显示首页. 解决方案 图 1-最初config.xml配置 图 2-更改后的splash配置 代码: <preference name="Sh ...

  3. Android APP应用启动页白屏(StartingWindow)优化

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 StartingWindow 的处理方式: 使用系统默认的 StartingWindow :用户点了应用图标启动应用,马上弹出系统默 ...

  4. Android Activity启动黑/白屏原因与解决方式

    Android Activity启动黑/白屏原因与解决方式 我们新建一个HelloWorld项目,运行在手机上时,Activity打开之前会有一个动画,而这个动画里是全白或者全黑的(取决于你的主题是亮 ...

  5. 消除 activity 启动时白屏、黑屏问题

    默认情况下 activity 启动的时候先把屏幕刷成白色,再绘制界面,绘制界面或多或少有点延迟,这段时间中你看到的就是白屏,显然影响用户体验,怎么消除呢? 在 Activity theme 设置sty ...

  6. Xamarin.Android splash页面瞬间响应_避免APP启动闪白屏

    Application和Activity中的onCreate都进行了优化,基本没有耗时操作,但是启动应用之后还是会闪现一下白色背景,然后才进入Splash页面,对比了一下QQ.微信.微博等客户端,点击 ...

  7. android开发之提高应用启动速度_splash页面瞬间响应_避免APP启动闪白屏

    Application和Activity中的onCreate都进行了优化,基本没有耗时操作,但是启动应用之后还是会闪现一下白色背景,然后才进入Splash页面,对比了一下QQ.微信.微博等客户端,点击 ...

  8. Android------第一次启动出现白屏或者黑屏

    APP开发中,第一次运行启动app时,会出现一会儿的黑屏或者白屏才进入Activity的界面显示. 当打开一个Activity时,如果这个Activity所属Application还没有在运行, 系统 ...

  9. Android app启动出现白屏闪屏

    出现白屏闪屏原因: 进入到AppStartActivity,但是未加载到布局文件,就先显示了窗口的背景,白屏就是显示的windows的背景,即所设置的theme. onCreate()中的setCon ...

随机推荐

  1. idea在debugger模式下无法启动,但是在run模式下可以启动的问题

    debugger模式下,启动idea,总是报内存溢出异常, Error creating bean with name 'sysRoleUserMapper' defined in URL [jar: ...

  2. require.js模块化

    require.js简单来说就是把js代码分装模块化了 模块化 模块就是实现特定功能的一组方法.只要把不同的函数(以及记录状态的变量)简单地放在一起,就算是一个模块. 我拿一个运动框架来解释一下req ...

  3. HDU-4763 Theme Section KMP

    题意:求最长的子串E,使母串满足EAEBE的形式,A.B可以任意,并且不能重叠. 题目链接:http://acm.split.hdu.edu.cn/showproblem.php?pid=4763 思 ...

  4. canvas画布如何画图案例

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  5. 高速上手C++11 14 笔记1

    1 constexpr constexpr关键字可以让已经具备常量返回的函数运用于常量的位置. c++14起可以在函数内部使用局部变量.循环和分支等简单语句. 2 委托构造&继承构造 委托构造 ...

  6. GitHub学习途径

    之前学习GitHub的一个pdf文件 作者是stormzhang 我觉得那个pdf教的很详细,我还没看完,正在学习中,学到了文件的clon和在本机如何更新GitHub的文件. 在此分享一下 下载链接h ...

  7. C#中get和set属性的作用

    c#在定义类时,通常要把类中声明的对象封装起来,使得外界不能访问这个属性.上述代码中如果去掉set部分,则外界只能读取name的值,如果去掉get部分,则只能给name赋值.这样就可以控制外界对私有属 ...

  8. (PMP)解题技巧和典型题目分析(每日20题)

    3.11 1.A(C),2.D,3.A,4.B,5.A(C),6.D(A),7.D,8.A(D),9.B,10.D(B), 11.C(B),12.C(D),13.B,14.D,15.C,16.C(D) ...

  9. git使用之后悔药

    1.工作区的代码想撤销 背景:有时候编写了一大段代码之后,想要撤销更改(执行add操作之前), 命令:git checkout -- <file路径> 使用git checkout -- ...

  10. Vue.js环境配置

    一.安装node.js 自行下载安装 https://nodejs.org/en/ 二.查看版本,更新版本 查看node版本 node --version 查看npm版本 npm --version ...