为什么我不能在jetpack compose中使用Modifier.sharedBounds

Question

我按照官方教程尝试在我的项目中添加动画。但是当我将代码

Modifier.sharedBounds(rememberSharedContentState(key = "bounds")...

复制并粘贴到我的 Android Studio 时，我收到了

Unresolved reference: sharedBounds

错误。

我在我的项目中添加了动画依赖项（版本1.7.0-rc01），这是我的所有依赖项

dependencies {

    implementation(libs.androidx.core.ktx)
    implementation(libs.androidx.lifecycle.runtime.ktx)
    implementation(libs.androidx.activity.compose)
    implementation(platform(libs.androidx.compose.bom))
    implementation(libs.androidx.ui)
    implementation(libs.androidx.ui.graphics)
    implementation(libs.androidx.ui.tooling.preview)
    implementation(libs.androidx.material3)
    implementation(libs.androidx.navigation.runtime.ktx)
    implementation(libs.androidx.navigation.compose)
    testImplementation(libs.junit)
    androidTestImplementation(libs.androidx.junit)
    androidTestImplementation(libs.androidx.espresso.core)
    androidTestImplementation(platform(libs.androidx.compose.bom))
    androidTestImplementation(libs.androidx.ui.test.junit4)
    debugImplementation(libs.androidx.ui.tooling)
    debugImplementation(libs.androidx.ui.test.manifest)
    implementation(libs.vico.compose.m3)
    implementation(libs.vico.views)
    implementation(libs.kotlinx.coroutines.android)
    implementation(libs.androidx.animation)
}

我想知道我是否缺少一些必要的依赖项

Answer 1

它是

SharedTransitionScope

的作用域修饰符，您只能在定义的作用域内调用作用域修饰符。你需要使用

SharedTransitionLayout

或

SharedTransitionScope

可组合项

SharedTransitionLayout {
    val sharedTransitionState = rememberSharedContentState("")

    AnimatedContent(
        targetState = visible
    ) { target ->

        Modifier.sharedBounds(
            sharedContentState = sharedTransitionState,
            animatedVisibilityScope = this@AnimatedContent
        )
    }
}

SharedTransitionScope {
    AnimatedVisibility(
        visible = visible
    ) {

        val sharedTransitionState = rememberSharedContentState("")

        Modifier.sharedBounds(
            sharedContentState = sharedTransitionState,
            animatedVisibilityScope = this@AnimatedVisibility
        )
    }
}

或直接传递

TransitionScope

作为，在 TransitionScope 修饰符下面的示例中。

@Composable
private fun MainContent(
    onShowDetails: () -> Unit,
    modifier: Modifier = Modifier,
    sharedTransitionScope: SharedTransitionScope,
    animatedVisibilityScope: AnimatedVisibilityScope
) {
    with(sharedTransitionScope) {
        Row(
            modifier = Modifier
                .padding(8.dp)
                .sharedBounds(
                    rememberSharedContentState(key = "bounds"),
                    animatedVisibilityScope = animatedVisibilityScope,
                    enter = fadeIn(),
                    exit = fadeOut(),
                    resizeMode = SharedTransitionScope.ResizeMode.ScaleToBounds()
                )
                // ...
        ) {
            // ...
        }
    }
}

https://developer.android.com/develop/ui/compose/animation/shared-elements