android 如何在喷气背包组合中非常缓慢地垂直滑出

v7pvogib  于 2023-03-06  发布在  Android
关注(0)|答案(1)|浏览(89)

我想从我的初始位置垂直滑出到另一个点非常慢。假设我的初始位置是50.dp,那么它会到49.dp48.dp ...... 0.dp。我尝试了一些代码,但直接到0.dp,然后隐藏我不想。你们能帮助我吗?

@OptIn(ExperimentalAnimationApi::class)
@Preview(showBackground = true)
@Composable
fun MoveText() {
    var visible by remember { mutableStateOf(true) }
    var yPosition by remember {
        mutableStateOf(50.dp)
    }
    LaunchedEffect(key1 = visible) {
        yPosition = if (visible) {
            50.dp
        } else {
            0.dp
        }
    }
    ScrollComposeTheme {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(start = 16.dp, top = 16.dp)
        ) {
            AnimatedVisibility(
                visible = visible,
                modifier = Modifier.padding(top = yPosition),
                exit = slideOutVertically(
                    animationSpec = tween(4000),
                )
            ) {
                val color by transition.animateColor(label = "color") { state ->
                    if (state == EnterExitState.Visible) Color.Black else Color.Gray
                }
                Column {
                    Icon(
                        imageVector = Icons.Default.ShoppingCart,
                        tint = color,
                        contentDescription = null,
                    )
                    Text(
                        text = "Hello, Anna",
                        fontSize = 20.sp,
                        color = color,
                    )
                }
            }
            Button(
                modifier = Modifier
                    .absoluteOffset(y = 10.dp),
                onClick = {
                    visible = !visible
                },
            ) {
                Text(text = "Move Text")
            }
        }
    }
}
8xiog9wr

8xiog9wr1#

经过研究,我得到了使用animateDpAsState,这是修复我的问题。我在这里添加一个代码

@Preview(showBackground = true)
@Composable
fun MoveText() {
    var visible by remember { mutableStateOf(true) }
    val iconOffsetAnimation: Dp by animateDpAsState(
        if (visible) 13.dp else 0.dp,
        tween(1000)
    )
    val textOffsetAnimation: Dp by animateDpAsState(
        if (visible) 19.dp else 5.dp,
        tween(1000)
    )
    ScrollComposeTheme {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(start = 16.dp, top = 16.dp)
        ) {
            Column {
                Icon(
                    modifier = Modifier
                        .absoluteOffset(y = iconOffsetAnimation),
                    imageVector = Icons.Default.ShoppingCart,
                    tint = Color.Black,
                    contentDescription = null,
                )
                Text(
                    modifier = Modifier
                        .absoluteOffset(y = textOffsetAnimation),
                    text = "Hello, Anna",
                    fontSize = 20.sp,
                    color = Color.Black,
                )
            }
            Button(
                modifier = Modifier
                    .absoluteOffset(y = 30.dp),
                onClick = {
                    visible = !visible
                },
            ) {
                Text(text = "Move Text")
            }
        }
    }
}

相关问题