android app启动页(闪屏页)白屏快速优化方案实践

本文分享了一种解决Android App启动时白屏问题的实践方案,通过在styles文件中设置Theme的android:windowBackground属性,将启动页背景与窗口背景统一,从而消除白屏现象。同时讨论了在布局文件中去除背景图片的冗余,以及在启动页含有复杂组件时如何处理。

创建一个启动页界面,布局里设置背景为一张图片,并放一个textview:

class SplashActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_splash)
}
}

<?xml version="1.0" encoding="utf-8"?>

<androidx.c 《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》无偿开源 徽信搜索公众号【编程进阶路】 onstraintlayout.widget.ConstraintLayout
xmlns:android=“http://schemas.android.com/apk/res/android”
xmlns:app=“http://schemas.android.com/apk/res-auto”
xmlns:tools=“http://schemas.android.com/tools”
android:layout_width=“match_parent”
android:layout_height=“match_parent”
android:background=“@drawable/bg_splash_snow”
tools:context=“.activity.SplashActivity”>

<androidx.appcompat.widget.AppCompatTextView
android:layout_width=“wrap_content”
android:layout_height=“wrap_content”
android:layout_marginTop=“100dp”
android:text=“@string/app_name”
android:textColor=“@color/white”
android:textSize=“22sp”
app:layout_constraintLeft_toLeftOf=“parent”
app:layout_constraintRight_toRightOf=“parent”
app:layout_constraintTop_toTopOf=“parent” />

</androidx.constraintlayout.widget.ConstraintLayout>

styles文件里新建一个 style ,parent 设置为 Theme.AppCompat.DayNight.NoActionBar 来取消标题栏:

AndroidManifest.xml里将该style设置给SplashActivity,方便我们后续对比效果:



华为手机上运行效果如下:

5ad43f16d970f580f925f31f65fbd2c.jpg

咦?这顶部状态栏跟底部导航栏也忒丑了点。。。。。。

D415A583C0FF67A7D583065D4701F7BE.jpg

那。。干掉吧。。。

1407C31B0C9096C6B3967DE5631B0B63.gif

在style里设置一下:

运行效果如下:

启动页示例.gif

哦豁 ~~ 处理好顶部状态栏跟底部导航栏后舒服多了,但是,这个白屏问题???

恩,明显的不像话。

7.通过【设置window背景】解决白屏问题

这个贼简单,只需要通过style的android:windowBackground属性给window设置一个背景,最终设置如下:

@drawable/bg_splash_snow 是我的一张背景图:

bg_splash_snow.png

运行效果如下:

启动页示例2.gif

完事儿,收工~

“等等~”,有朋友(无中生友?)怕是要问了:那你这一个界面设置了两个背景图,岂不是有些冗余?

哎呀,那来吧,去掉一张吧,把布局文件的图干掉(tools:background表示只渲染预览布局,不参与实际运行):

image-20210610170155306.png

结果如下:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FmSqNg5m-1651116367259)(https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/0b32cf5a5b4b428c92bba1bc4392748a~tplv-k3u1fbpfcp-watermark.image)]

可以看到,运行结果跟之前跟一模一样。

眼尖的朋友又要问了:“连时间都一样???”

哈哈哈,我就是偷的上一张图。

47915A4C88384FBDB3496D2D7C544FA5.gif

当然了,这里显示的背景图就是window上的背景图,实际上这样是有问题的,比如我启动页要放个viewpager啥的,需要处理图片的一些展示逻辑可咋整,window背景又不能搞成viewpager?

那咱们换一个思路,window的背景图在用完后给他置空,继续显示启动页的布局视图行不行呢?来实践一下看看:

class SplashActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
// 置空window背景图
window.setBackgroundDrawable(null)
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_splash)
}
}

运行效果如下:

启动页示例3.gif

super.onCreate(savedInstanceState)
setContentView(R.layout.activity_splash)
}
}

运行效果如下:

[外链图片转存中…(img-oEIIduIT-1651116367260)]

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值