Ícono animado del splash screen en Android: especificaciones, XML y transición

¿Cuáles son las especificaciones del ícono de la splash screen de Android?

Provienen de la documentación de Google sobre la splash screen y de la referencia de SplashScreen de androidx (Android Developers):

La biblioteca de compatibilidad androidx.core:core-splashscreen lleva la misma splash a dispositivos desde API 23, pero su referencia es explícita: antes de API 31 se replica el comportamiento de la plataforma «con la excepción de la compatibilidad con Animated Vector Drawable» (referencia de androidx). Coloca el drawable animado en res/drawable-v31 y una versión fija en res/drawable.

¿Cómo se configura un ícono animado de splash en XML?

Necesitas tres piezas: el AVD, un tema de inicio y una llamada en tu activity de inicio (launcher). Este es un AVD mínimo que hace aparecer una forma con un rebote (reemplaza el path por los paths vectoriales de tu ícono, dentro de los 288 dp centrales):

<!-- res/drawable-v31/splash_icon.xml -->
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:aapt="http://schemas.android.com/aapt">
  <aapt:attr name="android:drawable">
    <vector android:width="432dp" android:height="432dp"
        android:viewportWidth="432" android:viewportHeight="432">
      <group android:name="icon" android:pivotX="216" android:pivotY="216">
        <path android:fillColor="#FFFFFF"
            android:pathData="M216,136a80,80 0 1,1 0,160a80,80 0 1,1 0,-160z" />
      </group>
    </vector>
  </aapt:attr>
  <target android:name="icon">
    <aapt:attr name="android:animation">
      <set>
        <objectAnimator android:propertyName="scaleX" android:duration="600"
            android:valueFrom="0.6" android:valueTo="1"
            android:interpolator="@android:interpolator/overshoot" />
        <objectAnimator android:propertyName="scaleY" android:duration="600"
            android:valueFrom="0.6" android:valueTo="1"
            android:interpolator="@android:interpolator/overshoot" />
      </set>
    </aapt:attr>
  </target>
</animated-vector>

El tema de inicio, con la biblioteca compat:

<!-- res/values/themes.xml -->
<style name="Theme.App.Starting" parent="Theme.SplashScreen">
  <item name="windowSplashScreenBackground">@color/brand_background</item>
  <item name="windowSplashScreenAnimatedIcon">@drawable/splash_icon</item>
  <item name="windowSplashScreenAnimationDuration">600</item>
  <item name="postSplashScreenTheme">@style/Theme.App</item>
</style>

<!-- res/values-v33/themes.xml: same style, plus -->
<item name="android:windowSplashScreenBehavior">icon_preferred</item>

Define android:theme="@style/Theme.App.Starting" en la application o en la activity de inicio del manifest y luego llama a installSplashScreen() antes de super.onCreate(), como muestra la guía de migración de Google (Android Developers).

icon_preferred existe porque, por defecto en Android 13 y versiones posteriores, el sistema puede mostrar el splash sin el ícono según cómo se haya iniciado la activity. Google recomienda definirlo si nunca quieres un splash vacío y siempre quieres que se muestre el ícono animado.

¿Cómo controlas cuánto dura la animación del ícono de splash?

Hay dos cosas distintas que es fácil confundir: cuánto dura la animación del ícono y cuánto tiempo permanece el splash en pantalla.

• Android 12 (apps que apuntan a API 31 o 32): define windowSplashScreenAnimationDuration para que la animación se reproduzca mientras se muestra la ventana de inicio. Google indica que no es necesario en Android 13, porque la duración se deduce directamente del AnimatedVectorDrawable.
• El atributo nunca alarga el splash. Tanto la guía de Google como la referencia de androidx indican que no influye en cuánto tiempo se muestra el splash; en la biblioteca compat solo alimenta SplashScreenViewProvider.iconAnimationDurationMillis.
• Para mantener el splash visible mientras cargas, usa splashScreen.setKeepOnScreenCondition { !viewModel.isReady }. La condición se evalúa antes de cada dibujado, así que haz que sea liviana.

Respeta la recomendación de 1000 ms para la animación del ícono en sí. Si tu app suele tardar más en iniciar, diseña el AVD para que su estado final pueda quedar en loop o mantenerse en calma, en lugar de estirar un único movimiento. Y si la app está lista en 300 ms, deja ir el splash: nadie abrió tu app para mirarlo.

¿Por qué no puedes poner Lottie, un GIF o una secuencia PNG en el splash?

Porque el sistema dibuja el splash a partir de tu tema como ventana de inicio, antes de que tu activity haya dibujado nada, y el único drawable animado que admite ahí es el XML AnimatedVectorDrawable indicado en windowSplashScreenAnimatedIcon. Un archivo Lottie necesita la biblioteca de Lottie ejecutándose dentro de tu proceso, un GIF necesita un decodificador y una vista, y una secuencia PNG es solo una lista de bitmaps. Ninguno se puede referenciar desde un atributo del tema.

Eso también te dice qué hace bien un AVD y qué no. Anima paths vectoriales, grupos y sus propiedades (rotación, escala, traslación, morphing de paths, alfa). Un logo plano y geométrico se adapta sin problemas. Un personaje detallado, un ícono con muchos degradados o en 3D, o cualquier cosa en mapa de bits, no; forzarlo suele implicar simplificar el arte.

La división práctica: mantén simple el splash del sistema (un ícono fijo o una breve aparición con AVD) y reproduce la animación elaborada dentro de tu app, donde Lottie, Rive y video funcionan. Compara las opciones en Lottie vs Rive vs video para una splash screen.

¿Cómo pasas del splash a una intro completa?

Registra un listener de salida. Una vez definido, el splash ya no se quita automáticamente, y tú llamas a remove() cuando termina tu propia animación de salida (referencia de androidx):

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        val splash = installSplashScreen()
        super.onCreate(savedInstanceState)

        splash.setOnExitAnimationListener { provider ->
            provider.view.animate()
                .alpha(0f)
                .setDuration(200L)
                .withEndAction { provider.remove() }
                .start()
        }
        setContentView(R.layout.activity_intro)  // first screen plays the intro
    }
}

La primera pantalla usa el mismo color de fondo, con el ícono del mismo tamaño y en el mismo centro, así que el fundido revela lo que parece el mismo ícono, que luego inicia su intro completa. Con un archivo de Rive, la vista clásica puede reproducir una máquina de estados (state machine) de inicio directamente desde XML:

<app.rive.runtime.kotlin.RiveAnimationView
    android:id="@+id/intro"
    android:layout_width="240dp"
    android:layout_height="240dp"
    android:layout_gravity="center"
    app:riveResource="@raw/launch"
    app:riveStateMachine="LaunchStateMachine" />

Luego espera lo que dura la intro antes de continuar. Una LaunchStateMachine de Charmotion reproduce una intro de 2.6 segundos una vez, termina en el ícono en reposo y no dispara ningún evento de fin, así que programa el siguiente paso con un temporizador (por ejemplo intro.postDelayed({ showHome() }, 2600)) en lugar de esperar un callback. La documentación de Rive para Android explica la configuración con Rive.init(context) (Rive).

Charmotion no exporta AnimatedVectorDrawable. Sus archivos cubren la parte de este traspaso que ocurre dentro de la app (.riv, WebM con fondo transparente y MOV HEVC, MP4); el AVD del splash del sistema lo dibujas tú en formato vectorial o lo dejas como ícono fijo.

¿Qué falla con más frecuencia en los íconos de splash de Android?

• Arte recortado. El contenido fuera del círculo interior de dos tercios queda enmascarado. Diseña dentro de 288 dp del lienzo de 432 dp para el ícono animado, o de 192 dp de 288 dp para uno estático.
• Un ícono adaptable reutilizado como ícono de splash en versiones antiguas. La referencia de androidx advierte que antes de API 31 un ícono adaptable en windowSplashScreenAnimatedIcon se recorta y escala; recomienda usar la capa frontal y el color de fondo del ícono.
• Esperar animación por debajo de Android 12. La biblioteca compat muestra el ícono fijo. Incluye el drawable animado solo en drawable-v31.
• installSplashScreen() después de super.onCreate() o un postSplashScreenTheme faltante, lo que deja la activity con el tema del splash.
• Una animación que dura más que el inicio. Pasado aproximadamente un segundo, los usuarios notan que están esperando a un logo. Mantén el AVD breve y deja que la intro dentro de la app aporte la personalidad.

Para el panorama multiplataforma, incluido iOS, consulta animación de inicio de app y splash screen.

Cómo agregar un ícono animado a la splash screen de Android

1. Dibuja el AVD. Crea un AnimatedVectorDrawable en un lienzo de 432 dp con el contenido visible dentro de los 288 dp centrales y una animación de no más de unos 1000 ms.
2. Separa por nivel de API. Coloca el drawable animado en res/drawable-v31 y una versión fija en res/drawable para dispositivos más antiguos.
3. Crea el tema de inicio. Extiende Theme.SplashScreen, define windowSplashScreenBackground, windowSplashScreenAnimatedIcon, windowSplashScreenAnimationDuration y postSplashScreenTheme, y agrega icon_preferred en values-v33.
4. Instálalo. Aplica el tema en el manifest y llama a installSplashScreen() antes de super.onCreate().
5. Haz el traspaso. Usa setOnExitAnimationListener para desvanecer el splash y luego reproduce la intro completa en una primera pantalla con el mismo fondo, esperando lo que dura antes de mostrar la app.

Preguntas frecuentes

¿Puedo usar un archivo Lottie como ícono de splash en Android?

No. El ícono de splash viene de un atributo del tema, y su forma animada debe ser un AnimatedVectorDrawable. Lottie necesita su biblioteca ejecutándose en tu app, así que reproduce la animación Lottie en tu primera pantalla, después de que salga el splash, con el mismo color de fondo.

¿windowSplashScreenAnimationDuration mantiene el splash más tiempo en pantalla?

No. La documentación de Google indica que no influye en cuánto tiempo se muestra la splash screen. Le indica a Android 12 cuánto debe durar la animación del ícono. Para mantener el splash mientras tu app carga, usa setKeepOnScreenCondition.

¿La splash screen de Android puede mostrar una imagen de marca?

Sí. Además del ícono centrado, la splash screen puede mostrar una imagen de marca opcional en la parte inferior, de 200×80 dp según la documentación de Google. Mantenla simple, ya que se muestra sobre el mismo color de fondo único y aparece en cada inicio en frío.

¿Qué hace icon_preferred?

En Android 13 y versiones posteriores, android:windowSplashScreenBehavior con el valor icon_preferred le indica al sistema que muestre siempre tu ícono en el splash, en lugar de mostrar a veces un splash vacío según cómo se haya iniciado la activity.

Respuestas rápidas de esta guía

• ¿Cuánto puede durar la animación de un ícono de splash en Android?
• ¿Qué tamaño tiene un ícono animado de splash en Android?
• ¿Funciona un ícono animado de splash en versiones anteriores a Android 12?

Fuentes

• Splash screens, Android Developers
• Migrate your splash screen implementation to Android 12 and later, Android Developers
• SplashScreen (androidx.core:core-splashscreen), Android Developers
• AnimatedVectorDrawable, Android Developers
• Adaptive icons, Android Developers
• Android runtime, Rive