Android Selector選擇器的使用

Android selector選擇器可以讓你切換自定義的背景風格,比如button、ListView、或者佈局點擊時候的背景切換等,都需要用到它

我們都知道,android控件的背景可以是自定義到顏色,或者圖片資源,其實它也可以是一個xml:

首先需要在你的res目錄下創建drawable文件夾,然後在裏面創建一個selector文件,如myselector.xml

:不知爲什麼,selector裏面有關focus的東西在真機上沒什麼效果,反而會影響使用,比如android:state_focus="true",加上它就沒有效果,去掉它就可以正常使用了

默認情況下直接用下面的佈局即可實現點擊後即可切換背景,其實只需要兩個item標籤即可,當然,item標籤內部可以用shape標籤自定義不同的風格

例子1:button點擊效果

<?xml version="1.0"encoding="utf-8"?>

<selectorxmlns:android="http://schemas.android.com/apk/res/android" >

   <item

       android:state_pressed="true"

       android:drawable="@drawable/button_pressed"

       ></item>

   <item

       android:drawable="@drawable/button_normal"

       ></item>

</selector>

 

res/layout/main.xml

<?xml version="1.0"encoding="utf-8"?>

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

   android:layout_width="fill_parent"

   android:layout_height="fill_parent"

   android:orientation="vertical" >

   <Button

       android:id="@+id/test"

       android:layout_width="fill_parent"

       android:layout_height="wrap_content"

       android:background="@drawable/myselectr"

       android:text="Go Home"

       />

</LinearLayout>

 運行效果:

這是正常情況

 

這是點擊後的效果

 當然,針對button的selector還有很多其他的配置,但是對於一般程序來說上面的配置就夠了

 

例子2:TextView點擊效果

 

這個例子是網上找的,演示的是一個用TextView來定義的一個Button,實現類似TabWidget風格的選項卡。

自定義按鈕,這裏沒有通過Button類或者子類去做派生,而是通過TextView派生出來的。

 在這裏三個按鈕是三個TextView派生類實例,中間的白線,是1px寬的白色矩形,這樣就可以做出類似上面的效果。先看圖

點擊後:

/res/drawable/background_color.xml 用shape標籤自定義一個漸變背景

<?xml version="1.0"encoding="utf-8"?>

<shapexmlns:android="http://schemas.android.com/apk/res/android" >

   <gradient

       android:startColor="#FFFFFFFF"

       android:endColor="#FFFFFFFF"

       android:angle="270.0"

       android:centerY="0.3"

       android:centerColor="#FFBDBDBD"

       />

</shape>

 

/res/drawable/button_color.xml

<?xml version="1.0"encoding="utf-8"?>

<shapexmlns:android="http://schemas.android.com/apk/res/android" >

   <gradient

       android:startColor="#FF7F7F7F"

       android:endColor="#FF000000"

       android:angle="270.0"

       />

</shape>

 

<?xml version="1.0"encoding="utf-8"?>

<selectorxmlns:android="http://schemas.android.com/apk/res/android"

   android:constantSize="true">

    <!-- 獲得焦點時的背景圖片 -->

   <item android:state_focused="true">

       <shape>

           <gradient

               android:startColor="#FFE5CF33"

               android:endColor="#FFF1E7A2"

                android:angle="90.0"

                />

       </shape>

   </item>

   <!-- 設置相應所有事件 -->

   <item android:state_enabled="true"android:state_pressed="false">

       <shape>

           <gradient

               android:startColor="#FF1B1B1B"

               android:endColor="#FF969696"

                android:angle="90.0"

                />

       </shape>

   </item>

   <!-- 按鈕點擊時的背景 -->

   <item android:state_enabled="true"android:state_pressed="true">

       <shape>

           <gradient

               android:startColor="#FF000000"

               android:endColor="#FF474747"

                android:angle="90.0"

                />

       </shape>

   </item>

   <item android:state_enabled="false"android:state_pressed="true">

       <shape>

           <gradient

                android:startColor="#FF000000"

               android:endColor="#FF474747"

                android:angle="90.0"

                />

       </shape>

   </item>

   <!-- 默認情況下的背景 -->

   <item>

       <shape>

           <gradient

                android:startColor="#FF000000"

               android:endColor="#FF474747"

                android:angle="90.0"

                />

       </shape>

   </item>

</selector>

 

res/drawable/button_selector.xml

<?xml version="1.0"encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android"

   android:constantSize="true">

   <!-- 獲得焦點時的背景圖片 -->

   <item android:state_focused="true">

       <shape>

           <gradient

               android:startColor="#FFE5CF33"

                android:endColor="#FFF1E7A2"

                android:angle="90.0"

                />

       </shape>

   </item>

   <!-- 設置相應所有事件 -->

   <item android:state_enabled="true"android:state_pressed="false">

       <shape>

           <gradient

                android:startColor="#FF1B1B1B"

               android:endColor="#FF969696"

                android:angle="90.0"

                />

       </shape>

   </item>

   <!-- 按鈕點擊時的背景 -->

   <item android:state_enabled="true"android:state_pressed="true">

        <shape>

           <gradient

               android:startColor="#FF000000"

               android:endColor="#FF474747"

                android:angle="90.0"

                />

       </shape>

   </item>

   <item android:state_enabled="false" android:state_pressed="true">

       <shape>

           <gradient

               android:startColor="#FF000000"

               android:endColor="#FF474747"

                android:angle="90.0"

                />

       </shape>

   </item>

   <!-- 默認情況下的背景 -->

   <item>

       <shape>

           <gradient

               android:startColor="#FF000000"

               android:endColor="#FF474747"

                android:angle="90.0"

                />

       </shape>

   </item>

</selector>

 

res/layout/main.xml,這個是主佈局,由自定義的Button和1px的白色矩形組成

<?xml version="1.0"encoding="utf-8"?>

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"

   android:layout_width="fill_parent"

   android:layout_height="fill_parent"

   android:background="@drawable/background_color"

   android:orientation="vertical" >

 

   <LinearLayout

       android:layout_width="fill_parent"

       android:layout_height="10dip"

       />

   <LinearLayout

       android:layout_width="fill_parent"

       android:layout_height="40dip"

       >

       <com.loulijun.demo02.TextButton

           android:layout_width="fill_parent"

           android:layout_height="fill_parent"

           android:layout_weight="1"

           android:text="飲食"

           android:gravity="center"

           android:background="@drawable/button_selector"

           android:focusable="true"

           android:clickable="true"

           />

       <View android:layout_width="2px"android:layout_height="fill_parent"

           android:background="#FFFFFFFF"/>

       <com.loulijun.demo02.TextButton

           android:layout_width="fill_parent"

           android:layout_height="fill_parent"

           android:layout_weight="1"

           android:text="旅行"

           android:gravity="center"

           android:background="@drawable/button_selector"

           android:focusable="true"

           android:clickable="true"

           />

       <View android:layout_width="2px"android:layout_height="fill_parent"

           android:background="#FFFFFFFF"/>

       <com.loulijun.demo02.TextButton

           android:layout_width="fill_parent"

           android:layout_height="fill_parent"

           android:layout_weight="1"

           android:text="體育"

           android:gravity="center"

           android:background="@drawable/button_selector"

           android:focusable="true"

           android:clickable="true"

           />

   </LinearLayout>

</LinearLayout>

 

 

繼承自TextView的自定義Button

package com.loulijun.demo02;

import android.content.Context;

import android.util.AttributeSet;

import android.view.MotionEvent;

import android.view.View;

import android.widget.TextView;

import android.widget.Toast;

public class TextButton extends TextView {

    publicTextButton(Context context)

    {

       super(context);

    }

   public TextButton(Context context, AttributeSet attrs, int defStyle)

    {

       super(context,attrs,defStyle);

    }

   public TextButton(final Context context, AttributeSet attrs)

    {

       this(context,attrs,0);

       this.setOnTouchListener(new OnTouchListener()

       {

           @Override

           public boolean onTouch(View v, MotionEvent event) {

               if(event.getAction()==MotionEvent.ACTION_CANCEL

                       ||event.getAction()==MotionEvent.ACTION_UP

                       ||event.getAction()==MotionEvent.ACTION_OUTSIDE)

                {

                    Toast.makeText(context,"hello", Toast.LENGTH_SHORT).show();

                }

                return false;

           }

           

       });

    }

}

 

主程序

package com.loulijun.demo02;

import android.app.Activity;

import android.os.Bundle;

public class Demo02Activity extendsActivity {

   /** Called when the activity is first created. */

   @Override

   public void onCreate(Bundle savedInstanceState) {

       super.onCreate(savedInstanceState);

       setContentView(R.layout.main);

    }

}

 


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章