我可以在可组合项中剪出路径吗

Ric*_*per 3 layout android canvas clip android-jetpack-compose

我们可以Path使用此处绘制 s Canvas,但我想知道是否可以绘制一个不规则的闭合环,然后将背景应用到环的内部。例如,可以只有一个框,填充到屏幕上,具有白色背景,然后我绘制一个形状(本质上是一个循环)。现在我怎样才能仅将红色背景应用于循环捕获的区域?可组合项本质上似乎是直的,所以这似乎是不可能的。

Phi*_*hov 5

看起来您正在寻找以不同风格绘制路径。

使用相同的Path,您可以填充和描边它:

Canvas(modifier = Modifier
    .fillMaxWidth()
    .aspectRatio(1f)
    .padding(30.dp)
) {
    val path = Path().apply {
        addOval(Rect(Offset.Zero, size))
    }
    drawPath(path = path, color = Color.Yellow, style = Fill)
    drawPath(path = path, color = Color.Blue, style = Stroke(width = 15f))
}
Run Code Online (Sandbox Code Playgroud)


如果您需要Path从 SVG 数据创建一个并缩放它,您可以使用 android Path,因为 compose one 似乎还不支持转换:

Canvas(modifier = Modifier
    .fillMaxWidth()
    .aspectRatio(1f)
    .padding(30.dp)
) {
    val path = PathParser.createPathFromPathData("M20.8221,3.25C18.5096,1.2375 15.5096,0 12.1971,0C6.9971,0 2.5221,3.025 0.3971,7.4125C-0.0029,8.25 0.4471,9.25 1.3346,9.55C2.0721,9.8 2.8721,9.45 3.2096,8.75C4.8346,5.425 8.2471,3.125 12.1971,3.125C14.6346,3.125 16.8596,4.025 18.5971,5.475L16.2096,7.8625C15.4221,8.65 15.9721,10 17.0846,10H24.0721C24.7596,10 25.3221,9.4375 25.3221,8.75V1.7625C25.3221,0.65 23.9721,0.0875 23.1846,0.875L20.8221,3.25Z")
    val rectF = RectF()
    path.computeBounds(rectF, true)
    val matrix = Matrix()
    val scale = minOf( size.width / rectF.width(), size.height / rectF.height() )
    matrix.setScale(scale, scale)
    path.transform(matrix)
    val composePath = path.asComposePath()
    drawPath(path = composePath, color = Color.Yellow, style = Fill)
    drawPath(path = composePath, color = Color.Blue, style = Stroke(width = 15f))
}
Run Code Online (Sandbox Code Playgroud)