Jetpack Compose中Path API的arcTo函数使用问题排查

你的代码存在两个核心问题导致圆弧无法显示：

1. arcTo的Rect参数无效：你设置的Rect(left=100f, top=400f, right=600f, bottom=400f)中top和bottom值完全相同，这是一条无高度的直线，无法形成圆弧所需的圆形边界。
2. 坐标超出Canvas可视范围：Canvas尺寸仅为300dp，但代码中使用了600f这类固定像素值，内容大概率超出绘制区域被裁剪。

以下是修正后的代码，同时优化了坐标适配逻辑（基于Canvas实际尺寸计算，避免固定值的适配问题）：

@Composable
fun MyCanvas() {
    Canvas(modifier = Modifier
        .width(300.dp)
        .height(300.dp)
        .background(Color.LightGray) // 添加背景方便观察边界
    ) {
        // 获取Canvas实际绘制尺寸
        val canvasWidth = size.width
        val canvasHeight = size.height
        
        // 定义矩形与半圆参数：矩形占Canvas的70%宽度、80%高度，居中放置
        val rectWidth = canvasWidth * 0.7f
        val rectHeight = canvasHeight * 0.8f
        val rectLeft = (canvasWidth - rectWidth) / 2f
        val rectTop = (canvasHeight - rectHeight) / 2f
        val rectRight = rectLeft + rectWidth
        val rectBottom = rectTop + rectHeight
        
        // 半圆的边界Rect：以矩形右侧为直径，向右凸的半圆，需用正方形（宽高等于矩形高度）
        val arcRect = Rect(
            left = rectRight,
            top = rectTop,
            right = rectRight + rectHeight,
            bottom = rectBottom
        )

        val path = Path().apply {
            // 从矩形左上角开始绘制路径
            moveTo(rectLeft, rectTop)
            // 绘制左侧竖线到左下角
            lineTo(rectLeft, rectBottom)
            // 绘制底部横线到矩形右下角
            lineTo(rectRight, rectBottom)
            // 绘制右侧半圆：从右下角到右上角，向外凸
            arcTo(
                rect = arcRect,
                startAngleDegrees = 270f, // 起始角度：从下方向上（对应坐标系Y轴正方向）
                sweepAngleDegrees = 180f, // 顺时针扫过180度，形成完整半圆
                forceMoveTo = false // 保持路径连续，不跳转到圆弧起点
            )
            // 闭合路径，回到左上角
            close()
        }

        drawPath(
            path = path,
            style = Stroke(width = 10f),
            brush = Brush.linearGradient(
                colors = listOf(Color.Red, Color.Blue)
            )
        )
    }
}

关键修正说明： #

• 有效圆弧Rect：arcRect设置为正方形（宽高等于矩形高度），这是绘制半圆的必要条件。
• 角度参数调整：startAngleDegrees=270f从矩形右下角开始，sweepAngleDegrees=180f顺时针扫过半圆，刚好形成右侧向外凸的弧形。
• 相对坐标计算：基于Canvas的size动态计算所有坐标，确保内容始终在可视范围内，适配不同尺寸的Canvas。

内容的提问来源于stack exchange，提问作者Bob Rasner