Jetpack Compose中DrawScope的drawArc()角度与绘制方向问题
Jetpack Compose drawArc 角度与方向解析
核心问题在于你没注意到 Compose 中 drawArc 的角度规则和常规数学坐标系不一样:
- 角度起始与方向:
- 0° 对应椭圆(或圆)的右半轴(指向右侧)
- 正角度是顺时针旋转,而非数学里的逆时针
你的代码为什么显示左半圆?
看你设置的参数:
startAngle = 270f:从0°(右侧)顺时针转270°,最终指向椭圆的上半轴(顶部)sweepAngle = 180f:从顶部开始,顺时针扫180°,最终到椭圆的下半轴(底部)- 加上
useCenter = true,这个弧会连接椭圆中心,形成左半圆——因为顺时针从顶部转到底部的路径,刚好沿着椭圆的左侧走
要显示右半圆怎么改?
两种方式:
- 把
startAngle改成90f,sweepAngle保持180f:从底部(90°)顺时针扫180°到顶部,路径沿椭圆右侧,形成右半圆 - 保持
startAngle=270f,把sweepAngle改成-180f:负角度代表逆时针旋转,从顶部逆时针扫180°到底部,路径同样沿右侧
调整后的示例代码:
@Composable private fun GooglePhotosIcon() { Canvas( modifier = Modifier .size(100.dp) .padding(16.dp) .border(1.dp, Color.Magenta) ) { // 右侧半圆示例 drawArc( color = Color(0xFFf04231), startAngle = 90f, sweepAngle = 180f, useCenter = true, size = Size(size.width * .50f, size.height * .50f), topLeft = Offset(size.width * .25f, 0f) ) } }
内容的提问来源于stack exchange,提问作者Maham
相关产品推荐
相关产品推荐

