如何在 jetpack compose 中插入矢量动画或矢量 gif 图像？

【问题标题】：How to insert vector animated or vector gif images in jetpack compose?如何在 jetpack compose 中插入矢量动画或矢量 gif 图像？
【发布时间】：2021-08-25 19:23:33
【问题描述】：

我尝试过使用普通的图像代码。

Column(modifier= Modifier.fillMaxSize().padding(5.dp),horizontalAlignment=Alignment.Centerhorizontally
){ 
Image(
    ImageBitmap.imageResource(id=R.drawable.anim), 
    contentDescription="")    
 }

【问题讨论】：

标签： android-jetpack-compose

【解决方案1】：

最近有很多 API 变化，一些动画方法被移除，AnimateImageVector 不是稳定版本为了能够拥有动画矢量，您需要导入动画图形撰写模块至少1.1.0-alpha01

这是依赖

implementation 'androidx.compose.animation:animation-graphics:1.1.0-alpha02'

然后使用animatedVectorResource

例子：

@OptIn(ExperimentalAnimationGraphicsApi::class)
@Composable
fun AnimatedImage(){
  val image = animatedVectorResource(drawableId)
  var atEnd by remember { mutableStateOf(false) }
  Image(
    painter = image.painterFor(atEnd),
    contentDescription = "Your content description",
    modifier = Modifier.size(64.dp).clickable {
      atEnd = !atEnd
    }
  )
}

【讨论】：