Android XML | 理解 pathData 语法

Question

所以我正在尝试理解pathData语法，以便通过XML创建一些矢量图形...

我能够创建任何正方形形状，但我就是无法理解如何创建圆形（例如椭圆形或圆形）。

有人可以给出一些圆形形状的示例：

1. 圆形。
2. 椭圆形。
3. 空心圆/椭圆形（将其放在另一个形状上会导致此部分透明）。

并解释每个pathData属性的含义？

谢谢！

- user12597562891

Answer 1

路径注释（在Android矢量可绘制中使用的SVG符号）：路径具有紧凑的编码方式。例如，M（表示“移动到”）在初始数字x和y坐标之前，L（线条到）在应绘制线条的点之前。进一步的命令字母（C、S、Q、T和A）在数据之前，用于绘制各种贝塞尔和椭圆曲线。 Q是二次贝塞尔曲线，Z用于关闭路径。在所有情况下，大写字母命令后跟绝对坐标，相对坐标在等效小写字母之后使用。SVG路径符号。
命令： A（绝对）a（相对）
名称：椭圆弧
参数：（rx ry x-axis-rotation large-arc-flag sweep-flag x y）+
描述：从当前点到（x，y）绘制一个椭圆弧。椭圆的大小和方向由两个半径（rx，ry）和一个x-axis-rotation定义，它指示整个椭圆相对于当前坐标系旋转的程度。椭圆的中心（cx，cy）是自动计算的，以满足其他参数所施加的约束条件。 large-arc-flag和sweep-flag有助于自动计算并帮助确定如何绘制弧线。

在您的res/drawable文件夹中使用此（circle.xml）：

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="200dp"
    android:height="200dp"
    android:viewportHeight="64"
    android:viewportWidth="64">

    <path
        android:fillColor="#ff0000"
        android:pathData="M22,32
        A10,10 0 1,1 42,32
        A10,10 0 1,1 22,32 Z" />
</vector>

Parameters :(rx, ry x-axis-rotation large-arc-flag, sweep-flag x,  y )

            (10, 10       0               1,            1     42, 32 )
            (10, 10       0               1,            1     22, 32 )

注意:多余的空格和分隔符（如逗号）可以被消除。
两个弧可以组成一个圆。
圆是椭圆的一种特殊情况，android:fillColor="@color/transparent"。

- Jon Goodwin

---

@cricket_007 这是来自 https://www.w3.org/TR/SVG/paths.html#PathData 的内容，链接在文本“SVG路径符号”中。 - Jon Goodwin

Answer 2

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="108dp"
    android:width="108dp"
    android:viewportHeight="108"
    android:viewportWidth="108">

    <!--right half circle -->
    <path
        android:fillColor="#E1261D"
        android:pathData="M54,0
        A54,54 0 1,1 54,108Z" />

    <!--left half circle -->
    <path
        android:fillColor="#E1261D"
        android:pathData="M54,108
        A54,54 0 1,1 54,0Z" />
</vector>

否则

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="108dp"
    android:height="108dp"
    android:viewportWidth="108"
    android:viewportHeight="108">


    <path
        android:fillColor="#E1261D"
        android:pathData="M54,0
        A54,54 0 1,1 53.99999,0Z" />


</vector>

- Arnab Kundu

---

这个回答并没有解释所有的魔数，也没有提供任何进一步的信息链接。它也没有为现有的回答增加任何价值。 - Roland Illig