簡體   English   中英

Jetpack Compose 是否支持“動畫列表”可繪制對象?

[英]Is an "animation-list" drawable supported in Jetpack Compose?

我正在轉換一個布局 android 應用程序來撰寫。 我在使用我的可繪制資源中的“動畫列表”時遇到了一個問題,我猜 Compose 不支持這種格式,至少目前是這樣。

在我看來,編譯器正在為應用程序生成資源,但 Compose 只是不知道如何引用“動畫列表”。

對於下面的內容,可能值得注意的是我使用 colors 作為參考也喜歡

        android:strokeColor="@color/border"

我的 drawable 資源是這樣的,來自 src\main\res\drawable\garage_door_closing_animation.xml

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/garage_door_closing_frame_0" android:duration="200" />
    <item android:drawable="@drawable/garage_door_closing_frame_1" android:duration="200" />
    <item android:drawable="@drawable/garage_door_closing_frame_2" android:duration="200" />
    <item android:drawable="@drawable/garage_door_closing_frame_3" android:duration="200" />
    <item android:drawable="@drawable/garage_door_closing_frame_4" android:duration="200" />
    <item android:drawable="@drawable/garage_door_closing_frame_5" android:duration="200" />
</animation-list>

框架就像這樣 drawable/garage_door_closing_frame_0

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@drawable/garage_door_action_background"
        android:gravity="center" />
    <item
        android:drawable="@drawable/garage_door_closing_arrow_0"
        android:gravity="center" />
</layer-list>

並且引用的兩個項目就像這個 drawable/garage_door_action_background

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="200dp"
    android:height="200dp"
    android:background="@android:color/transparent"
    android:viewportWidth="150"
    android:viewportHeight="150">
    <path
        android:name="base"
        android:fillColor="@color/border"
        android:pathData="M1.046,137.248h147.95v10.091h-147.95z"
        android:strokeWidth="1.2144" />
    <path
        android:name="house_frame"
        android:fillColor="@color/border"
        android:pathData="M15.002,137.24H1.658V34.66L74.647,1.576 148.392,34.408V137.324l-12.333,-0.085v0,-94.425L75.53,16.619 74.32,16.653 15.002,42.815Z"
        android:strokeWidth="1.21061"
        android:strokeColor="@color/border"
        android:strokeLineCap="butt"
        android:strokeLineJoin="miter" />
    <path
        android:name="door_frame"
        android:fillColor="@color/border"
        android:pathData="m30.713,54.916c-0.657,1.202 -0.137,2.713 -0.303,4.042 0,25.895 0,51.789 0,77.683 0.333,1.417 2.134,0.657 3.169,0.848 3.743,-0.041 7.515,0.083 11.24,-0.06 1.213,-0.459 0.479,-2.112 0.68,-3.108 0,-21.921 0,-43.843 0,-65.764 20.031,0 40.063,0 60.094,0 0,22.695 0,45.39 0,68.085 0.333,1.417 2.134,0.657 3.169,0.848 3.743,-0.041 7.515,0.083 11.24,-0.06 1.213,-0.459 0.48,-2.112 0.68,-3.108 0,-26.252 0,-52.503 0,-78.755 -0.332,-1.417 -2.133,-0.657 -3.169,-0.848 -28.752,0 -57.504,0 -86.255,0 -0.182,0.066 -0.363,0.132 -0.545,0.198z"
        android:strokeWidth="0.178596"
        android:strokeColor="@color/border" />
    <path
        android:name="handle"
        android:fillColor="@color/border"
        android:pathData="m74.639,75.938c-5.439,-1.138 -7.655,-7.121 -4.097,-11.059 2.289,-2.534 5.848,-3.205 8.934,-1.686 4.231,2.083 5.19,7.399 1.926,10.681 -1.654,1.663 -4.512,2.536 -6.763,2.064z"
        android:strokeWidth="0.208623" />
    <path
        android:name="open_door"
        android:fillColor="@color/border"
        android:pathData="M45.48,77.399h60.315v59.84h-60.315z" />
</vector>

和 drawable/garage_door_closing_arrow_0

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="200dp"
    android:height="200dp"
    android:background="@android:color/transparent"
    android:viewportWidth="150"
    android:viewportHeight="150">
    <path
        android:fillColor="#00ff00"
        android:pathData="m30.053,9.133 l45.75,38.75 45.75,-38.75h-16l-29.5,24.5 -30.5,-24.5z"
        android:strokeWidth="1"
        android:strokeColor="#ffffff"
        android:strokeLineCap="butt"
        android:strokeLineJoin="miter" />
</vector>

下面是我嘗試加載它的可組合項,它編譯但拋出運行時錯誤

    @Composable
    fun GarageIndicator () {
        val image = AnimatedImageVector.animatedVectorResource(R.drawable.garage_door_closing_animation)

錯誤是

FATAL EXCEPTION: main
Process: com.lusion.sgauto, PID: 17467
android.content.res.Resources$NotFoundException: Resource ID #0x0
at android.content.res.ResourcesImpl.getValue(ResourcesImpl.java:226)
at android.content.res.Resources.getValue(Resources.java:1437)
at androidx.compose.ui.res.VectorResources_androidKt.vectorResource(VectorResources.android.kt:65)
at androidx.compose.animation.graphics.vector.compat.XmlAnimatedVectorParser_androidKt.parseAnimatedImageVector(XmlAnimatedVectorParser.android.kt:74)
at androidx.compose.animation.graphics.res.AnimatedVectorResources_androidKt.loadAnimatedVectorResource(AnimatedVectorResources.android.kt:61)
at androidx.compose.animation.graphics.res.AnimatedVectorResources_androidKt.animatedVectorResource(AnimatedVectorResources.android.kt:48)
at com.lusion.sglibrary.MainActivity.GarageIndicator(MainActivity.kt:1497)
at com.lusion.sglibrary.MainActivity$onResume$1.invoke(MainActivity.kt:349)
at com.lusion.sglibrary.MainActivity$onResume$1.invoke(MainActivity.kt:348)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
at androidx.compose.ui.platform.ComposeView.Content(ComposeView.android.kt:428)
at androidx.compose.ui.platform.AbstractComposeView$ensureCompositionCreated$1.invoke(ComposeView.android.kt:252)
at androidx.compose.ui.platform.AbstractComposeView$ensureCompositionCreated$1.invoke(ComposeView.android.kt:251)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:228)
at androidx.compose.ui.platform.CompositionLocalsKt.ProvideCommonCompositionLocals(CompositionLocals.kt:177)
at androidx.compose.ui.platform.AndroidCompositionLocals_androidKt$ProvideAndroidCompositionLocals$3.invoke(AndroidCompositionLocals.android.kt:123)
at androidx.compose.ui.platform.AndroidCompositionLocals_androidKt$ProvideAndroidCompositionLocals$3.invoke(AndroidCompositionLocals.android.kt:122)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:228)
at androidx.compose.ui.platform.AndroidCompositionLocals_androidKt.ProvideAndroidCompositionLocals(AndroidCompositionLocals.android.kt:114)
at androidx.compose.ui.platform.WrappedComposition$setContent$1$1$3.invoke(Wrapper.android.kt:157)
at androidx.compose.ui.platform.WrappedComposition$setContent$1$1$3.invoke(Wrapper.android.kt:156)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
at androidx.compose.runtime.CompositionLocalKt.CompositionLocalProvider(CompositionLocal.kt:228)
at androidx.compose.ui.platform.WrappedComposition$setContent$1$1.invoke(Wrapper.android.kt:156)
at androidx.compose.ui.platform.WrappedComposition$setContent$1$1.invoke(Wrapper.android.kt:140)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:107)
at androidx.compose.runtime.internal.ComposableLambdaImpl.invoke(ComposableLambda.jvm.kt:34)
at androidx.compose.runtime.ActualJvm_jvmKt.invokeComposable(ActualJvm.jvm.kt:78)
at androidx.compose.runtime.ComposerImpl$doCompose$2$5.invoke(Composer.kt:3314)
at androidx.compose.runtime.ComposerImpl$doCompose$2$5.invoke(Composer.kt:3304)
at androidx.compose.runtime.SnapshotStateKt__DerivedStateKt.observeDerivedStateRecalculations(DerivedState.kt:341)
at androidx.compose.runtime.SnapshotStateKt.observeDerivedStateRecalculations(Unknown Source:1)

最后,就其價值而言,我嘗試利用 gradle 中所有最新的 compose 庫作為

    implementation "androidx.compose.compiler:compiler:1.4.0-alpha02"
    implementation "androidx.compose.animation:animation:1.3.2"
    implementation "androidx.compose.animation:animation-graphics:1.3.2"
    implementation "androidx.compose.foundation:foundation-layout:1.4.0-alpha04"
    implementation "androidx.compose.foundation:foundation:1.4.0-alpha04"
    implementation "androidx.compose.material:material:1.4.0-alpha04"
    implementation "androidx.compose.material3:material3:1.1.0-alpha04"
    implementation "androidx.compose.runtime:runtime:1.4.0-alpha04"
    implementation "androidx.compose.runtime:runtime-livedata:1.4.0-alpha04"
    implementation "androidx.compose.ui:ui:1.4.0-alpha04"
    implementation "androidx.compose.ui:ui-tooling:1.4.0-alpha04"

我希望我可以使用當前的布局資源動畫列表,而不必弄清楚如何將其轉換為“動畫矢量”資源。

build.gradle配置useSupportLibrary屬性:

android {
    compileSdk 31

    defaultConfig {
        applicationId "com.your.package.xxxx"
        minSdk 21
        targetSdk 31
        versionCode 1
        versionName "1.0"

        vectorDrawables {
            useSupportLibrary true
        }
    }
}

展示:

val animationDrawable = AnimationDrawable()
//add your images in animationDrawable by giving information of duration etc like you gave in xml file..
Image(
    painter = rememberDrawablePainter(animationBlast),
    contentDescription = null,
    modifier = Modifier.wrapContentSize(), 
    contentScale = ContentScale.Crop
)

animationDrawable?.start()

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM