Android 冷启动实现APP秒开

2017/2/9 posted in  Android

前言

在阅读这篇文章之前,首先需要理解几个东西:

  • 1、什么是Android的冷启动时间?
    冷启动时间是指用户从手机桌面点击APP的那一刻起到启动页面的Activity调用onCreate()方法之间的这个时间段。
  • 2、在冷启动的时间段内发生了什么?
    首先我们要知道当打开一个Activity的时候发生了什么,在一个Activity打开时,如果该Activity所属的Application还没有启动,那么系统会为这个Activity创建一个进程(每创建一个进程都会调用一次Application,所以Application的onCreate()方法可能会被调用多次),在进程的创建和初始化中,势必会消耗一些时间,在这个时间里,WindowManager会先加载APP里的主题样式里的窗口背景(windowBackground)作为预览元素,然后才去真正的加载布局,如果这个时间过长,而默认的背景又是黑色或者白色,这样会给用户造成一种错觉,这个APP很卡,很不流畅,自然也影响了用户体验。

来看下效果图:

未优化:

20170227548242189443-4a70e91b2e124b48.gif
20170227548242189443-4a70e91b2e124b48.gif

优化方案一:

20170227487382189443-4829eba35492d39b.gif
20170227487382189443-4829eba35492d39b.gif

优化方案二:

20170227662152189443-c861191c8a80cd94.gif
20170227662152189443-c861191c8a80cd94.gif

历史原因

当系统启动一个APP时,zygote进程会首先创建一个新的进程去运行这个APP,但是进程的创建是需要时间的,在创建完成之前,界面是呈现假死状态的,这就很尴尬了,因为用户会以为没有点到APP而再次点击,这极大的降低用户体验,Android需要及时做出反馈去避免这段迷之尴尬。于是系统根据你的manifest文件设置的主题颜色的不同来展示一个白屏或者黑屏。而这个黑(白)屏正式的称呼应该是Preview Window,即预览窗口。

好了,现在我们明白了,Preview Window其实是为了提高用户体验而有意设定的。因此,其实如果不是强迫症,它可能并不是一个问题。

但是我猜大部分小伙伴应该是和我一样的强迫症患者:这么丑的黑屏怎么能出现在我的APP上呢???!!!

所以,下面我们就来聊聊这个问题的解决方案。

解决方案

既然决定解决这个问题,那么从哪里入手呢,Android在选择展示黑屏或者白屏的时候,是根据你设定的主题而不同的,也就是说,虽然你的代码没有被执行,你的配置文件却被提前读取了,用来作为展示Preview Window界面的依据。在用户点击手机桌面APP的时候,看到的黑屏或者白屏其实是界面渲染前的第一帧,如果你看懂了文章头的那2个问题,那么解决这个问题就非常轻松了,无非就是将Theme里的windowBackground设置成我们想要让用户看到的画面就可以了

所以,我们的解决方案的切入口就是整个APP的manifest文件,更确切的说应该是主题配置文件。

方案一 :开历史倒车

这个方案就是禁止加载Preview Window,具体做法如下:

style.xml

将APPTheme设定为启动的Activity的主题,即可禁止Preview Window,当然,也有人通过把preview window设置为全透明,也达成了类似的效果。

结果就是,当你点击APP时,界面会无响应一段时间,然后进入APP。

我个人强烈不推荐这么做,因为Android想方设法提升的用户体验一下子被你打回解放前。

方案二:自定义Preview Window

1、透明启动

将背景颜色设置为透明色,这样当用户点击桌面APP图片的时候,并不会"立即"进入APP,而且在桌面上停留一会,其实这时候APP已经是启动的了,只是我们心机的把Theme里的windowBackground的颜色设置成透明的,强行把锅甩给了手机应用厂商(手机反应太慢了啦,哈哈),其实现在微信也是这样做的,不信你可以试试。
<style name="Appwelcome" parent="android:Theme.Translucent.NoTitleBar.Fullscreen"/>
透明化这种做法需要注意的一点,如果直接把Theme引入Activity,在运行的时候可能会出现如下异常:

java.lang.IllegalStateException: You need to use a Theme.AppCompat theme (or descendant) with this activity.

这个是因为使用了不兼容的Theme,例如我这里的Activity继承了AppCompatActivity,解决方案很简单:

  • 1、让其Activity集成Activity而不要集成兼容性的AppCompatActivity
  • 2、在onCreate()方法里的super.onCreate(savedInstanceState)之前设置我们原来APP的Theme
public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
            setTheme(R.style.AppTheme);
            super.onCreate(savedInstanceState);
    }
}

2、Logo图片启动

将背景图设置成我们APP的Logo图,作为APP启动的引导,现在市面上大部分的APP也是这么做的。

具体方法如下:

style.xlm

<style name="APPTheme" parent="@android:style/Theme.Holo.NoActionBar">
    <item name="android:windowBackground">@drawable/splash_icon</item>
</style>

同样将主题设置到启动的Activity的主题中,windowBackground就是即将展示的preview window。其中splash_icon可以是一整张图片,网上很多小伙伴也都是这么做的。其实它也可以是一个能解析出图片资源的XML文件,好像只有layer-list这种能做得到,因为它能够将多个drawable叠加起来展示。

splash_icon.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:opacity="opaque">
    <item android:drawable="@color/white"/>
    <item>
        <bitmap
            android:gravity="center"
            android:src="@drawable/qq"/>
    </item>
</layer-list>

这样设置之后,当你点击APP,会立马进入你配置的界面,然后启动欢迎页,效果如下

2017022724594838b008fdb18f761ede8.gif
2017022724594838b008fdb18f761ede8.gif

上面的2种做法,我们都需要将Theme引入对应的Activity

<activity
    android:name=".app.main.MainActivity"
    android:theme="@style/AppWelcome"
    android:screenOrientation="portrait">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>

那么,将preview window直接设置为图片和设置为xml文件有什么区别或者优劣呢?我先卖个关子。先谈谈这种方案的优劣,首先这种方案已经解决了原生preview window的单调难看的问题,在原来的基础上进一步提升了用户体验。可是我们的APP都是有欢(guang)迎(gao)页的,从preview window跳转到欢(guang)迎(gao)页是不可避免的,这样的话,两个界面的切换就会显得很突兀的,

所以强迫症的我们,尝试让这两个界面的切换变成一个界面的变化,从而进一步提升显示效果,怎么样才能让两个界面切换看起来像是在同一个界面里的变化呢?答案就是: 动画。

在这种需求下,图片和xml文件的区别就出来了,因为后者可以帮助我们更准确的实现动画。

方案三:自定义Preview Window增强版

废话少说,我们先来看效果

20170227597652f5ba2feffca1ca31a8c.gif
20170227597652f5ba2feffca1ca31a8c.gif

有了动画之后,界面切换顺畅了许多。
上面的动画实现其实非常简单,无非就是放缩,移动,渐变的组合使用(我仅仅用作范例给大家参考),具体的动画代码细节就不谈了,有兴趣可以去github上看本次项目的demo,我们重点来聊一聊思路。

在这里我们需要明确一点的是,preview window 只能是静态图,它本身是不展示动画的,我们这里的动画,其实是在进入欢迎页之后的展示的。明确了这一点之后,整个动画效果的实现思路其实就已经摆在我们眼前了,那就是当界面从 Preview Window 跳转到 欢迎页 的时候,欢迎页必须首先展示一个和 Preview Window 一模一样的界面,让人看起来好像界面还没切换一样,然后再慢慢切换到欢迎页。

然后,我们再来谈谈为什么设置xml的方式可以帮助我们更准确的实现动画,就是因为要保证 Preview Window 和欢迎页最开始展示的界面保持绝对一致,只有通过xml的布局才是达到这种效果。

好了,启动页做到这个份儿上,应该就可以交货了,不过还有一个小问题需要大家注意的,那就是我们给Preview Window设置的背景图如果不做处理,图片就会一直存在于内存中,所以,当我们进入到欢迎页的时候,不要忘了把背景图设置为空:

SplashActivity.java

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    //将window的背景图设置为空
    getWindow().setBackgroundDrawable(null);
    super.onCreate(savedInstanceState);
}

关于启动优化

上面的做法其实可以达到"秒开"APP的效果,不过确不是真实的速度,在Activity创建过程中其实是会经过一系列framework层的操作,在日常开发中,我们都会去重写Application类,然后在Application里进行一些初始化操作,比如存放用户标识的静态化TOKEN,第三方SDK的初始化等。

这里给出几点建议:

  • 1、不要让Application参与业务的操作
  • 2、不要在APPlication进行耗时操作,比如有些开发者会在自己的APP里一系列文件夹或文件(比如我自己),这些I/O操作应该放到"确实该使用的时候再去创建"亦或者是数据库的一些操作。
  • 3、不要以静态变量的方式在Application中保存数据等。

当然这是绝对的理想主义,把上面的"不要"2字之前添上"尽量"2字吧,毕竟在实际开发中,这样做确实会让我们方便许多。

对了,补充一点,布局也是很重要的,尽量的去减少布局的复杂性,布局深度,因为在View绘制的过程中,测量也是很耗费性能的。

总结

到这里,关于Android启动页的相关问题就都讲完了。

最终的高清的效果图:

201702274812409e2d6cccbbdf90fb06f.gif
201702274812409e2d6cccbbdf90fb06f.gif