[英]How to draw a circular stroke inside a circle?
I'm trying to achieve this effect, but I can't make the white circular stroke inside the circle. 我试图达到这个效果,但我不能在圆圈内做出白色圆形笔划。 In my implementation, the white stroke appears outside the circle 在我的实现中,白色笔划出现在圆圈外
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<corners android:radius="10dip" />
<stroke
android:width="5dip"
android:color="#ffffff" />
<solid android:color="#f50000" />
</shape>
</item>
</layer-list>
Expected output:- 预期产量: -
I accomplished this using a <layer-list>
and an <inset>
oval shape: 我使用<layer-list>
和<inset>
椭圆形完成了这个:
<?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="#f50000"/>
</shape>
</item>
<item>
<inset
android:insetTop="5dp"
android:insetLeft="5dp"
android:insetRight="5dp"
android:insetBottom="5dp">
<shape android:shape="oval">
<stroke
android:color="#fff"
android:width="5dp"/>
</shape>
</inset>
</item>
</layer-list>
You can control the inset amount and the stroke width by changing the values in the second item 您可以通过更改第二个项目中的值来控制插入量和笔触宽度
here you go. 干得好。 Just modify a little your file to have two items and add a padding on the second. 只需修改一下你的文件就有两个项目,然后在第二个项目上添加一个填充。 I hope it helps: 我希望它有所帮助:
<?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="#f50000" />
</shape>
</item>
<item
android:left="2dp"
android:right="2dp"
android:top="2dp"
android:bottom="2dp">
<shape
android:shape="oval">
<stroke
android:width="2dp"
android:color="#ffffff" />
</shape>
</item>
</layer-list>
You need an xml like this (optimized): 你需要一个这样的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="#007" />
</shape>
</item>
<item
android:left="2dp"
android:right="2dp"
android:top="2dp"
android:bottom="2dp">
<shape
android:shape="oval">
<stroke
android:width="1dp"
android:color="#f00" />
<size
android:width="25dp"
android:height="25dp" />
</shape>
</item>
</layer-list>
or xml like this (not optimized): 或像这样的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="#007" />
<size
android:width="25dp"
android:height="25dp" />
</shape>
</item>
<item>
<shape android:shape="oval">
<stroke
android:width="8dp"
android:color="@android:color/transparent" />
<solid android:color="#f00" />
<size
android:width="45dp"
android:height="45dp" />
</shape>
</item>
<item>
<shape android:shape="oval">
<stroke
android:width="10dp"
android:color="@android:color/transparent" />
<solid android:color="#007" />
<size
android:width="10dp"
android:height="10dp" />
</shape>
</item>
</layer-list>
for this result: 为此结果:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.