Android Circle Background

Android Circle Background

Giving Circle Background to TextView and making TextView text center.

First create activity and add a TextView in it as shown below.

   <TextView
        android:layout_width="180dp"
        android:layout_height="180dp"
        android:gravity="center"
        android:background="@drawable/circle"
        android:textColor="#ffffff"
        android:text="www.thenewtutorial.com"
        />

android:background

In property we will give name of our drawable resource file that we will create inside drawable resource directory.

android:text

This is the text that will be shown in TextView.

android:gravity

This will make TextView text center.

Now create drawable resource file named circle. Make sure that this file is inside drawable resource directory.

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <size android:width="160dp" android:height="160dp" />
            <solid android:color="#3F51B5"/>
        </shape>
    </item>
</selector>

In circle drawable resource file we used oval shape to create circle background. Give width and height same value to make oval to circle. To provide color of circle we use <solid> attribute.

You can use this circle background for any view and just for TextView.

Output:

Android Circle Background

TextView Circle Border

<TextView
    android:layout_width="180dp"
    android:layout_height="180dp"
    android:gravity="center"
    android:background="@drawable/circle_border"
    android:textColor="#FB0A2F"
    android:text="www.thenewtutorial.com"
    />

Make sure you choose  android:textColor other than white.

circle_border.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <size android:width="160dp" android:height="160dp" />
            <solid android:color="@android:color/transparent"/>
            <stroke android:color="#9C27B0" android:width="5dp" />
        </shape>
    </item>
</selector>

Here we provided <solid> color as transparent so that we can only see border.

<stroke> is used to give border to the shape.

Android Circle Background Border

TextView gradient background

<TextView
    android:layout_width="180dp"
    android:layout_height="180dp"
    android:gravity="center"
    android:background="@drawable/circle_gradient"
    android:textColor="#ffffff"
    android:text="www.thenewtutorial.com"
    />

circle_gradient.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="oval">
            <size android:height="160dp" android:width="160dp"/>
            <solid android:color="#3F51B5"/>
            <gradient android:angle="360" android:startColor="#673AB7" android:endColor="#9C27B0" />
        </shape>
    </item>
</selector>
Android TextView gradient background Output