布局是一種可用于放置很多控件的容器,它可以按照一定的規律調整內部控件的位置,從而編寫出精美的界面。當然,布局的內部除了放置控件外,也可以放置布局,通過多層布局的嵌套,我們就能夠完成一些
比較復雜的界面實現,下圖很好地展示了它們之間的關系。
1 LinearLayout
LinearLayout 又稱作線性布局,是一種非常常用的布局。正如它名字所描述的一樣,這個布局會將它所包含的控件在線性方向上依次排列。
我們通過 android:orientation 屬性指定了排列方向是 vertical,如果指定的是 horizontal,控件就會在水平方向上排列了。
activity_main.xml 中的代碼,如下所示:
http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 1" />
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 2" />
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button 3" />
我 們 在 LinearLayout 中 添 加 了 三 個 Button , 每 個 Button 的 長 和 寬 都 是wrap_content,并指定了排列方向是vertical。現在運行一下程序,效果如下圖所示。
修改一下 LinearLayout 的排列方向,如下所示:
http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
??
將 android:orientation 屬性的值改成了 horizontal,這就意味著要讓 LinearLayout中的控件在水平方向上依次排列,當然如果不指定 android:orientation 屬性的值,默認的排列方向就是 horizontal。重新運行一下程序,效果如下圖所示。
這里需要注意,如果 LinearLayout 的排列方向是 horizontal,內部的控件就絕對不能將寬度指定為 match_parent,因為這樣的話單獨一個控件就會將整個水平方向占滿,其他的控件就沒有可放置的位置了。同樣的道理,如果 LinearLayout 的排列方向是 vertical,內部的控件就不能將高度指定為 match_parent。
幾個關鍵屬性
android:gravity是用于指定文字在控件中的對齊方式
android:layout_gravity是用于指定控件在布局中的對齊方式
android:layout_weight 這個屬性允許我們使用比例的方式來指定控件的大小,它在手機屏幕的適配性方面可以起到非常重要的作用。
我們還可以通過指定部分控件的layout_weight值,來實現更好的效果。修改activity_main.xml 中的代碼,如下所示:
http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
android:id="@+id/input_message"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="Type something"
/>
android:id="@+id/send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Send"
/>
這里我們僅指定了 EditText 的 android:layout_weight 屬性,并將 Button 的寬度改回 wrap_content。這表示 Button 的寬度仍然按照 wrap_content 來計算,而 EditText則會占滿屏幕所有的剩余空間。使用這種方式編寫的界面,不僅在各種屏幕的適配方面會非常好,而且看起來也更加舒服,重新運行程序,效果如圖所示。
2RelativeLayout 又稱作相對布局
RelativeLayout 又稱作相對布局,也是一種非常常用的布局。和 LinearLayout 的排列規則不同,RelativeLayout 顯得更加隨意一些,它可以通過相對定位的方式讓控件出現在布局的任何位置。
android:layout_alignParentLeft
android:layout_alignParentTop
android:layout_alignParentRight
android:layout_alignParentBottom
android:layout_centerInParent
android:layout_alignLeft表示讓一個控件的左邊緣和另一個控件的左邊緣對齊
android:layout_alignRight表示讓一個控件的右邊緣和另一個控件的右邊緣對齊
android:layout_alignTop
android:layout_ alignBottom
activity_main.xml 中的代碼,如下所示:
http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="Button 1" />
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Button 2" />
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Button 3" />
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="Button 4" />
android:id="@+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="Button 5" />
我們讓 Button 1和父布局的左上角對齊,Button 2 和父布局的右上角對齊,Button 3 居中顯示,Button 4
和父布局的左下角對 齊,Button5和父布局的右下角對齊 。
上面例子中的每個控件都是相對于父布局進行定位的,那控件可不可以相對于控件進行定位呢?當然是可以的,修改 activity_main.xml 中的代碼,如下所示:
http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Button 3" />
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/button3"
android:layout_toLeftOf="@id/button3"
android:text="Button 1" />
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/button3"
android:layout_toRightOf="@id/button3"
android:text="Button 2" />
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/button3"
android:layout_toLeftOf="@id/button3"
android:text="Button 4" />
android:id="@+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/button3"
android:layout_toRightOf="@id/button3"
android:text="Button 5" />
次的代碼稍微復雜一點,不過仍然是有規律可循的。android:layout_above 屬性可以讓一個控件位于另一個控件的上方,需要為這個屬性指定相對控件 id 的引用,這里我們填入了@id/button3,表示讓該控件位于 Button 3 的上方。其他的屬性也都是相似的,android:layout_below 表 示 讓一個控件位于另一個控件的下方 ,android:layout_toLeftOf 表示讓一個控件位于另一個控件的左側,android:layout_toRightOf 表示讓一個控件位于另一個控件的右側。注意,當一個控件去引用另一個控件的 id 時,該控件一定要定義在引用控件的后面,不然會出現找不到 id 的情況。
3 FrameLayout
FrameLayout 相比于前面兩種布局就簡單太多了,因此它的應用場景也少了很多。這
種布局沒有任何的定位方式,所有的控件都會擺放在布局的左上角。
4TableLayout
TableLayout 允許我們使用表格的方式來排列控件,這種布局也不是很常用,你只需要了解一下它的基本用法就可以了。既然是表格,那就一定會有行和列,在設計表格時我們盡量應該讓每一行都擁有相同的列數,這樣的表格也是最簡單的。不過有時候事情并非總會順從我們的心意,當表格的某行一定要有不相等的列數時,就需要通過合并單元格的方式來應對。
5AbsoluteLayout
Android 中其實還有一個 AbsoluteLayout,不過這個布局官方已經不推薦使用了