Android Click Effect

When we develop our website, we find that when we add the <a/> tag, the label has a click effect, such as a color change, so that the user experience will be great, so how to add this effect in our Android development? This article is for everyone to uncover its mystery.

Since the Click event changes, we have to monitor whether users click, here I have two ways to achieve: 1, by changing the background image to achieve the above effect, 2, by changing the background color to achieve the above effect.

The two are different, such as when we design a button's Click event, we recommend the first one, and when we design things like item, we recommend the second. Okay, let's start with code analysis for you:

First of all to introduce the first: by changing the background image to achieve the above effect, since it is by changing the background image, so we need to prepare 2 pictures in advance, one as a non-click when a click.

Then we need to create a new drawable folder under Res and create a new Btn_bg.xml file in it:

<?xml version= "1.0" encoding= "Utf-8"? ><selector xmlns:android= "http://schemas.android.com/apk/res/ Android >    <!--click-    <item android:drawable= "@drawable/img_1" android:state_pressed= " True "/>    <!--not clicked-    <item android:drawable=" @drawable/img_2 "android:state_pressed=" false "/ ></selector>

Our layout file (main_activity.xml):

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android"    xmlns:tools= "http// Schemas.android.com/tools "    android:layout_width=" Match_parent "    android:layout_height = "Match_parent"    tools:context= ". Mainactivity ">        <button         android:layout_width=" Fill_parent "        android:layout_ Height= "wrap_content"        android:background= "@drawable/btn_bg"        android:text = "click Change"        />    </RelativeLayout>

Pay special attention to the red label. Well, our first effect is realized, how do you feel. Let's take a look at the second method:

The second method does not need to prepare the picture, we can change the background color to achieve the above effect, since here need to use the color, first for everyone to share a 16 binary color comparison table:

With the color table, let's start with code parsing:

The first step is to create a new Col.xml file under the Value folder to add the colors I might use:

<?xml version= "1.0" encoding= "Utf-8"?><resources>     <drawable name= "Write" > #fff </drawable >     

The second step is to modify the Btn_bg.xml file under the Drawable folder under Res:

<?xml version= "1.0" encoding= "Utf-8"? ><selector xmlns:android= "http://schemas.android.com/apk/res/ Android >    <!--click-    <item android:drawable= "@drawable/gray" android:state_pressed= " True "/>    <!--not clicked-    <item android:drawable=" @drawable/write "android:state_pressed=" false "/ ></selector>

The last step of our item tag setting:

<relativelayout Android:id= "@+id/relative1"Android:layout_width= "Match_parent"Android:layout_height= "Wrap_content"android:background= "@drawable/btn_bg"> <ImageView Android:id= "@+id/img1"Android:layout_width= "50DP"Android:layout_height= "50DP"android:src= "@drawable/img_1"Android:layout_marginleft= "20DP"Android:layout_margintop= "20DP"android:layout_centervertical= "true"/> <TextView android:layout_width= "Wrap_content"Android:layout_height= "Wrap_content"Android:layout_marginleft= "20DP"Android:textcolor= "#fff"Android:text= "First item"Android:layout_torightof= "@id/img1"android:layout_centervertical= "true"/> </RelativeLayout>

In this way we add the Click event Change, and finally summarize the two methods, the first method we need to prepare the material beforehand, and the second method, relatively flexible, we can make changes at will, very convenient.

Android Click Effect