Android零基礎入門第19節：Button使用詳解

標籤：配置最佳化   使用者輸入   public   常用   override   str   listener   match   listen   

Button（按鈕）是Android開發中使用非常頻繁的組件，主要是在UI介面上產生一個按鈕，該按鈕可以供使用者單擊，當使用者單擊按鈕時，按鈕會觸發一個onClick點擊事件。

 

 一、Button簡介

Button使用起來比較容易，可以通過指定android:background 屬性為按鈕增加背景顏色或背景圖片，如果將背景圖片設為不規則的背景圖片，則可以開發出各種不規則形狀的按鈕。

如果只是使用普通的背景顏色或背景圖片，那麼這些背景是固定的，不會隨著使用者的動作而改變。如果需要讓按鈕的背景顏色、背景圖片隨使用者動作動態改變，則可以考慮使用自訂Drawable對象來實現，該部分內容會在進階開發部分進行詳細講解。

Button派生出來的子類主要有CheckBox、RadioButton、ToggleButton、Switch幾個，都可直接使用Button支援的各種屬性和方法，後續會進行學習。

 

 二、Button樣本

接下來通過一個簡單的樣本程式來學習Button的常見用法。

首先從網上下載兩張圖片素材，然後放到res/drawable/目錄下，在到res/layout/目錄下建立一個button_layout.xml檔案，然後在其中填充如下程式碼片段：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"              android:orientation="vertical"              android:layout_width="match_parent"              android:layout_height="match_parent">    <!-- 普通文字按鈕 -->    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="普通按鈕"        android:textSize="16sp"        android:textColor="#ff00ff"/>    <!-- 圖片按鈕-->    <Button        android:layout_width="80dp"        android:layout_height="80dp"        android:background="@drawable/play"  />    <!-- 帶文字的圖片按鈕-->    <Button        android:layout_width="80dp"        android:layout_height="80dp"        android:background="@drawable/button"        android:textSize="18sp"        android:text="開始"/>    </LinearLayout>

上介面布局中的第一個按鈕是一個普通按鈕；

第二個按鈕通過background屬性配置了背景圖片，因此該按鈕將會顯示為背景圖片形狀的按鈕；

第三個按鈕綜合了文字顯示和背景圖片，因此該按鈕將會顯示為背景圖片上帶文字的按鈕。

然後修改一下app/src/java/MainActivity.java檔案中載入的布局檔案為建立的button_layout.xml檔案。運行程式，可以看到所示介面效果。

通過上面的樣本，大體知道如何建立Button，那麼接下來通過一個綜合樣本來繼續學習如何使用Button和EditText這兩個組件。

 

 三、綜合樣本

到res/layout/目錄下建立一個login.xml檔案，然後在其中填充如下程式碼片段：

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"              android:orientation="vertical"              android:layout_width="match_parent"              android:layout_height="match_parent">    <TextView        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="使用者名稱:"        android:textSize="16sp"/>    <EditText        android:id="@+id/name_et"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:hint="請輸入使用者名稱" />    <TextView        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="密碼:"        android:textSize="16sp"/>    <EditText        android:id="@+id/pwd_et"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:hint="請輸入密碼"        android:inputType="textPassword"/>    <Button        android:id="@+id/login_btn"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="登入"/></LinearLayout>

然後修改一下app/src/java/MainActivity.java檔案中載入的布局檔案為建立的login.xml檔案。為了監聽登入按鈕的點擊事件，在Java代碼中為其添加點擊事件監聽器，具體代碼如下：

public class MainActivity extends AppCompatActivity {    private EditText mNameEt = null; // 使用者名稱輸入框    private EditText mPasswordEt = null; // 密碼輸入框    private Button mLoginBtn = null; // 登入按鈕    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.login);       // 擷取介面組件        mNameEt = (EditText) findViewById(R.id.name_et);        mPasswordEt = (EditText) findViewById(R.id.pwd_et);        mLoginBtn = (Button) findViewById(R.id.login_btn);        // 為登入按鈕綁定點擊事件        mLoginBtn.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View view) {                // 擷取使用者輸入的使用者名稱和密碼                String name = mNameEt.getText().toString();                String password = mPasswordEt.getText().toString();                // 訊息提示                Toast.makeText(MainActivity.this,                        "使用者名稱：" + name + "\n密碼：" + password, Toast.LENGTH_SHORT).show();            }        });    }}

 

上面的代碼採用匿名內部類方式為登入按鈕綁定點擊事件監聽器，在後續還會學到其他綁定監聽器的方法。

運行程式，分別在使用者名稱輸入框和密碼輸入框中輸入相應資訊，再點擊登入按鈕，可以看到所示介面效果。

到此，最常用的三個組件TextView、EditText和Button都已經學習完成，你都掌握了嗎？

 

------------------------------------------------

今天就先到這裡，下一期開始UI組件的學習。如果有問題歡迎留言一起探討，也歡迎加入Android零基礎入門技術討論群，共同成長！

往期總結分享：

Android零基礎入門第1節：Android的前世今生

Android零基礎入門第2節：Android 系統架構和應用組件那些事

Android零基礎入門第3節：帶你一起來聊一聊Android開發環境

Android零基礎入門第4節：正確安裝和配置JDK, 高富帥養成第一招

Android零基礎入門第5節：善用ADT Bundle, 輕鬆邂逅女神

Android零基礎入門第6節：配置最佳化SDK Manager, 正式約會女神

Android零基礎入門第7節：搞定Android模擬器，開啟甜蜜之旅

Android零基礎入門第8節：HelloWorld，我的第一趟旅程出發點

Android零基礎入門第9節：Android應用實戰，不懂代碼也可以開發

Android零基礎入門第10節：開發IDE大升級，終於迎來了Android Studio

Android零基礎入門第11節：簡單幾步帶你飛，運行Android Studio工程

Android零基礎入門第12節：熟悉Android Studio介面，開始裝逼賣萌

Android零基礎入門第13節：Android Studio配置最佳化，打造開發利器

Android零基礎入門第14節：使用高速Genymotion，跨入火箭時代

Android零基礎入門第15節：掌握Android Studio項目結構，揚帆起航

Android零基礎入門第16節：Android使用者介面開發概述

Android零基礎入門第17節：TextView屬性和方法大全

Android零基礎入門第18節：EditText的屬性和使用方法

此文章著作權為公眾號分享達人秀（ShareExpert）——鑫鱻所有，若轉載請備忘出處，特此聲明！

Android零基礎入門第19節：Button使用詳解