Android入門教程 | Button，TextView背景設定

Button 按鈕

Button能對使用者的點選行為作出反應。
在xml檔案中放置一個button。

<Button
     android:id="@+id/btn"
     android:layout_height="wrap_content"
     android:layout_width="wrap_content"
     android:text="@string/self_destruct" />

要想監聽到 button 的點選事件，我們在 Activity 中進行設定。

public class MyActivity extends Activity {     protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);
         setContentView(R.layout.content_layout_id);         final Button button = findViewById(R.id.button_id);
         button.setOnClickListener(new View.OnClickListener() {
             public void onClick(View v) {                 // 這裡是按鈕點選事件，在主執行緒執行
             }
         });
     }
 }

上面我們用到了 View.OnClickListener。button 被點選後會執行 onClick方法。 系統會在App的主執行緒中執行 onClick方法。我們可以在這裡面更新UI。但不要做太耗時的操作。

我們注意到 OnClickListener 其實是 View 中的一個介面。setOnClickListener 也是View 的一個方法。 換句話說，就算我們這裡用的不是 button，也可以用這樣的方式來監聽點選事件。 即 View.setOnClickListener(View.OnClickListener())。

以後會遇到TextView，ImageView監聽點選事件，或是整個Layout來監聽點選事件。 這裡使用的是監聽器模式。

實際上，Button繼承自TextView。

Button，TextView背景設定

如何給按鈕增加動感?

Button 有按下(pressed)和未按下之分，我們可給這 2 種狀態不同的背景顏色和文字顏色。本文要介紹的是 selector，即狀態列表。 和前面的 shape 類似， selector也是一個xml檔案。

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="

設定Button背景

• 準備shape檔案

先準備shape檔案。這裡準備3個shape。分別代表3個不同的狀態。

shape_btn_1_normal.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="
    android:shape="rectangle">
    <solid android:color="#6CB3DD" />
    <corners android:radius="2dp" /></shape>

shape_btn_1_pressed.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="
    android:shape="rectangle">
    <solid android:color="#1E6283" />
    <corners android:radius="4dp" /></shape>

shape_btn_disable.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="
    android:shape="rectangle">
    <solid android:color="#6D6D6D" /></shape>

• 新建selector檔案

新建drawable檔案 bg_1.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android=">
    <item android:drawable="@drawable/shape_btn_disable" android:state_enabled="false" />
    <item android:drawable="@drawable/shape_btn_1_normal" android:state_enabled="true" android:state_pressed="false" />
    <item android:drawable="@drawable/shape_btn_1_pressed" android:state_enabled="true" android:state_pressed="true" /></selector>

• 設定Button背景

在layout中設定背景。

<Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/bg_1"
        android:text="RFDev btn 1" />
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="12dp"
        android:background="@drawable/bg_1"
        android:enabled="false"
        android:text="RFDev btn 2" />

執行一下看看效果。按下按鈕和沒按下的時候，按鈕的背景顏色是不同的。

selector介紹

StateListDrawable 是在 XML 檔案中定義的可繪製物件，它會根據物件狀態，使用多個不同的影像來表示同一個圖形。

例如，Button 微件可以是多種不同狀態（按下、聚焦或這兩種狀態都不是）中的其中一種，並且可利用狀態列表可繪製物件，為每種狀態提供不同的背景圖片。 可以在 XML 檔案中描述狀態列表。每個圖形由單一  <selector> 元素內的  <item> 元素表示。每個  <item> 均使用各種屬性來描述應用作可繪製物件的圖形的狀態。 在每個狀態變更期間，將從上到下遍歷狀態列表，並使用第一個與當前狀態匹配的專案 — 此選擇並非基於“最佳匹配”，而是選擇符合狀態最低條件的第一個專案。 selector指向的是StateListDrawable，這裡我們不關注StateListDrawable，只關注xml。

語法

參考如下語法:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="
    android:constantSize=["true" | "false"]
    android:dither=["true" | "false"]
    android:variablePadding=["true" | "false"] >
    <item
        android:drawable="@[package:]drawable/drawable_resource"
        android:state_pressed=["true" | "false"]
        android:state_focused=["true" | "false"]
        android:state_hovered=["true" | "false"]
        android:state_selected=["true" | "false"]
        android:state_checkable=["true" | "false"]
        android:state_checked=["true" | "false"]
        android:state_enabled=["true" | "false"]
        android:state_activated=["true" | "false"]
        android:state_window_focused=["true" | "false"] /></selector>

使用注意事項

我們可以給 Button 設定背景，也可以給 TextView 設定同樣的背景。

<TextView
        android:id="@+id/tv1"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="12dp"
        android:background="@drawable/bg_1"
        android:gravity="center"
        android:text="RFDev text view 1" />

bg_1中設定了 state_pressed的。 如果TextView沒有設定點選事件，使用者點選或按著這個TextView是不會發生背景變化的。 給TextView設定點選事件後，再點選就可以看到背景變化了。

本文我們用Button和TextView來做例子。實際上View的其它子類，比如ImageView，LinearLayout都可以用這種方式設定背景。