按钮在单击时没有涟漪效应（Jetpack Compose）答案

【问题标题】：Button doesn't have ripple effect on clicking (Jetpack Compose)按钮在单击时没有涟漪效应（Jetpack Compose）
【发布时间】：2021-09-05 01:02:27
【问题描述】：

AFAIK，默认情况下，使用 Jetpack compose 创建的按钮应在单击时产生连锁反应。但是我的按钮在点击时没有显示涟漪效应。下面是我的按钮的代码：

 BoxWithConstraints(modifier = Modifier
                .constrainAs(button) {
                    top.linkTo(glTopButtonProceed)
                    start.linkTo(glLeftBtn)
                    end.linkTo(glRightBtn)
                    width = Dimension.fillToConstraints

                }) {

                Button(
                    onClick = {
                        navController.navigate("autosave_screen")
                    },
                    modifier = Modifier
                        .fillMaxWidth()
                        .height(if (screenHeight>=700.dp)
                            50.dp
                        else
                            with(LocalDensity.current) {dimensionResource(id = R.dimen._35sdp)}) ,



                    colors = if (text.text != "" && text.text.length == 4)
                        ButtonDefaults.buttonColors(backgroundColor = colorResource(id = R.color.bright_green))
                    else
                        ButtonDefaults.buttonColors(backgroundColor = colorResource(id = R.color.gray))

                ) {
                    Text(
                        "Proceed", color = colorResource(id = R.color.dark_blue),
                        fontSize =
                        if (screenHeight>=700.dp)
                            19.sp
                        else
                            with(LocalDensity.current) {dimensionResource(id = R.dimen._12sdp).toSp()},
                        fontFamily = FontFamily(Font(R.font.poppins_medium)),

                        textAlign = TextAlign.Center,
                        modifier = Modifier.align(Alignment.CenterVertically)
                    )

                }

            }
        }

如何为我的按钮启用波纹效果？

【问题讨论】：

看到我几乎可以肯定这是因为您设置的自定义背景。内置波纹可能无法推断出它应该产生的颜色。
启用=false时是否会发生？
按钮背景为灰色时出现波纹效果，亮绿色时不出现。我认为 MARSK 你是对的。
Gabriele，在启用为真和假时，亮绿色背景都不会出现波纹。
@SparshDutta 这很奇怪。当背景为灰色时，应禁用该按钮。

标签： android android-button android-jetpack-compose ripple-effect

【解决方案1】：

你可以尝试使用点击修饰符点击而不是调用onClick on Button

modifier = Modifier .clickable(
 interactionSource = remember { MutableInteractionSource() },
    indication = rememberRipple(bounded = false),
    onClick = {}
        )

您也可以自定义按钮波纹。

【讨论】：

可点击修饰符在按钮中不起作用。

【解决方案2】：

用 Material Theme 包裹你的盒子以获得漂亮的涟漪效果

【讨论】：

【解决方案3】：

如果您想为按钮赋予特定颜色，请尝试在Text Composable 上改用Modifier.fillMaxSize().background(...)。不要使用Button 的colors 参数。

【讨论】：

没用。 2个问题： 1. Text composable inside button没有覆盖整个按钮，Text composable in button周围还有一些粗边框。 2. 涟漪效应只发生在周围的粗边框中