可组合按钮边框描边看起来很奇怪

Question

我正在尝试实现一个带有黑色容器颜色和白色边框的按钮，但是笔划的边缘也在其上添加了黑色，我不知道为什么。

代码：

@Composable
fun Button(){
        OutlinedButton(
            onClick = { },
            modifier = Modifier.padding(16.dp),
            border = BorderStroke(2.dp, Color.White),
            shape = RoundedCornerShape(50),
            colors = ButtonDefaults.outlinedButtonColors(
                contentColor = Color.White,
                disabledContentColor = Color.Gray,
                containerColor = Color.Black,
                disabledContainerColor = Color.Transparent,
            )
        ) {
            Text(text = "Save")
        }
}

Answer 1

您应该考虑使用简单的

Button

可组合项，因为

OutlinedButton

很可能会无意中在您的设计周围添加该轮廓。另外，请确保添加

cilp

修饰符以确保动画正常工作。

Button(
    onClick = { },
    modifier = Modifier
        .padding(16.dp)
        .clip(RoundedCornerShape(50)),
    border = BorderStroke(2.dp, Color.White),
    shape = RoundedCornerShape(50),
    colors = ButtonDefaults.outlinedButtonColors(
        contentColor = Color.White,
        disabledContentColor = Color.Gray,
        containerColor = Color.Black,
        disabledContainerColor = Color.Transparent,
    )
) {
    Text(text = "Save")
}