首页 > 解决方案 > 如何在 Jetpack Compose 中有虚线边框?

问题描述

我可以使用以下方法轻松创建普通边框,Modifier.border()但如何创建虚线边框,如下图所示。

在此处输入图像描述

标签: androidborderandroid-jetpack-compose

解决方案


1.0.x没有内置的Modifier.border()破折号路径。

但是,您可以PathEffect.dashPathEffectCanvas.
就像是:

val stroke = Stroke(width = 2f,
    pathEffect = PathEffect.dashPathEffect(floatArrayOf(10f, 10f), 0f)
)

Box(Modifier.size(250.dp,60.dp),contentAlignment = Alignment.Center){
    Canvas(modifier = Modifier.fillMaxSize()) {
        drawRoundRect(color = Color.Red,style = stroke)
    }
    Text(
        textAlign = TextAlign.Center,text = "Tap here to introduce yourseft")
}

在此处输入图像描述


推荐阅读