Android UI之android:layout_weight屬性以及控件的比例控制

　　這兩天在做一個Android界面的時候采用了linearlayout線性布局，並在其中放置了textview控件，設置android:layout_width屬性為wrap_content時，eclipse提示說這里使用0dp取代wrap_content能獲得更好的體驗，頓時產生了好奇，為什么使用0dp會更好？於是探究了一番，網上已有相關的文章，學習之后作了一個總結。

　　首先解釋一下Android：layout_weight屬性的作用，其實簡單理解就是用來分配空間大小，至於怎么分配，分配的是哪些空間，請接着看......

　　當我們使用linearlayout線性布局，放置三個textview空間，設置android:layout_width屬性為wrap_content，並分別設置android:layout_weight比重為1，2，3時：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#990033"
        android:text="1" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:background="#339933"
        android:text="2" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="3"
        android:background="#0000CC"
        android:text="3" />

</LinearLayout>

　　ui效果：

　　

　　可以看到三個textview所占的寬度比為1:2:3，似乎時根據我們所設置的android:layout_width比重實現了比例控制，然而，當我們試着把textview1的文本內容修改為111111111時，

 <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#990033"
        android:text="111111111" />

將會出現這樣的ui效果：

　　

　　原有的比例平衡被打破了，現在三個textview的寬度比不再是1:2:3。為什么呢？因為layout_width屬性並不對整個可用空間進行分配，而是對剩余空間進行分配，也就是說系統會先按layout_width設置的屬性先給控件分配空間，在這里的代碼里是先分配空間使得每個控件足以包裹住內容，再將剩余的內容按layout_weight所設置的比例進行分配，控件最終的空間大小是layout_width屬性設置的空間大小加上按比例分得的剩余空間大小，你細心觀察將可以發現，上圖UI中除去內容之外的控件還是1:2:3。

　　這時候我們按照eclipse的建議把layout_width的屬性改為0dp試試：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#990033"
        android:text="111111111" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:background="#339933"
        android:text="2" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="3"
        android:background="#0000CC"
        android:text="3" />

</LinearLayout>

　　這時的UI效果是：

　　

　　此時我們發現三個textview的寬度比例就是我們所設置的layout_weight屬性比例，為什么？相信你已經會算了，剩余空間＝parent空間－layout_width設置的空間大小，這里被減數被我們設置為0，於是剩余空間就是parent空間，和內容無關了。

　　我們再來看一個更好玩的，將layout_width設置為match_parent屬性，再將三個控件比例設置為1:2:2:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#990033"
        android:text="1" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:background="#339933"
        android:text="2" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:background="#0000CC"
        android:text="2" />

</LinearLayout>

　　這時的UI效果應該會讓你吃驚：

　　

　　不是說好按比例控制的嗎？為什么textview1所占的比例為1，確比占比為2的控件獲得的空間更大的呢？

　　我們來用剛剛的公式好好算算：

　　剩余空間，是用父控件的大小也就是1個parent減去layout_width所設置的屬性大小，每個控件原本的大小都設置為match_parent，也就是每個控件原本就應該獲得1個parent控件的大小，這里有3個textview控件，也就是剩余空間的大小＝1個parent-3個parent大小＝－2個parent，於是textview1的大小＝原來的大小1個parent＋分配的剩余空間大小就是（－2parent）＊1/5，最后等於3/5個parent，而其余的兩個控件可以算出是1/5個parent，所以比例是3:1:1。

 

　　參考文章：http://blog.csdn.net/xiechengfa/article/details/38334327