Android:日常學習筆記(7)———探究UI開發(4)

UI概述

View 和 ViewGrou

　　Android 應用中的所有用戶界面元素都是使用 View 和 ViewGroup 對象構建而成。View 對象用於在屏幕上繪制可供用戶交互的內容。ViewGroup 對象用於儲存其他 View（和 ViewGroup）對象，以便定義界面的布局。

說明：

　　View是安卓中最基本的一種UI，它可以在屏幕上繪制一塊矩形區域，並能響應這塊區域的各種事件，我們使用的各種控件都是在View的基礎上進行的添加和完善。ViewGroup則是一種特殊的View，他可以包含很多View和子ViewGroup，是一個用於放置控件和布局的容器。

引入布局

　　比如現在我們要替換系統默認的標題欄，改為如下所示：

　　即兩邊是兩個按鈕，中間是標題文字，XML配置文件如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
 
>
    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:src="@drawable/previous_24px"
        />
    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
 

        android:layout_gravity="center"
        android:layout_weight="1"
        android:gravity="center"
        android:text="我是標題文字"
        android:textColor="#fff"
        android:textSize="24sp" />
    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/next_24px"
        />
</LinearLayout>

　　我們面臨一個問題，我們要讓所有的活動頁面都采用這個標題欄該怎麽做呢？

　　 我們可以單獨將這個標題欄寫到一個XML文件中，然後在其他任意使用此標題欄的活動的布局文件中引入此XML即可。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <include layout="@layout/panel_title"/>
</LinearLayout>

創建自定義控件

說明：

　　引入布局的技巧的確實解決了重復編寫布局代碼的問題，但是如果布局中的一些控件要求能夠響應事件，我們還是需要在每個活動中為這些控件單獨編寫一次事件註冊的代碼，比如標題欄中的返回按鈕，都是銷毀當前活動。為了避免重復代碼，我們可以使用自定義控件的方式來解決。

代碼：

　　1.新建TitleLayout(繼承自LinearLayout)

public class TitleLayout extends LinearLayout {
    public TitleLayout(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.panel_title,this);
    }
}

說明：

　　　　首先我們重寫了LinerLayout的構造函數，在布局中引入TitleLayout控件就會調用這個構造函數。然後在構造函數中對標題欄布局進行動態加載，這就需要用到LayoutInflater了。通過LayoutInflater的form()方法可以構建出一個LayoutInflater對象，然後調用Inflate()就可以動態加載一個布局文件。

　　inflate接受兩個參數:

• 　　第一個是布局文件的ID
• 　　第二個參數是給加載好的布局再添加一個父布局，此處為this

　　2.為按鈕綁定事件

public class TitleLayout extends LinearLayout {
    public TitleLayout(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.panel_title,this);
        ImageButton titleBack = (ImageButton) findViewById(R.id.title_back);
        titleBack.setOnClickListener(new OnClickListener() {
            public void onClick(View v) {
                Toast.makeText(getContext(),"活動銷毀",Toast.LENGTH_LONG).show();
            }
        });
    }
}

　　3.在布局文件中添加這個自定義控件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <com.example.zy.dealhelper.TitleLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>
</LinearLayout>

說明：

　　添加自定義控件和添加普通控件的方式基本一樣，只不過在添加自定義控件的時候需要指明控件的具體類名。

Android:日常學習筆記(7)———探究UI開發(4)