Android學習筆記之UI開發

（學習參考書：第一行代碼第2版）

一、所有控制元件適用的屬性

android:id 給當前控制定義一個唯一的識別符號
android:text 控制元件上顯示的內容
android:layout_width 所有Android控制元件的共有屬性，指定控制元件的寬度
android:layout_height 所有Android控制元件的共有屬性，指定控制元件的高度

寬度和高度的可選值有兩種：
match_parent 當前的控制元件的大小與父布局的大小相同（鋪滿）
warp_content 當前控制元件大小剛好包括自己所含的內容（自適應）
除此之外，可以對控制元件指定寬和高，但是容易在不同設備上出現適配問題

android:visibility 所有Android控制元件的共有屬性，指定控制元件是否可見；可選值有三種：
visible 表示控制元件可見，為默認屬性，
invisible 表示控制元件不可見，但是它仍然占據原來的位置和大小，可以理解為透明狀態，
gone 表示控制元件不僅不可見，還不再占用任何螢屏空間
控制元件的可見性還可以在Java代碼中通過setVisibility()方法控制，傳入View.VISIBLE、View.INVISIBLE、View.GONE三種值，

二、常用控制元件及其適用方法

（1）TextView
文本框，用于在界面上顯示一段文本資訊，

android:gravity指定文字的對齊方式，可選值有top、bottom、left、right、center等，可以使用|間隔來同時指定多個值，
android:textSize 指定文字的大小，Android重字體大小使用sp作為單位
android:textColor 指定該文字的顏色

（2）Button
按鈕，可以注冊監聽器回應點擊事件；是與用戶互動的一個重要的控制元件

android:textAllCaps=”false”可以關閉默認的大寫鎖定
通過呼叫setOnClickListener(new View.OnClickListener)方法實作匿名類然后重寫onClick方法便可以決定點擊該按鈕觸發的事件，也可以通過實作介面View.OnClickListener的方式進行注冊，

（3）EditText
編輯框，和用戶進行互動的一個重要組件，允許用戶在組件里輸入和編輯內容，并且程式對這些內容進行處理，

android:hint 編輯框的提示性文字，一經輸入便消失
android:maxLines 決定編輯框隨著文字的增多拉長的最大行數
通過editView.getText().toString()方法可以獲取編輯框的內容

（4）ImageView
在界面上用于展示圖片的一個控制元件，使用該控制元件需要在res/drawable目錄下存放圖片

android:src指定drawable目錄下的圖片，
通過imageView.setImageResource(R.drawable.name)方法可以修改圖片
android:clickable 設定為true后，該圖片能回應點擊事件，

（5）ProgressBar
該控制元件用于在界面上顯示一個進度條，表示是我們的程式正在加載一些資料，
ProgressBar可以設定不同的樣式，默認為圓形；通過style屬性可以將其設定為水平進度條，

style=”?android:attr/progressBarStyleHorizontal” //水平進度條
android:max=”100” //滿進度為100

（6）AlertDialog
在當前界面彈出對話框，該對話框置頂于所有界面元素之上，能夠屏蔽掉其他控制元件的互動能力，因此AlertDialog常用于提示重要的內容或者警告資訊，使用方法如下：

• 首先使用AlertDialog.Builder創建一個AlertDialog的實體
• 然后為這個對話框設定標題、內容、可否用back鍵關閉對話框
• 呼叫setPositiveButton()方法設定對話框的確定按鈕的點擊事件
• 呼叫setNegativeButton()方法設定對話框的取消按鈕的點擊事件
• 最后呼叫show()方法將對話框顯示出來

（7）ProgressDialog
在界面彈出一個對話框，并且屏蔽掉其他控制元件的互動能力，但是ProgressDialog區別于AlertDialog的是會在對話框中顯示一個進度條，
操作方式與AlertDialog類似，

三、五種基本布局

布局可以使界面內的多個控制元件美觀的排布到布局上，并且通過多層布局的嵌套可以實作復雜的界面，
（1）線性布局LinearLayout
該布局會將它所包含的控制元件在線性方向上依次排列

android:orientation 指定排列方向vertical（豎直），horizontal（水平）
注意，如果LinearLayout的排列方向是horizontal，那么控制元件的寬不能設定為match_parent；同理，vertical時高度不能設定為match_parent，

android:layout_gravity 用于指定控制元件在布局中的對齊方式，當為horizontal時，只有垂直方向上的對齊方式才會生效；vertical時，水平方向上的對齊方式才會生效，

android:layout_weight 允許使用比例的方式指定控制元件的大小，適配型很強，引號中寫數字，最后該控制元件所占比例即為本數字/總數字

android:layout_marginTop 與上邊界隔開一定的距離

（2）相對布局RelativeLayout
通過相對定位的方式讓控制元件出現在布局的任何位置，常用屬性：

android:layout_alignParentLeft 設定為true時，控制元件位于左
android:layout_alignParentRight 設定為true時，控制元件位于右
android:layout_alignParentTop 設定為true時，控制元件位于頂
android:layout_alignParentBotton 設定為true時，控制元件位于底
android:layout_centerInParent 設定為true時，控制元件位于中
android:layout_above 設定為其他控制元件id，位于其上方
android:layout_below設定為其他控制元件id，位于其下方
android:layout_toLeftOf設定為其他控制元件id，位于其左方
android:layout_toRightOf設定為其他控制元件id，位于其右方

（3）幀布局FrameLayout
所有控制元件都默認設定在布局的左上角，按照先后順序覆寫，可以通過

android:layout_gravity指定對齊方式，

（4）百分比布局
百分比布局是對幀布局和相對布局的優化，分為PercentFrameLayout和PercentRelativeLayout兩種，通過直接指定控制元件在布局中的百分比，達到任意比例分割布局的目的，
百分比是新增布局，為了讓其在所有Android版本上使用，需要在app/build.gradle檔案的dependencies閉包下添加：

implementation ‘androidx.percentlayout.percentlayout:1.0.0’

百分比布局不是內置在SDK當中的，所以是使用時需要寫出完整包路徑且定義一個app的命名空間：

androidx.percentlayout.widget.PercentFrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"

app:layout_widthPercent 將控制元件的寬度指定為布局的n%
app:layout_heightPercent 將空間的高度指定為布局的n%

百分比布局會繼承原布局的特性，

（5）約束布局ConstraintLayout
官方推薦的，默認的布局方式，采用可視化拖拽組件的形式在界面上布局，
控制元件和容器、控制元件和控制元件之間可以添加約束，實作相對定位，

Autoconnect 可以根據拖放控制元件的狀態自動判斷如何添加約束，但只局限于當前的對單個控制元件的操作
Inference 把所有控制元件拖放好后，一鍵添加他們之間的約束關系

四、創建自定義控制元件

所有的空間都是直接或間接的繼承自View，所用的布局都是直接或間接的繼承自ViewGroup，View是Android中最基本的一種UI組件，它可以在螢屏上繪制一塊矩形區域，并能回應這塊區域的各種事件，

（1）引入布局
如果直接在res/layout下創建的布局檔案，可以在對應活動的布局檔案中引入：

<include layout=”@layout/name”/>

使用這種方式，不管有多少布局需要添加標題欄，只需一行include陳述句就可以了，

隱藏系統自帶標題欄的方法：

ActionBar actionBar = getSupportActionBar();
actionBar.hide();

（2）創建自定義控制元件
創建自定義控制元件的步驟：

1. 新建一個Java類，讓其繼承自定義控制元件的布局型別，
2. 首先重寫繼承的類的建構式，然后在建構式中實作需要對自定義控制元件布局的動態加載的方法：LayoutInflater，
3. LayoutInflater的from()方法可以構建一個LayoutInflater物件，然后呼叫inflate()方法就可以動態加載一個布局檔案，該方法接受兩個引數：第一個是布局檔案的id，第二個是給加載好的布局添加一個父布局，

使用自定義控制元件的步驟：
在需要添加該控制元件的活動的布局檔案中指明控制元件的完整類名，包名不可省略，其余跟添加普通控制元件一樣，

五、ListView控制元件

ListView是Android中最常用的控制元件，幾乎所有的應用程式都會用到它，當程式中有大量的資料需要展示的時候，就可以借助ListView來實作，ListView允許用戶通過手指上下滑動的方式將螢屏外的資料滾動到螢屏內，同時螢屏上原有的資料會滾出螢屏，

（1）ListView的簡單用法

1. 在布局中添加ListView控制元件時只需先指定一個id，然后將寬度和高端全設定為match_parent，讓其占滿整個布局的空間，
2. 資料無法直接傳遞給ListView，需要借助配接器來完成（例如ArrayAdapter），ArrayAdapter通過泛型指定適配的資料型別，然后在建構式中把要適配的資料傳入，
3. 最后呼叫ListView的setAdapter()方法，將創建好的配接器物件傳遞進去，如此一來，ListView和資料的關聯就建立起來了，

（2）定制ListView的界面

1. 定義一個物體類，作為ListView配接器的適配型別，
2. 然后為ListView的子項定義一個自定義布局，新建layout
3. 創建一個自定義的配接器，配接器可繼承ArrayAdapter，并將泛型設定為第一步定義的物體類，在該類中重寫父類的建構式和getView()方法，
   getView() 該方法在每個子類被滾動到螢屏內時會被呼叫，在該方法中通過getItem()獲得自定義物體類的實體，然后使用LayoutInflater來為這個子項加載布局，
4. 然后使用相同方法創建配接器，傳入對應引數，傳遞資料，

（3）提升ListView的運行效率
因為在FruitAdapter的getView()方法中，每次都將布局重新加載了一遍，當ListView快速滾動時，會成為性能的瓶頸，
getView()方法中還有一個convertView引數，這個引數用于將之前加載好的布局進行快取，以便以后可以重用，
將重寫的getView方法中的獲取view的方式改為：

View view;
if(convertView==null){
    view = LayoutInflater.from(getContext()).inflate(resourceId,parent,false);
}else{
    view = convertView;
}

即可大大提高ListView的運行效率，當前的代碼還可以通過新增一個內部類ViewHolder用于對控制元件的實體的快取，用View的setTag()和getTag()方法將ViewHolder存取在View中，這樣就沒有必要每次通過findViewById()方法來獲取控制元件實體了，

（4）ListView的點擊事件
在活動中呼叫ListView物件的setOnItemClickListener方法，并在該方法引數表中新建內部類AdapterView.OnItemClickListener()重寫其onItemClick方法，回應相應點擊事件，

六、RecyclerView控制元件

Android提供了一個更強大的滾動控制元件RecyclerView，不僅可以實作ListView的效果，還優化了很多不足，
（1）RecyclerView基本用法

1. 在布局中加入RecyclerView控制元件，指定一個id，寬度和高度都設為match_parent，
2. 為RecyclerView準備一個配接器，新建一個類繼承RecyclerView.Adapter，并將泛型指定為新建類名.ViewHolder，ViewHolder是在該類中定義的內部類，
3. 繼承的RecyclerView.Adapter，就必須重寫三個方法：

onCreateViewHolder() 用于創建ViewHolder實體，在這個方法中加載RecyclerView的子布局，回傳加載了布局的ViewHolder

onBindViewHolder() 用于對RecyclerView的子項的資料進行賦值的，會在每個子項滾動到螢屏內時呼叫，通過position引數得到當前項的新建類實體，然后再將資料設定到ViewHolder的引數中

getItemCount() 用于告訴RecyclerView有多少子項，回傳資料源的長度

4. 在活動中創建一個LinearLayoutManager物件，用于指定RecyclerView的布局方式，然后讓RecyclerView呼叫setLayoutManager方法傳入LinearLayoutManager引數即可，

（2）實作橫向滾動
如果要實作橫向滾動，子項的布局應該設為垂直排列，在活動中呼叫LinearLayoutManager物件的setOrientation()方法來設定布局的排列方向，默認為縱向，傳入引數LinearLayoutManager.HORIZONTAL更改為橫行排列，
除了LinearLayoutManager布局排列之外，RecyclerView還提供了GirdLayoutManager（網格布局）和StaggeredGirdLayoutManager（瀑布布局）兩種內置布局排列方式，

（3）RecyclerView的點擊事件
RecyclerView在onCreateViewHolder()方法中實作點擊事件即可，RecyclerView可以實作子項中的任意控制元件或布局的點擊事件，