Ảnh vectơ động trong Compose

Bạn có thể tạo hiệu ứng cho vectơ trong Compose theo một số cách. Bạn có thể sử dụng bất kỳ thông tin nào sau đây:

  • Định dạng tệp AnimatedVectorDrawable
  • ImageVector bằng API Ảnh động của Compose, chẳng hạn như trong bài viết này trên Medium
  • Một giải pháp của bên thứ ba như Lottie

Vectơ ảnh động có thể vẽ (thử nghiệm)

Đồng hồ cát tạo ảnh động cho nội dung và xoay
Hình 1. Vectơ ảnh động có thể vẽ trong Compose

Để dùng tài nguyên AnimatedVectorDrawable, hãy tải tệp có thể vẽ lên bằng animatedVectorResource và truyền vào boolean để chuyển đổi giữa trạng thái bắt đầu và kết thúc của đối tượng có thể vẽ, thực hiện ảnh động.

@Composable
fun AnimatedVectorDrawable() {
    val image = AnimatedImageVector.animatedVectorResource(R.drawable.ic_hourglass_animated)
    var atEnd by remember { mutableStateOf(false) }
    Image(
        painter = rememberAnimatedVectorPainter(image, atEnd),
        contentDescription = "Timer",
        modifier = Modifier.clickable {
            atEnd = !atEnd
        },
        contentScale = ContentScale.Crop
    )
}

Để biết thêm thông tin chi tiết về định dạng của tệp có thể vẽ được, vui lòng xem nội dung Tạo ảnh động cho đồ hoạ có thể vẽ được.