使用 Android 在 xml 中使用 ShapeDrawable 绘制多个形状

Question

我目前正在代码中的自定义视图中在画布上绘制多个圆圈。圆圈是静态的并且不会改变。我想使用 xml 中的 ShapeDrawable 来绘制它们，以帮助清理我的代码。我将有许多不同的可绘制对象供用户选择，因此我不想在代码中执行此操作。对我来说，拥有 3 或 4 个 xml 可绘制对象似乎更整洁。

我使用 ShapeDrawable 在 xml 中创建了一个圆圈，但无法向 xml 添加多个形状。

如何使用 ShapeDrawable 将多个形状添加到 xml 文档。

Answer 1

以下是我如何制作一个带有单像素黑色边框的红色填充圆圈，中间有一个白色数字 72：

在 res\drawable 中创建一个 XML 文件并适当命名它，例如 red_circle_black_border.xml

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <solid android:color="@android:color/black" />
        </shape>
    </item>
    <item android:top="1dp" android:left="1dp" android:right="1dp" android:bottom="1dp">
        <shape android:shape="oval">
            <solid android:color="@android:color/red" />
        </shape>
    </item>
</layer-list>

然后，在您的布局中使用它，声明如下：

<TextView
    android:text="72"
    android:textSize="14dp"
    android:textStyle="bold"
    android:background="@drawable/red_circle_black_border" 
    android:layout_width="22dp"
    android:layout_height="22dp"
    android:gravity="center_vertical|center_horizontal"
    android:textColor="@android:color/white" />

显然，根据需要更改textSize和layout_width/height:-)

Answer 2

我想我已经找到了使用图层列表将多个形状添加到我的 xml 文件中的解决方案。
我还没有尝试过这个，但这似乎不正是我想要的，因为形状将按照其数组索引的顺序绘制。

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
   <item>
      <shape>
         <solid android:color="#FFF8F8F8" />
      </shape>
   </item>
   <item android:top="23px">
      <shape>
         <solid android:color="#FFE7E7E8" />
      </shape>
   </item>
</layer-list>

博客文章

Android 文档

Answer 3

我有一个带有 2 个口腔超大号的复选标记图标示例可能会对您有所帮助，请将其放入可绘制文件夹中

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:width="48dp"
        android:height="48dp">
        <shape android:shape="oval">
            <solid android:color="#5265FF" />
        </shape>
    </item>
    <item
        android:width="38dp"
        android:height="38dp"
        android:left="5dp"
        android:top="5dp">
        <shape android:shape="oval">
            <solid android:color="#636DFF" />
        </shape>
    </item>
    <item
        android:width="28dp"
        android:height="28dp"
        android:left="10dp"
        android:top="10dp">
        <vector
            android:width="27dp"
            android:height="27dp"
            android:tint="#F3F1FE"
            android:viewportWidth="24"
            android:viewportHeight="24">
            <path
                android:fillColor="@android:color/white"
                android:pathData="M12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM10,17l-5,-5 1.41,-1.41L10,14.17l7.59,-7.59L19,8l-9,9z" />
        </vector>
    </item>
</layer-list>