The Android development tutorial uses a combination of shape and selector _android

Shape and selector are often used in Android UI design, such as we want to customize a fillet button, click on the button some effect changes, we need to use shape and selector. It can be said that the role of shape and selector in beautifying the control is essential.

1.Shape

Brief introduction

function: Geometric shapes defined in XML

Location: res/drawable/The name of the file. xml

Methods to use:

Java code: r.drawable. File name

XML: android:background= "@drawable/File name"

Property:

<shape> android:shape=["Rectangle" | "Oval" | "Line" | "Ring"]

One of the rectagle rectangles, oval ellipses, line horizontal lines, ring rings

Common properties for <shape> neutron nodes:

<gradient> gradients

Android:startcolor Start Color
Android:endcolor End Color
Android:angle gradient angle, 0 from top to bottom, 90 for left to right, the value of 45 integer times default to 0;
Android:type gradient Style liner linear gradient radial annular gradient sweep
<solid > Filling
Color of Android:color Fills
<stroke > Stroke
Width of android:width Stroke
Color of Android:color Strokes
Android:dashwidth means '-' the width of the horizontal line
Android:dashgap says '-' the distance between horizontal lines
<corners > Rounded Corners
The radius of the Android:radius fillet is larger, the corner becomes more rounded.
Android:toprightradius radius of upper right corner

Android:bottomleftradius angle radius of right corner
Android:topleftradius radius of upper left corner
Android:bottomrightradius radius of the lower left corner

2.Selector

Brief introduction

Location: res/drawable/The name of the file. xml

Methods to use:

Java code: r.drawable. File name

XML: android:background= "@drawable/File name"

<?xml version= "1.0" encoding= "Utf-8"?> <selector xmlns:android= 
"http://schemas.android.com/apk/res/" Android > 
<!--default background picture--> 
<item android:drawable= "@drawable/pic1"/> 
<!-- Background picture with no focus--> 
<item 
android:state_window_focused= "false 
android:drawable=" @drawable/pic_ Blue " 
/> 
< background picture--> 
<item 
android:state_focused=" true " 
when the focus is obtained in non-touch mode and clicked Android:state_pressed= "true" 
android:drawable= "@drawable/pic_red" 
/> 
<!--the background picture when clicked in touch mode-- > 
<item 
android:state_focused= "false" 
android:state_pressed= "true" 
android:drawable= The 
picture background--> 
<item 
android:state_selected= "true" @drawable/pic_pink/> <!--selected 
android:drawable= "@drawable/pic_orange" 
/> 
<!--get focus when the picture background--> 
<item 
Android:state_focused= "true" 
android:drawable= "@drawable/pic_green" 
/> 

The first example: the button for rounded corners

http://liangruijun.blog.51cto.com/3061169/630051

Second example: Shape+selector comprehensive use of examples of beautiful ListView

Let's look at the structure of this example:

Selector.xml

<?xml version= "1.0" encoding= "Utf-8"?> <selector xmlns:android= "http://schemas.android.com/apk/res/" Android "> <item android:state_selected=" true "> <shape> <gradient android:angle=" 270 "Android: Endcolor= "#99BD4C" android:startcolor= "#A5D245"/> <size android:height= "60DP" android:width= "320DP"/> < Corners android:radius= "8DP"/> </shape> </item> <item android:state_pressed= "true" > &LT;SHAPE&G 
T <gradient android:angle= "270" android:endcolor= "#99BD4C" android:startcolor= "#A5D245"/> <size android: height= "60DP" android:width= "320DP"/> <corners android:radius= "8dp"/> </shape> </item> <item > <shape> <gradient android:angle= "270" android:endcolor= "#A8C3B0" android:startcolor= "#C6CFCE"/> Size android:height= "60DP" android:width= "320DP"/> <corners android:radius= "8dp"/> </shape> </ite  M> </selector>

List_item.xml

<?xml version= "1.0" encoding= "Utf-8"?> <linearlayout xmlns:android= 
"http://schemas.android.com/apk/" Res/android " 
android:orientation=" horizontal " 
android:layout_width=" fill_parent " 
android:layout_" height= "Wrap_content" 
android:background= "@drawable/selector" 
> 
<imageview 
android:id= "@ +id/img " 
android:layout_width=" wrap_content " 
android:layout_height=" Wrap_content " 
android: Layout_gravity= "center_vertical" 
android:layout_marginleft= "20DP" 
/> 
<textview 
android:text= "Data" 
android:id= "@+id/title" 
android:layout_width= "fill_parent" 
android:layout_ height= "Wrap_content" 
android:gravity= "center_vertical" 
android:layout_marginleft= "20DP" 
android:layout_margintop= "20DP" 
android:textsize= "14sp" 
android:textstyle= "bold" 
Android: Textcolor= "@color/black" 
> 
</TextView> 
</LinearLayout>

Main.xml

<?xml version= "1.0" encoding= "Utf-8"?> <linearlayout xmlns:android= 
"http://schemas.android.com/apk/" Res/android " 
android:orientation=" vertical " 
android:layout_width=" fill_parent " 
android:layout_" height= "Wrap_content" 
android:background= "#253853" 
> 
<listview 
android:id= "@+id/list" 
android:layout_width= "match_parent" 
android:layout_height= "match_parent" 
android:cachecolorhint = "#00000000" 
android:divider= "#2A4562" 
android:dividerheight= "3px" 
android:listselector= "# 264365 " 
android:drawselectorontop=" false " 
> 
</ListView> 

Colors.xml

<?xml version= "1.0" encoding= "Utf-8"?> 
<resources> 
<color name= "White" > #FFFFFFFF </ color> 
<color name= "Transparency" > #00000000 </color> 
<color name= "TITLE_BG" > #1C86EE </color> 
<color name= "End_color" > #A0cfef83 </color> 
<color name= "BLACK" > #464646 </color> 

Mainactivity.xml

Package com.lingdududu.customlist; 
Import java.util.ArrayList; 
Import Java.util.HashMap; 
Import XB.CUSTOMLIST.R; Import Android. 
R.array; 
Import android.app.Activity; 
Import Android.os.Bundle; 
Import Android.widget.ArrayAdapter; 
Import Android.widget.ListView; 
Import Android.widget.SimpleAdapter; 
public class Mainactivity extends activity {ListView list; 
String data[] = new string[]{"", "UK", "USA", "Japan", "German", "Canada", "ET", "Narotu"}; /** called the activity is a. 
* * @Override public void onCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); 
Setcontentview (R.layout.main); 
List = (ListView) Findviewbyid (r.id.list); Simpleadapter adapter = new Simpleadapter (this, GetData (), R.layout.list_item, new string[]{"title", "IMG"}, new Int[]{r. 
ID.TITLE,R.ID.IMG}); 
List.setadapter (adapter); Private arraylist 

Effect Chart:

The above is a small set for you to share the Android development course of the combination of the shape and selector of the use of the relevant content, I hope to help.