Custom Splash Screen on Android - Why You're Doing It Wrong - pl-coding.com
对应的视频
https://www.youtube.com/watch?v=eFZmMSm1G1c
国内大部分应用都有闪屏,如果到12上没有处理的话,会出现两个闪屏的结果
因为12默认会有一个闪屏
官方给出了迁移建议
https://developer.android.com/develop/ui/views/launch/splash-screen/migrate?hl=zh-cn
郭林的这篇文章也写的非常详细
Android 12 SplashScreen API快速入门
添加依赖
使用官方的库可以兼容之前的设备,开屏有一样的表现
implementation("androidx.core:core-splashscreen:1.0.1")
定义主题
theme.xml
XML
<style name="Theme.App.Starting" parent="Theme.SplashScreen">
<item name="windowSplashScreenBackground">@color/black</item>
<item name="postSplashScreenTheme">@style/Theme.AnimatedSplashScreen</item>
</style>
theme.xml 31
XML
<style name="Theme.App.Starting" parent="Theme.SplashScreen">
<item name="windowSplashScreenBackground">@color/black</item>
<item name="postSplashScreenTheme">@style/Theme.AnimatedSplashScreen</item>
<item name="android:windowSplashScreenAnimatedIcon">@drawable/animated_logo</item>
</style>
31多了动画定义
animated_logo.xml
XML
<?xml version="1.0" encoding="utf-8"?>
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/logo">
<target
android:animation="@animator/logo_animator"
android:name="animationGroup" />
</animated-vector>
其中 logo 定义图标,logo_animator定义动画了对logo中 animationgroup进行一些动画操作
logo.xml
XML
<vector android:height="50dp" android:viewportHeight="3500"
android:viewportWidth="3500" android:width="50dp" xmlns:android="http://schemas.android.com/apk/res/android">
<group
android:name="animationGroup"
android:pivotX="1750"
android:pivotY="1750">
<path android:fillColor="#00f15e"
android:pathData="m1843.9,1192.1l-274.6,444.5c-5.2,8.5 -14.5,13.6 -24.5,13.6h-721.7c-6.3,0 -12.4,-2.1 -17.4,-5.9l-249,-189.3c-3.5,-2.7 -6.3,-6.1 -8.3,-10L3,354.4c-7.1,-14.2 -1.4,-31.5 12.9,-38.6 4,-2 8.4,-3 12.9,-3h1372.9c10.9,0 20.8,6.2 25.7,15.9l417.8,835.5c4.5,8.9 4,19.5 -1.3,28Z" android:strokeWidth="0"/>
<path android:fillColor="#00f15e"
android:pathData="m2056.1,1913.7l-628.7,1257.4c-4.9,9.7 -14.8,15.9 -25.7,15.9H28.8c-15.9,0 -28.7,-12.9 -28.7,-28.7 0,-4.5 1,-8.9 3,-12.9l534.2,-1068.1c2,-3.9 4.8,-7.3 8.3,-10l249,-189.3c5,-3.8 11.1,-5.9 17.4,-5.9h1218.4c15.9,0 28.7,12.9 28.7,28.8 0,4.4 -1,8.8 -3,12.8Z" android:strokeWidth="0"/>
<path android:fillColor="#00f15e"
android:pathData="m3485.2,1190l-602.1,454.5c-5,3.8 -11.1,5.8 -17.3,5.8h-511.3c-10.9,0 -20.8,-6.2 -25.7,-15.9L1688.8,354.3c-7.1,-14.2 -1.3,-31.5 12.9,-38.6 4,-2 8.4,-3 12.8,-3h1020.8c5.2,0 10.3,1.4 14.8,4.1l616,368.3c6.5,3.9 11.2,10.2 13.1,17.6l116.6,457.3c2.9,11.2 -1.3,23.1 -10.6,30Z" android:strokeWidth="0"/>
<path android:fillColor="#00f15e"
android:pathData="m3471.1,3187.2c16.1,0 29.4,-13.3 28.9,-29.4 -15.5,-444.4 -380.7,-800 -828.9,-800s-813.4,355.5 -828.8,800c-0.6,16.1 12.8,29.4 28.9,29.4l1599.9,-0.1Z" android:strokeWidth="0"/>
</group>
</vector>
XML
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1000"
android:interpolator="@anim/overshoot_interpolator">
<propertyValuesHolder
android:propertyName="rotation"
android:valueType="floatType"
android:valueFrom="0.0"
android:valueTo="360.0" />
<propertyValuesHolder
android:propertyName="scaleX"
android:valueType="floatType"
android:valueFrom="0.0"
android:valueTo="0.4" />
<propertyValuesHolder
android:propertyName="scaleY"
android:valueType="floatType"
android:valueFrom="0.0"
android:valueTo="0.4" />
</objectAnimator>
应用主题
XML
android:theme="@style/Theme.App.Starting"
这样当应用启动后,不需要添加额外的界面,就可以有一个logo的动画闪屏
但是动画结束,如果我们想延长呢可以加setKeepOnScreenCondition
Kotlin
class MainActivity : ComponentActivity() {
private val viewModel by viewModels<MainViewModel>()
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
installSplashScreen().apply {
setKeepOnScreenCondition {
!viewModel.isReady.value
}
setOnExitAnimationListener { screen ->
val zoomX = ObjectAnimator.ofFloat(
screen.iconView,
View.SCALE_X,
0.4f,
0.0f
)
zoomX.interpolator = OvershootInterpolator()
zoomX.duration = 500L
zoomX.doOnEnd { screen.remove() }
val zoomY = ObjectAnimator.ofFloat(
screen.iconView,
View.SCALE_Y,
0.4f,
0.0f
)
zoomY.interpolator = OvershootInterpolator()
zoomY.duration = 500L
zoomY.doOnEnd { screen.remove() }
zoomX.start()
zoomY.start()
}
}
setContent {
AnimatedSplashScreenTheme {
// A surface container using the 'background' color from the theme
Surface(
modifier = Modifier.fillMaxSize(),
color = MaterialTheme.colorScheme.background
) {
Greeting("Android")
}
}
}
}
}
但是基本上。。老板不会满意这么简单的动画
以前做的比较多的是,使用Lottie的库,可以有一些非常流畅绚丽的动画效果。
那如果自己做闪屏的话,就需要再12上除去默认的闪屏
很不幸,在Android 12设备上,您不能通过他们提供的API直接禁用默认的启动画面。如果您的应用程序具有自定义启动画面,并且您不想迁移到这种新方法,则可以尝试以下黑客技巧。基本上,您需要在res\values-v31\themes.xml
中覆盖您的启动屏幕主题并设置一个透明的图标。
<!-- My custom theme for splash screen activity -->
<style name="Theme.Splash" parent="Theme.Main">
<item name="android:windowBackground">@color/background</item>
<!-- Set a transparent .png as your icon -->
<item name="android:windowSplashScreenAnimatedIcon">@drawable/transparent_image</item>
</style>
这将帮助你消除app在启动时闪屏期间出现的默认应用程序图标。
that's it