[Android] layout_weight的妙用-讓View的大小以百分比率顯示(proportionate size)

Android所有的視覺物件(View)都是透過指定其layout_width、layout_height屬性來改變顯示大小，除了指定明確的數值外，另外還有特殊參數可以在特定需求下使用，例如，match_parent即填滿其父容器、wrap_content則根據其內容大小進行動態調整。

layout_width, layout_height並不支援百分比數值

有很多程式語言都可指定長寬一個百分比數值，讓其長寬以特定比例顯示，很遺憾Android的長寬屬性並無法透過指定百分比數值使其以特定比例顯示，但我相信對於需要開發適用於各種螢幕大小Application的程式設計者來說，長寬以百分比顯示這個功能是非常重要的。


以註冊功能為例，假設有個表單要讓使用者輸入，為了介面美觀考量總希望可以以滿版的形式呈現，雖然可以透過指定明確數值使其填滿介面，但因為Android的螢幕大小種類實在太多，以明確數值的方式絕對無法確保介面的一致性，例如下圖將表單放到螢幕較大的Device，就會發生介面留白過多的情況，如果介面大小可以以百分比的方式呈現，相信可以減少介面不一致的情況發生。

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout 
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
>" 
  <TextView
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:text="姓名："
  />
  <EditText
     android:layout_width="fill_parent"
     android:layout_height="50dp"
  />
  <TextView
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:text="電話："
  />
  <EditText
     android:layout_width="fill_parent"
     android:layout_height="50dp"
  />
  <TextView
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:text="住址："
  />
  <EditText
     android:layout_width="fill_parent"
     android:layout_height="50dp"
  />
  <TextView
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:text="備註："
  />
  <EditText
     android:layout_width="fill_parent"
     android:layout_height="100dp"
  />
</LinearLayout>

layout_weight讓View的大小以百分比顯示

Linear layout提供了layout_weight屬性，讓其所有的子顯示物件可以透過設定該屬性來表明自己的重要性，這個重要權值主要影響的就是當linear layout中所有有定義明確長寬的物件都擺好之後，剩下的空間該如何分配給有宣告layout_weight屬性的物件，使所有剩下空間被填滿。

剩下空間的分配其實很簡單，weight權值愈高代表愈重要，因此剩下的空間會以權值比來分配，以下圖為例，假設剩下空間有三個View(A、B、C)要分配，其權值大小分別為3、1、1，因此它們所分配到的空間大小將會是3:1:1。

透過這樣的性質，你就可以針對自己開發的需求讓某些介面元件以百分比大小呈現，以維持介面的一致性，以上面的例子來說，將其以layout_weight的方式，將會有較好的呈現效果(下圖)。

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout 
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
>" 
  <TextView
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:text="姓名："
  />
  <EditText
     android:layout_width="fill_parent"
     android:layout_height="0dp"
     android:layout_weight="1"
  />
  <TextView
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:text="電話："
  />
  <EditText
     android:layout_width="fill_parent"
     android:layout_height="0dp"
     android:layout_weight="1"
  />
  <TextView
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:text="住址："
  />
  <EditText
     android:layout_width="fill_parent"
     android:layout_height="0dp"
     android:layout_weight="1"
  />
  <TextView
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:text="備註："
  />
  <EditText
     android:layout_width="fill_parent"
     android:layout_height="0dp"
     android:layout_weight="2"
  />
</LinearLayout>