Ring shape in android

Question

I have the following xml in drawable folder (circle_status.xml) to create a ring:

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

<solid android:color="#ababf2" />

</shape>

And insert the drawable like a background of a relativeLayout, as next:

<RelativeLayout
        android:id="@+id/RelativeLayout_Status"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:background="@drawable/circle_status" >
    </RelativeLayout>

The problem, is in the relativeLayout appear a circle not a ring.

Solution 1

I answer myself.

It seems the problem is in the Graphical Layout Editor of Eclipse, the code works fine in a real device.

Solution 2

Note that a ring is an oval without a fill. Just with a stroke. And the view holding it, should be a perfect square.

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">

<stroke
    android:width="1dp"
    android:color="@color/blue" />
</shape>

And the view holding it

<ImageView
     android:layout_width="10dp"
     android:layout_height="10dp"
     android:src="@drawable/ring" />

Solution 3

This hack shows a ring on both device and Android Studio:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="ring" android:innerRadius="23dp" android:thickness="0dp">
    <stroke android:width="2dp" android:color="#ababf2" />
</shape>

Solution 4

You must use <stroke> tag instead of <solid> tag for ring in a <shape> tag. Using <solid> tag in a <shape> tag results a circle not a ring.

<solid> tag can be used for ring background color and <stroke> for ring body color.

View more solutions