Android美工坊–selector選擇器的使用 – Android移動開發技術文章_手機開發 Android移動開發教學課程

selector選擇器可以讓你切換自定義的背景風格，比如button、ListView、或者佈局點擊時候的背景切換等，都需要用到它
背景可以是自定義到顏色，或者圖片資源
首先需要在你的res目錄下創建drawable文件夾，然後在裡面創建一個selector文件，如myselector.xml
註：不知為什麼，selector裡面有關focus的東西在真機上沒什麼效果，反而會影響使用，比如android:state_focus="true"，加上它就沒有效果，去掉它就可以正常使用瞭
默認情況下直接用下面的佈局即可實現點擊後即可切換背景，其實隻需要兩個item標簽即可，當然，item標簽內部可以用shape標簽自定義不同的風格
例子1：button點擊效果
res/drawable/myselector.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/button_pressed"
        ></item>
    <item
        android:drawable="@drawable/button_normal"
        ></item>
</selector>

res/layout/main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns: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"?>
<shape xmlns: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"?>
<shape xmlns: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"?>
<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/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"?>
<LinearLayout xmlns: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
  View Code
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 {
    public TextButton(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 extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
    }
}
 

 作者 婁立軍