启动页白屏一段时间
网上搜到的资料讲启动页时,常常都是从App启动时白屏或黑屏一段时间开始讲。 白屏原因为App在启动Application,再到定位到启动页,并为启动页面setContentView过程中,需要耗时,这段时间内App显示为白屏。
网上见到说法,黑屏是由于在Manifest中设置了Application的theme为dark模式,模拟器测试后并未出现黑屏现象,仍显示为白屏。
另一说法是在低版本的手机上会出现黑屏,该说法未经测试。
为解决该问题,可以为启动页设置一个theme,并为该主题设置一个background,在Application启动过程中,页面将直接显示theme所设置的背景。
在manifest.xml和styles.xml中设置如下。
<activity android:name=".ui.activity.SplashActivity"
android:theme="@style/Splash">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<style name="Splash" parent="@style/Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowFullscreen">true</item>
<item name="android:windowBackground">@drawable/splash</item>
</style>
drawable中使用layer-list排列所需图片。
layer-list的没有布局功能,开屏页还是尽可能简单为上。解压了淘宝的Apk包,淘宝开屏页一共是2张图,代码如下:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!--整体背景颜色-->
<item
android:drawable="@android:color/white"
android:gravity="fill" />
<!--图片在屏幕中心显示后再向上偏移72dp-->
<item android:bottom="72dp">
<!--屏幕中心显示-->
<bitmap
android:gravity="center"
android:src="@mipmap/taobao_launch_center" />
</item>
<!--底部淘宝logo-->
<item android:bottom="24dp">
<bitmap
android:gravity="bottom|center"
android:src="@mipmap/taobao_launch_logo" />
</item>
</layer-list>
这里建议让UI将所需的图片裁剪成几个元素放上去,并尽可能简洁,毕竟layer-list的排列和图片显示并不是很愉快,特别是图片尺寸不合适情况下的拉伸、裁剪更是麻烦。
在实际测试过程中,上述代码只解决了全屏(无导航栏)和普通导航栏的情况,还有一种为虚拟导航栏。在这种情况下,半透明的导航栏会遮挡部分底部logo。一种方法可以简单的把logo的bottom值调大,当然这样大概率就不符合UI的设计了。另外可以在style中增加一行:
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
将windowDrawsSystemBarBackgrounds设为false的意思是指在绘制内容窗口时,不延伸到状态栏和导航栏区域。
启动页动画或广告
启动页动画可以参考百度地图。
首先是重设主题,可以在style中新增一个继承自Splash的主题,重设它的背景图片,一般而言保留底部logo,去掉居中的大图,以保证切换主题过程中底部的logo不发生变化。然后在SplashActivity的onCreate方法中setTheme重置主题。
<style name="Splash.logo" parent="Splash">
<item name="android:windowBackground">@drawable/splash_logo</item>
</style>
当日如果logo上方的内容全覆盖了原有的启动页,也可以忽略上一步骤,直接在splash.xml中开始正常的绘制即可。