如何使用 Android xml 形状在圆内画一个圆? [英] How to draw a circle inside a circle using Android xml shapes?

问题描述

我正在尝试为我的应用程序制作一个搜索栏的拇指，并且我想要一个由不同的更大(半透明)外圆包围的内圆.我正在尝试使用 layer-list，但我遇到了问题.下面是我的代码...

I'm trying to make a thumb for a seekbar for my app, and I want to have an inner circle surrounded by a different, larger (semi-transparent) outer circle. I'm trying to use layer-list, but I'm having issues. Below is my code...

<?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="#00f" />

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

<item>
    <shape
        android:shape="oval" >
        <solid android:color="#f00" />

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

</layer-list>

我希望在较大的蓝色圆圈之上看到一个红色的小圆圈，但我看到的只是红色的小圆圈.有人有什么想法吗?

I would expect to see a small red circle on top of a larger blue circle, but all I'm seeing is the small red circle. Does anyone have any ideas?

推荐答案

我让它起作用的唯一方法是为内部(即顶部)圆定义一个透明的笔划，即越来越小的圆圈.

The only way I've gotten this to work is to define a transparent stroke for the inner (i.e., top) circle that's the difference between the size of the larger and smaller circle.

例如:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Larger blue circle in back -->
<item>
    <shape android:shape="oval">
        <solid android:color="#00f"/>
        <size
                android:width="15dp"
                android:height="15dp"/>
    </shape>
</item>
<!-- Smaller red circle in front -->
<item>
    <shape android:shape="oval">
        <!-- transparent stroke = larger_circle_size - smaller_circle_size -->
        <stroke android:color="@android:color/transparent"
                android:width="5dp"/>
        <solid android:color="#f00"/>
        <size
                android:width="10dp"
                android:height="10dp"/>
    </shape>
</item>
</layer-list>

...看起来像这样:

这篇关于如何使用 Android xml 形状在圆内画一个圆?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！