android LinearLayout佈局巢狀覆蓋問題
在做android UI佈局時,用了LinearLayout巢狀,發現效果並不如我預料一般
查了下資料,說是要設定layout_weight屬性
資料說得不是很清楚,也沒仔細看,就去弄,結果越弄越混亂。
於是靜下心來,自己寫xml測試,發現如下。
我用eclipse開發,用android Common XML Editor 使用快捷鍵alt+/
一、如果LinearLayout是最外面的一層,它是不會彈出layout_weight屬性的
換句話說最外層不能用layout_weight
二、xml佈局如下
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="vertical"> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="zzzzzzzzzzzzzzzzzzzzzzzzzzzzz" android:textSize="18sp" android:layout_marginLeft="5px" android:layout_marginBottom="10px" android:textColor="@android:color/darker_gray" /> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="xxxxxxxxxxxxxxxxxxxxxxx" android:layout_marginLeft="50px" android:layout_marginBottom="10px" android:textSize="18sp" /> </LinearLayout> </LinearLayout>
這個能正常顯示,但當我們把巢狀的LinearLayout方向設定成水平,第一個TextView充滿整個LinearLayout,第二個TextView控制元件不顯示。
當我們為兩個TextView加上 android:layout_weight="1"屬性時,能顯示,效果我就不說了,大家都懂的。
發現一個有趣的現象:我們將 兩個控制元件的android:layout_weight="1"刪掉,巢狀的LinearLayout方向屬性刪掉,程式碼和最開始一樣
注意,我們前面說上面的xml它能正常顯示,現在,一模一樣的xml程式碼則顯示錯誤。
當我們只設置一個控制元件的android:layout_weight="1"屬性時,發現也會有顯示錯誤
ps:我只是用視覺化工具看了一下 ,並未編譯,說出來,只是告訴大家不要被它的視覺化效果誤導(目測是工具的原因)。至於編譯後會如何顯示,這個有興趣的可以去看下。我說的顯示錯誤並不是說檔案有錯誤,只是在說沒有達到我想要的效果(都顯示出來)。
二、上面中只是一個LinearLayout巢狀一個LinearLayout,如果是巢狀兩個LinearLayout呢,那麼我們不僅要設定每個Linearlayout的裡面控制元件的權(layout_weight)屬性,還要設定巢狀的LinearLayout的權屬性
三、有了上面的知識,我於是將我專案的佈局弄出來,結果心中信念瞬間崩塌,上段程式碼:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginLeft="50px"
android:layout_marginRight="50px"
android:layout_marginBottom="15px">
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="姓名"
android:layout_weight="5"
android:textSize="18sp"/>
<EditText android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/name"
android:hint="請輸入您的姓名"
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginLeft="50px"
android:layout_marginRight="50px"
android:layout_marginBottom="15px">
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="年齡"
android:layout_weight="5"
android:textSize="18sp"/>
<EditText android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/age"
android:hint="請輸入您的年齡"
android:layout_weight="1"/>
</LinearLayout>
</LinearLayout>
效果圖:
這完全顛覆了我第二點的結論,淚奔.......我發誓,第二個結論我也做了好幾次測試才得出的結論
總結,如果佈局中用到LinearLayout巢狀,那麼你注意設定它的layout_weight 視覺化工具有點扯蛋 慢慢除錯吧
另附我的專案佈局的一點經驗
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginLeft="50px"
android:layout_marginRight="50px"
android:layout_marginBottom="15px"
android:layout_gravity="center"
android:gravity="center">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="性別"
android:textSize="18sp"
android:layout_weight="3"/>
<RadioGroup android:id="@+id/radioGroup"
android:contentDescription="性別"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="1">
<RadioButton android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/radioMale"
android:text="男"
android:checked="true"
android:layout_marginRight="15px"
android:textSize="18sp">
</RadioButton>
<RadioButton android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/radioFemale"
android:text="女"
android:textSize="18sp">
</RadioButton>
</RadioGroup>
</LinearLayout>
</LinearLayout>
開始時RadioGroup的layout_width="wrap_content",怎麼設定權都達不到想要的效果。要改成fill_parent
RadioButton的尺寸比TextView大 所以顯示時TextView在上方,設定LinearLayout中android:gravity="center">即可