This blog will help you to Create shapes,Border,selector and Drawable using xml in Android.
1.Selector for a button: Create xml file named background_selector.xml in res/drawable and write the bellow code in that
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Non focused states -->
<item
android:state_focused="false"
android:state_selected="false"
android:state_pressed="false"
android:drawable="@drawable/home_unselected" />
<item
android:state_focused="false"
android:state_selected="true"
android:state_pressed="false"
android:drawable="@drawable/home" />
<!-- Focused states -->
<item
android:state_focused="true"
android:state_selected="true"
android:state_pressed="false"
android:drawable="@drawable/home" />
<!-- Pressed state -->
<item
android:state_pressed="true"
android:drawable="@drawable/home" />
</selector>
Then put this as background:
<ImageView
android:id="@+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/background_selector"
android:gravity="center" />
2.Selector for CheckBox: Create xml file named checkbox_selector.xml in res/drawable and write the following code in that
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/tick" android:state_checked="true"/>
<item android:drawable="@drawable/un_tick" android:state_checked="false"/>
</selector>
then put this as background:
<CheckBox
android:id="@+id/do_not_show_checkbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="@drawable/checkbox_selector" />
3.Create List row selector: Create xml file named list_selector.xml in res/drawable and write the following code in this
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@android:color/transparent" android:state_pressed="false" android:state_selected="false"/>
<item android:drawable="#9DCAF1" android:state_pressed="true"/>
<item android:drawable="#9DCAF1" android:state_pressed="false" android:state_selected="true"/>
</selector>
then use this as background in your layout that you want to set as list row as below:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/messages_list_rows"
android:layout_width="fill_parent"
android:layout_height="90dip"
android:background="@drawable/list_selector" >
<TextView
android:id="@+id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#B3FFFF"
android:textSize="14dip" />
</RelativeLayout>
4.Create a border with round edges: Create xml file named layout_background.xml in res/drawable and write the following code in this
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle" >
<gradient
android:angle="270"
android:endColor="#d9dff9"
android:startColor="#d9dff9" />
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
</shape>
then use this as background in your layout as below:
<RelativeLayout
android:id="@+id/user_image_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/layout_background">
</RelativeLayout>
5.Create red circle : Create xml file named custom_circle.xml in res/drawable and write the following code in this
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<solid android:color="#C4110C" />
<size
android:height="20dp"
android:width="20dp" />
</shape>
Hope this will help you :)
0 Comment(s)