Rounded corners android image buttons

Question

I am trying to round corners on an android ImageButton, the code looks like this;

<?xml version="1.0" encoding="utf-8"?>  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:orientation="vertical" android:layout_width="match_parent"     android:layout_height="match_parent">      <RelativeLayout          android:layout_width="fill_parent"         android:layout_height="fill_parent">          <ImageButton             android:layout_width="wrap_content"             android:layout_height="wrap_content"             android:id="@+id/imageButton"             android:layout_marginTop="57dp"             android:src="@drawable/friends"             android:padding="1dp"             android:layout_alignParentTop="true"             android:layout_toLeftOf="@+id/imageButton2"             android:layout_marginRight="62dp" />      </RelativeLayout> </LinearLayout> 

Basically our output is an ImageButton but it has squared corners, we are trying to round off the corners.

Thanks

Answer 1

Use Shape in android to make the rounder corners

create the xml file named it as roundcorner.xml

<?xml version="1.0" encoding="utf-8"?>     <shape xmlns:android="http://schemas.android.com/apk/res/android">         <solid android:color="#33DDFF" />         <corners android:radius="4dp" />     </shape> 

In your ImageButton add this attribute android:background="@drawable/roundcorner"

<ImageButton                 android:layout_width="wrap_content"                 android:layout_height="wrap_content"                 android:id="@+id/imageButton"                 android:layout_marginTop="57dp"                 android:src="@drawable/friends"                 android:background="@drawable/roundcorner"                 android:padding="1dp"                 android:layout_alignParentTop="true"                 android:layout_toLeftOf="@+id/imageButton2"                 android:layout_marginRight="62dp" /> 

Answer 2

You could use a selector made of shape drawables as background, for example :

rounded_bg.xml (to be created in res/drawable-nodpi folder)

<shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="rectangle">      <solid android:color="#ffffff" />     <corners         android:bottomLeftRadius="4dp"         android:bottomRightRadius="4dp"         android:topLeftRadius="4dp"         android:topRightRadius="4dp" />  </shape> 

Create another one, changing the color referenced in solid android:color="#ffffff" , for example to solid android:color="#ff0000" and name that file rounded_bg_selected.xml

Create the selector (also in res/drawable-nodpi), name it selectable_button_bg.xml:

<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android">     <item android:state_pressed="true"          android:drawable="@drawable/rounded_bg_selected" />     <item  android:state_focused="false"          android:drawable="@drawable/rounded_bg" /> </selector> 

Then reference it in your layout :

<ImageButton      android:background="@drawable/selectable_button_bg"      android:layout_width="wrap_content"      android:layout_height="wrap_content"      android:id="@+id/imageButton"      android:layout_marginTop="57dp"      android:src="@drawable/friends"      android:padding="1dp"      android:layout_alignParentTop="true"      android:layout_toLeftOf="@+id/imageButton2"      android:layout_marginRight="62dp" />