Android Studio Jetpack compose - animateDp -动画在假情况下不显示

我试图建立一个对话框底表，我需要显示一个底表一样的东西在所有的组合与滑动上下，为了显示以上所有元素，我将其 Package 到一个对话框中，并使用更新转换来转换屏幕底部显示的对话框内的卡的高度。可见性由布尔值处理值。问题是，当可见性为真时，动画会显示。但当可见性为假时，它会淡出，而不是显示向下滑动的动画。

@OptIn(ExperimentalComposeUiApi::class)
@Composable
fun DialogBottomSheets(
    isVisible: Boolean,
    onDismiss: () -> Unit,
    content: @Composable () -> Unit,
    modifier: Modifier = Modifier
) {
    val mutableInteractionSource = MutableInteractionSource()

    var visibility by remember(isVisible) {
        mutableStateOf(isVisible)
    }

    val transition = updateTransition(visibility, label = "Translation")
    val screenHeight = rememberWindowInfo().screenHeight

    val translateY by transition.animateDp(
        transitionSpec = {
            tween(200)
        }, label = "TranslationY to card"
    ) { isVisible ->
        if (isVisible) 0.dp else screenHeight
    }

    AnimatedVisibility(
        visible = visibility,
        enter = fadeIn(
            animationSpec = keyframes {
                this.durationMillis = 200
            }
        ),
        exit = fadeOut(
            animationSpec = keyframes {
                this.durationMillis = 200
            }
        ),
        modifier = modifier
            .fillMaxSize()
            .zIndex(2f)
    ) {

        Dialog(
            onDismissRequest = { onDismiss() },
            properties = DialogProperties(
                usePlatformDefaultWidth = false,
                ),
        ) {
            Box(
                modifier = Modifier
                    .fillMaxSize()
                    .background(color = Color.Transparent)
                    .clickable(mutableInteractionSource, null) {
                        Log.i("ONCLICK-DialogBottomSheets","Box")
                        onDismiss()
                    }
                ,
                contentAlignment = Alignment.BottomCenter
            ) {
                Card(
                    modifier = Modifier
                        .fillMaxWidth()
                        .wrapContentHeight()
                        .offset(x = 0.dp, y = translateY)
                        .zIndex(2f)
                      /*  .clickable(mutableInteractionSource, null) {
                            // Nothing here to override click above the cards to implement dismiss on click outside behaviour
                        }*/
                    ,
                    backgroundColor = Color.White,
                    shape = RoundedCornerShape(topStart = 24.dp, topEnd = 24.dp)
                ) {
                    content()
                }
            }
        }

    }

}

字符串
编写版本-1.2.0。我不能使用底部工作表从编写，因为这是为项目建立的互操作xml。这里是我的代码。如何显示动画下滑，当可见性出错？

我没有解释为什么它不适用于您当前的方法，但是您是否尝试使用AnimatedVisibility功能而不是animateDp将对话框滑动到屏幕上？您可以使用+操作符将fadeIn动画与幻灯片动画组合在一起，如文档中所述。解决方案可能如下所示，您可能需要以某种方式对其进行调整：

AnimatedVisibility(
    visible = visibility,
    enter = fadeIn(
            animationSpec = keyframes {
                this.durationMillis = 200
            }
        ) + 
        slideInVertically(
            initialOffsetY = {
                it / 2
            }
        ),
    exit = fadeOut(
            animationSpec = keyframes {
                this.durationMillis = 200
            }
        ) + 
        slideOutVertically(
            targetOffsetY = {
                it / 2
            },
        )
    ),
    modifier = modifier
        .fillMaxSize()
        .zIndex(2f)
) {
    // ...
}

字符串
initialOffset的值被设置为定义滑入或滑出应该从哪个方向发生，如this StackOverflow question中所述。

Android Studio Jetpack compose - animateDp -动画在假情况下不显示

1条答案

相关问题

热门标签

最新问答