How to make different shapes in android

In this blog,
I will show you how to make different shapes in android.

Shape

The shape is the XML Element which is defined in XML. and must be the root element.

The file location is :

res/drawable/your_shape.xml
The filename is used as the resource ID.

The values which define the type of shape,

"rectangle": A rectangle that fills the containing View. This is the default shape.

"oval": An oval shape that fits the dimensions of the containing View.

"line": A horizontal line that spans the width of the containing View. This shape requires the  <stroke>   element to define the width of the line.

"ring": A ring shape.

How to create shapes

1. Circle:
   
   <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <solid android:color="@color/md_red_600" /> <padding android:bottom="5dp" android:left="5dp" android:right="5dp" android:top="5dp" /> </shape>

   1 2 3 4 5 6 7 8 9 10

   <shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="oval">       <solid android:color="@color/md_red_600" />     <padding         android:bottom="5dp"         android:left="5dp"         android:right="5dp"         android:top="5dp" /> </shape>

2. Rectangle:
   
   <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="@color/md_red_600" /> <padding android:bottom="5dp" android:left="5dp" android:right="5dp" android:top="5dp" /> </shape>

   1 2 3 4 5 6 7 8 9 10

   <shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="rectangle">       <solid android:color="@color/md_red_600" />     <padding         android:bottom="5dp"         android:left="5dp"         android:right="5dp"         android:top="5dp" /> </shape>

3. Ring:
   
   <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="ring"> <solid android:color="@color/md_red_600" /> <padding android:bottom="5dp" android:left="5dp" android:right="5dp" android:top="5dp" /> </shape>

   1 2 3 4 5 6 7 8 9 10

   <shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="ring">       <solid android:color="@color/md_red_600" />     <padding         android:bottom="5dp"         android:left="5dp"         android:right="5dp"         android:top="5dp" /> </shape>

4. Line:
   
   <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line"> <solid android:color="@color/md_red_600" /> <stroke android:width="1dp" /> <padding android:bottom="5dp" android:left="5dp" android:right="5dp" android:top="5dp" /> </shape>

   1 2 3 4 5 6 7 8 9 10 11

   <shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="line">       <solid android:color="@color/md_red_600" />     <stroke android:width="1dp" />     <padding         android:bottom="5dp"         android:left="5dp"         android:right="5dp"         android:top="5dp" /> </shape>

How to access

In Java: R.drawable.your_shape
In XML: @[package:]drawable/your_shape

Example:

Create the file named circuler_shape.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <solid android:color="@color/md_red_600" /> <padding android:bottom="5dp" android:left="5dp" android:right="5dp" android:top="5dp" /> </shape>

1 2 3 4 5 6 7 8 9 10

<shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="oval">       <solid android:color="@color/md_red_600" />     <padding         android:bottom="5dp"         android:left="5dp"         android:right="5dp"         android:top="5dp" /> </shape>

and this XML layout applies to a Textview:

<TextView android:id="@+id/sale" android:layout_width="35dp" android:layout_height="35dp" android:background="@drawable/circuler_shape" android:gravity="center" android:text="SALE" />

1 2 3 4 5 6 7

<TextView     android:id="@+id/sale"     android:layout_width="35dp"     android:layout_height="35dp"     android:background="@drawable/circuler_shape"     android:gravity="center"     android:text="SALE" />

For programmatically:

TextView saleTv = (TextView)findViewByID(R.id.sale); tv.setBackgroundResource(R.id.circuler_shape);

1 2	TextView saleTv = (TextView)findViewByID(R.id.sale); tv.setBackgroundResource(R.id.circuler_shape);

Source:

https://developer.android.com/