Android Shape: Circle with cross(plus)

Question

I am trying to get a circle with a cross(plus) in the middle, like the following:

Most of the tutorial I've been reading have no helped at all at layer-lists. Here is my code so far:

<item android:top="0dp" android:left="0dp" android:bottom="0dp" android:right="0dp">
    <shape android:shape="line">
        <stroke android:width="10dp" />
        <solid android:color="@color/bus_red" />
    </shape>
</item>

<item android:top="0dp" android:left="0dp" android:bottom="0dp" android:right="0dp">
    <rotate
        android:fromDegrees="0"
        android:toDegrees="90" >
            <shape android:shape="line">
                <stroke android:width="10dp" />
                <solid android:color="@color/bus_red" />
            </shape>
    </rotate>
</item>

<item android:top="0dp" android:left="0dp" android:bottom="0dp" android:right="0dp">
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="ring"
        android:innerRadius="20dp"
        android:thickness="5dp"
        android:useLevel="false">

        <solid android:color="@color/bus_red" />
    </shape>
</item>

As you can see I have a ring shape and two line shapes, one of which I am trying to rotate. The ring shape is of no problem, I am having trouble getting the two lines in the middle, or even getting them to show.

Answer 1

I think this approach is still valid since it still uses drawable in XML.

You can create new vector asset named add circle outline in Android Studio.

This is the code it generates:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="24dp"
        android:height="24dp"
        android:viewportWidth="24.0"
        android:viewportHeight="24.0">
    <path
        android:fillColor="#FF000000"
        android:pathData="M13,7h-2v4L7,11v2h4v4h2v-4h4v-2h-4L13,7zM12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM12,20c-4.41,0 -8,-3.59 -8,-8s3.59,-8 8,-8 8,3.59 8,8 -3.59,8 -8,8z"/>
</vector>

Answer 2

I accomplished something similar (a solid circle with a white plus in the middle) using this drawable 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="@color/accent"/>
        </shape>
    </item>
    <item>
        <shape android:shape="line">
            <stroke android:width="5dp" android:color="@android:color/white" />
         </shape>
    </item>
    <item>
        <rotate
            android:fromDegrees="90"
            android:pivotX="50%"
            android:pivotY="50%"
            android:toDegrees="-90">
            <shape android:shape="line">
                <stroke android:width="5dp" android:color="@android:color/white" />
            </shape>
        </rotate>
    </item>
</layer-list>