Android Jetpack Compose如何将MP4视频作为动画展示？

方案一：使用ExoPlayer（推荐，功能完整） #

ExoPlayer是Android官方推荐的多媒体播放库，对Compose有良好的支持，适合需要循环播放、资源管理的动画场景。

1. 添加依赖
   在build.gradle（Module级别）中引入ExoPlayer的Compose相关依赖：

dependencies {
    implementation "androidx.media3:media3-exoplayer:1.2.1"
    implementation "androidx.media3:media3-ui:1.2.1"
    implementation "androidx.media3:media3-exoplayer-compose:1.2.1"
}

2. Compose组件实现
   创建可复用的MP4动画播放组件，自动循环播放并管理资源：

import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.Composable
import androidx.compose.runtime.DisposableEffect
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalContext
import androidx.media3.common.MediaItem
import androidx.media3.exoplayer.ExoPlayer
import androidx.media3.ui.PlayerView

@Composable
fun Mp4LoopAnimation(mp4ResId: Int) {
    val context = LocalContext.current
    val exoPlayer = remember {
        ExoPlayer.Builder(context).build().apply {
            // 设置本地资源Uri
            setMediaItem(MediaItem.fromUri("android.resource://${context.packageName}/${mp4ResId}"))
            repeatMode = ExoPlayer.REPEAT_MODE_ONE // 单视频循环
            playWhenReady = true // 进入页面自动播放
            prepare()
        }
    }

    // 组件销毁时释放播放器资源，避免内存泄漏
    DisposableEffect(exoPlayer) {
        onDispose {
            exoPlayer.release()
        }
    }

    PlayerView(
        context = context,
        player = exoPlayer,
        modifier = Modifier.fillMaxSize()
    ).apply {
        useController = false // 隐藏播放控制栏，仅展示动画
    }
}

方案二：封装VideoView到Compose（轻量备选） #

如果不需要ExoPlayer的复杂功能，可直接将原生VideoView封装为Compose组件，适合简单的循环动画展示：

import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.viewinterop.AndroidView
import android.net.Uri
import android.widget.VideoView

@Composable
fun SimpleMp4Animation(mp4ResId: Int) {
    val context = LocalContext.current
    AndroidView(
        factory = {
            VideoView(it).apply {
                setVideoURI(Uri.parse("android.resource://${context.packageName}/${mp4ResId}"))
                setOnPreparedListener { mediaPlayer ->
                    mediaPlayer.isLooping = true
                    start()
                }
            }
        },
        modifier = Modifier.fillMaxSize()
    )
}

方案三：转换MP4为Drawable（适合小型动画） #

如果你的MP4是无声音、短时长的循环动画，也可以将其转换为Animated WebP或Animated Vector Drawable，这样更贴合Compose中Drawable的使用逻辑：

• 用工具（如FFmpeg、在线转换工具）将MP4转为WebP
• 在Compose中直接用Image组件加载：

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource

@Composable
fun WebpAnimation() {
    Image(
        painter = painterResource(id = R.drawable.animated_mp4_converted),
        contentDescription = null,
        modifier = Modifier.fillMaxSize()
    )
}

内容的提问来源于stack exchange，提问作者Jonathan Goris