Android解决APP启动白屏
2021-10-11 本文已影响0人
itfitness
目录
前言
当APP第一次启动会有一段时间的白屏，而当代码变多白屏的时间会更长，这对用户体验来说非常差，因此我们需要进行处理，让用户感觉不到有白屏的那个间隙。
效果对比
下面是我通过对Application的onCreate进行延时操作来模拟白屏
public class MyApplication extends Application {
@Override
public void onCreate() {
super.onCreate();
try {
Thread.sleep(3000);
}catch (Exception e){}
}
}
下面是我通过处理解决白屏后的效果的对比
实现步骤
1.增加欢迎页
增加一个欢迎页（SplashActivity）
public class SplashActivity extends AppCompatActivity {
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
}
}
2.给欢迎页设置样式
我们给SplashActivity设置单独的样式，我们重点是加了背景和设置状态栏背景为白色状态栏文字为黑色（因为演示的SplashActivity背景为白色所以设置状态栏为白色比较好），并且用了没有ActionBar的样式
<style name="Theme.WhitePageDemoSplash" parent="Theme.MaterialComponents.DayNight.NoActionBar">
<!-- Primary brand color. -->
<item name="colorPrimary">@color/purple_500</item>
<item name="colorPrimaryVariant">@color/purple_700</item>
<item name="colorOnPrimary">@color/white</item>
<!-- Secondary brand color. -->
<item name="colorSecondary">@color/teal_200</item>
<item name="colorSecondaryVariant">@color/teal_700</item>
<item name="colorOnSecondary">@color/black</item>
<!-- 这三行是重点 -->
<!-- 设置背景，解决白屏的关键 -->
<item name="android:windowBackground">@drawable/bg_splash</item>
<!-- 设置状态栏为白色的，状态栏文字为黑的 -->
<item name="android:statusBarColor" tools:targetApi="l">@color/white</item>
<item name="android:windowLightStatusBar" tools:targetApi="m">true</item>
</style>
AndroidManifest.xml中设置上
<application
android:allowBackup="true"
android:name=".MyApplication"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/Theme.WhitePageDemo">
<activity android:name=".SplashActivity" android:theme="@style/Theme.WhitePageDemoSplash">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name=".MainActivity" android:launchMode="singleTask" android:screenOrientation="portrait"/>
</application>
3.给样式设置背景
接下来是编写背景的xml文件，我设置背景为白色，这也是与SplashActivity对应起来，然后加了一张全屏缩放的图片，图片的背景透明
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="@color/white" />
</shape>
</item>
<item>
<bitmap
android:gravity="fill"
android:src="@drawable/splashlog" />
</item>
</layer-list>
4.调整欢迎页布局
欢迎页的布局我们也用这张图片，也是占满整个布局并缩放，并且加了一个显示”跳过“的TextView
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@color/white"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:src="@drawable/splashlog"
android:scaleType="fitXY"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<TextView
android:text="跳过"
android:textSize="18sp"
android:textColor="@color/black"
android:layout_gravity="right"
android:layout_marginTop="40dp"
android:layout_marginRight="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</FrameLayout>
接下来我们看效果
我们发现页面会向下移动一下，那是因为当SplashActivity的布局加载出来的时候，会有一块状态栏高度的下移，并且如果有虚拟键盘的话也会影响整个视觉效果的过渡，接下来我们只需要把SpalshActivity的布局调整为全屏即可
5.让欢迎页充满全屏
这里给大家介绍个工具库(https://github.com/Blankj/AndroidUtilCode)，非常好用
//工具类
implementation 'com.blankj:utilcodex:1.30.6'
具体操作如下：
public class SplashActivity extends AppCompatActivity {
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
//设置下布局向上移动状态栏的高度
BarUtils.setStatusBarColor(this, ColorUtils.getColor(R.color.white));
//设置隐藏虚拟按键
BarUtils.setNavBarVisibility(this,false);
}
}
最后效果如下，可以看到是非常平滑的过渡
