如何在安卓中使用XML可绘制对象创建一个填充的半圆形状？

Question

我想使用XML可绘制对象创建半圆形状？像这样 这是我迄今为止尝试过的努力。

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#FCD83500"/>
    <size
        android:width="10dp"
        android:height="5dp"/>
    <corners
        android:bottomLeftRadius="50dp"
        android:bottomRightRadius="50dp"/>
</shape>

使用上述代码，我可以创建半圆，但我不知道如何使半圆透明。

我也查看了一些SO帖子，但找不到任何解决方案。

链接： - Half circle shape not work - how to draw a half circle in android - How to define a circle shape in an Android xml drawable file? 如果需要更多信息，请告诉我。提前感谢您的努力。

- Goku

---

需要使用XML drawable吗？否则，您也可以使用矢量图形。 - Balvinder Singh

@BalvinderSingh 可以随意使用“矢量图形”发布解决方案。 - Goku

Answer 1

更新

使用此代码。

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="90"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="90">
    <vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="24dp"
        android:height="24dp"
        android:viewportWidth="314.015"
        android:viewportHeight="314.015">
        <path
            android:fillColor="#FCD83500"
            android:pathData="M157.007,0C70.291,0 0,70.289 0,157.007c0,86.712 70.29,157.007 157.007,157.007c86.709,0 157.007,-70.295 157.007,-157.007C314.014,70.289 243.716,0 157.007,0zM31.403,157.015c0,-69.373 56.228,-125.613 125.604,-125.613V282.62C87.631,282.62 31.403,226.38 31.403,157.015z" />
    </vector>
</rotate>

OUTPUT

最终我使用 layer-list 找到了解决方案。

• LayerDrawable 是一个管理其他 drawable 数组的 drawable 对象。列表中的每个 drawable 按照列表顺序绘制，列表中的最后一个 drawable 位于顶部。

我的代码

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:left="26px"
        android:right="26px">

        <shape xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="oval"
            android:useLevel="false">
            <solid android:color="#00006AC5" />
            <size
                android:width="50dp"
                android:height="50dp" />
            <stroke
                android:width="2dp"
                android:color="#00BCD4" />
        </shape>

    </item>

    <item
        android:width="50dp"
        android:height="25dp"
        android:end="2dp"
        android:gravity="center"
        android:start="2dp"
        android:top="22dp">

        <shape xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="rectangle">
            <solid android:color="#00BCD4" />
            <size
                android:width="10dp"
                android:height="5dp" />
            <corners
                android:bottomLeftRadius="50dp"
                android:bottomRightRadius="50dp" />
        </shape>

    </item>

</layer-list>

输出

注意：如果您有其他解决方案，请随意发布答案。

- Goku

---

警告：Attribute end 仅适用于 API 级别 23 及更高版本（当前最低版本为 16） - Pratik Butani

我认为你会得到错误信息：此处不允许使用向量元素。 - Pratik Butani

Answer 2

我已经从矢量图形创建了代码：

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="314.015"
    android:viewportHeight="314.015">
    <path
        android:fillColor="#FCD83500"
        android:pathData="M157.007,0C70.291,0 0,70.289 0,157.007c0,86.712 70.29,157.007 157.007,157.007c86.709,0 157.007,-70.295 157.007,-157.007C314.014,70.289 243.716,0 157.007,0zM31.403,157.015c0,-69.373 56.228,-125.613 125.604,-125.613V282.62C87.631,282.62 31.403,226.38 31.403,157.015z" />
</vector>

输出将是：

现在，如果您想按照自己的角度显示：

可以使用以下方式：

android:rotation="90"

在你的ImageView中

TextView Drawable的更新:

创建自定义方法以旋转可绘制对象。

private Drawable rotate(Drawable drawable, int degree) {
    Bitmap iconBitmap = ((BitmapDrawable) drawable).getBitmap();

    Matrix matrix = new Matrix();
    matrix.postRotate(degree);
    Bitmap targetBitmap = Bitmap.createBitmap(iconBitmap, 0, 0, iconBitmap.getWidth(), iconBitmap.getHeight(), matrix, true);

    return new BitmapDrawable(getResources(), targetBitmap);
}

使用方法如下：

Drawable result = rotate(ContextCompat.getDrawable(mContext, R.drawable.ic_round), 90);
yourTextView.setCompoundDrawablesWithIntrinsicBounds(result, null, null, null);

注意：如果您找到了想要的SVG图像，则无需执行上述代码。我尝试查找图像，但没有找到，因此此处需要旋转代码。

希望这可以帮助您。

谢谢。

- Pratik Butani

---

这是一个好主意，但我想在TextView中使用它作为android:drawableEnd，所以我不能使用android:rotation="90"。 - Goku

@Goku 就像上面那样尝试一下。 - Pratik Butani

嘿，感谢你的时间。我已经找到了如何旋转“向量”的方法，请查看我的下面的答案。感谢你的帮助，给你点赞。 - Goku

这里我发了一个问题，并得到了答案。 - Pratik Butani

谢谢，我已经查看了你的问题，同时你可以更新你的答案，感谢你的帮助，我会接受你的答案。 - Goku

Answer 3

试试这个：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <stroke
                android:color="#FCD83500"
                android:width="1dp"/>
            <size
                android:width="20dp"
                android:height="20dp"/>
            <corners
                android:radius="50dp"/>
        </shape>
    </item>
    <item android:top="10dp">
        <shape android:shape="rectangle">
            <solid android:color="#FCD83500"/>
            <size
                android:width="20dp"
                android:height="10dp"/>
            <corners
                android:bottomLeftRadius="50dp"
                android:bottomRightRadius="50dp"/>
        </shape>
    </item>
</layer-list>

- Sdghasemi

---

谢谢，但是你的代码不起作用，请检查使用你的代码生成的输出。 - Goku

@Goku，你在真实设备上测试过吗？ - Sdghasemi

Answer 4

使用此代码制作半圆形矢量图像。如果您想旋转矢量图像，请使用带有旋转元素的组标记。请参考link。

<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"

android:viewportWidth="314.015"
android:viewportHeight="314.015">
<group
    android:translateX="314.015"
    android:rotation="90">
<path
    android:fillColor="#FCD83500"
    android:pathData="M157.007,0C70.291,0 0,70.289 0,157.007c0,86.712 70.29,157.007 157.007,157.007c86.709,0 157.007,-70.295 157.007,-157.007C314.014,70.289 243.716,0 157.007,0zM31.403,157.015c0,-69.373 56.228,-125.613 125.604,-125.613V282.62C87.631,282.62 31.403,226.38 31.403,157.015z" />

</group>
</vector>

- jeevashankar