透明圆形带边框

Question

我正在尝试在 Android 中使用 XML 创建一个只有边框的圆形：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >

<stroke android:width="1dp"
    android:color="#000000"/>

</shape>

我使用的代码已发布在上面。然而，我得到的是一个实心圆盘而不是一个环形。我想使用仅 XML 而不是 canvas 来获得输出。我做错了什么？

谢谢。

编辑： 由于下面的答案，我成功解决了问题。这是我的最终代码：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="0dp"
    android:shape="ring"
    android:thicknessRatio="1.9"
    android:useLevel="false" >

    <solid android:color="@android:color/transparent" />

    <size android:width="100dp"
     android:height="100dp"/>

    <stroke android:width="1dp"
    android:color="#FFFFFF"/>

</shape>

- Anirudh

Answer 1

尝试类似这样的东西。

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="0dp"
    android:shape="ring"
    android:thicknessRatio="2"
    android:useLevel="false" >
    <solid android:color="@android:color/transparent" />

    <stroke
        android:width="2dp"
        android:color="@android:color/darker_gray" />
</shape>

更新：将android:thicknessRatio="2"设置为完整的圆形（使用 Nexus 5 - Lollipop）。

- stinepike

---

我将android:thicknessRatio="2"设置为一个闭环（Nexus 5，棒棒糖版本）。 - David

圆圈外的区域对我来说没有显示为透明。 - Paradox

@Paradox，尝试使用ImageView而不是Button。 - Nikunj Patel

Answer 2

使用这个，它会起作用。

<?xml version="1.0" encoding="utf-8"?>  
     <shape xmlns:android="http://schemas.android.com/apk/res/android"                                                                                                                                                     
   android:shape="oval" >

<gradient
    android:centerX=".6"
    android:centerY=".40"
    android:endColor="@android:color/transparent"
    android:gradientRadius="20"
    android:startColor="@android:color/transparent"
    android:type="radial" />

<stroke
    android:width="1dp"
    android:color="#FFFFFF" />

<size
    android:height="100dp"
    android:width="100dp" />

</shape>

- anupam sharma

Answer 3

空心的

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
        <stroke
            android:width="1dp"
            android:color="@color/indicator_unselected" />
    </shape>

完整的

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <corners android:radius="100dp" />
    <solid android:color="@android:color/white" />
</shape>

- Hitesh Sahu

Answer 4

可以通过绘制一个透明的椭圆，填充所需颜色的描边（在本例中为＃000）来实现笔画效果。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@android:color/transparent" />
    <stroke
        android:width="1dp"
        android:color="#000" />
    <size
        android:width="40dp"
        android:height="40dp" />
</shape>

- Alex Burov

Answer 5

如果您可以使用矢量图，请尝试以下方法。

<vector android:height="24dp" android:viewportHeight="512.0"
    android:viewportWidth="512.0" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
    <path android:fillColor="#FFFFFF" android:fillType="evenOdd"
        android:pathData="M0,0L512,0L512,512L0,512L0,0ZM256,511C396.8,511 511,396.8 511,256C511,115.2 396.8,1 256,1C115.2,1 1,115.2 1,256C1,396.8 115.2,511 256,511Z"
        android:strokeColor="#00000000" android:strokeWidth="1"/>
</vector>

- Hector

Answer 6

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

        <gradient
            android:endColor="@android:color/transparent"
            android:gradientRadius="20"
            android:startColor="@android:color/transparent" />

        <stroke
            android:width="1dp"
            android:color="#d9d9d9" />

        <size
            android:height="100dp"
            android:width="100dp" />
        </shape>
    </item>

    <item
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp"
        android:top="1dp">
        <shape android:shape="oval" >

            <gradient
                android:endColor="@android:color/transparent"
                android:gradientRadius="20"
                android:startColor="@android:color/transparent" />

            <stroke
                android:width="1dp"
                android:color="#b3b3b3" />

            <size
                android:height="100dp"
                android:width="100dp" />
        </shape>
    </item>
</layer-list>

- Palak Jain

Answer 7

你可以使用Android内置的透明值@android:color/transparent，或者使用#0000或#00000000。

对于上述四位数的起始数字，第一个是透明度，在八位数中，前两个数字与透明度相同。

当你只提供3位或6位颜色时，默认的透明度值为ff，如果在4位或8位值中传递该透明度，则设置该颜色值的透明度。

- Pratik

---

嗨，Pratik，我不理解你回答中的alpha部分。我在XML文件中添加了一行<solid android:color="#0000"/>，但仍然得到相同的结果。 - Anirudh

这个alpha被用来设置颜色的不透明度。如果你设置4个0或8个0，那么它就完全透明了，增加8个0的第一个2位数字将只增加不透明度的值。 - Pratik

Answer 8

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval" >

            <stroke
                android:width="4dp"
                android:color="@color/colorPrimaryDark" />
            <corners android:radius="0dp" />
        </shape>
    </item>
    <item
        android:top="1dp"
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp">

        <shape android:shape="oval">
            <solid android:color="@color/colorRed" />
            <size android:height="@dimen/_100sdp"
                android:width="@dimen/_100sdp"></size>
        </shape>

    </item>

</layer-list>

- Mohsinali

Answer 9

您可以尝试使用以下可绘制对象设置图像视图的背景：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval" >

            <stroke
                android:width="4dp"
                android:color="@android:color/black" />
            <corners android:radius="0dp" />
        </shape>
    </item>
    <item
        android:top="8dp"
        android:bottom="8dp"
        android:left="8dp"
        android:right="8dp">

        <shape android:shape="oval">
            <solid android:color="@android:color/black" />
            <size
                android:height="100dp"
                android:width="100dp" />
        </shape>

    </item>

</layer-list>

- Kishan Mevada

Answer 10

如果您将颜色设置为#00000000，则结果将是透明的。如果您希望在未来的开发中更改它，则应该这样做。例如，如果您想要它是红色和部分透明的，那么它将是#ff000088，其中最后两个数字是不透明度。我这样做是为了使未来的更改更容易。

- Jack Papel