《Android實戰(zhàn)基礎教程》課件第二章

目錄2.1線性布局2.2相對布局

2.3表格布局

2.4幀布局2.5Android常見顯示單位布局二、布局

線性布局分為垂直線性布局和水平線性布局。LinearLayout是線性布局控件，它包含的子控件將以橫向或豎向的方式按照相對位置來排列所有的widgets或者其他的containers，超過邊界時，某些控件將缺失或消失。因此一個垂直列表的每一行只會有一個widget或者是container，而不管他們有多寬；而一個水平列表將會只有一個行高(高度為最高子控件的高度加上邊框高度)。LinearLayout保持其所包含的widgets或者是containers之間的間隔以及對齊方式(相對一個控件的右對齊、中間對齊或者左對齊)。2.1線性布局二、布局

LinearLayout屬性如下：android:orientation：定義布局的方向——水平或垂直。android:layout_weight：子元素對未占用空間【水平或垂直】分配權重值，其值越小，權重越大。android:layout_width：寬度(fill_parent:父元素決定，wrap_content:本身的內(nèi)容決定)。android:layout_height：高度(直接指定一個px值)。android:gravity：內(nèi)容的排列形式(常用

top,bottom,left,right,center)。二、布局

根據(jù)一個實例來了解線性布局。

新建項目MyLayout，在activity_main中添加4個按鈕，代碼如下：activity_main.xml文件：代碼MainActivity文件：代碼

啟動模擬器，運行結(jié)果如圖2.1所示。圖2.1二、布局

RelativeLayout稱為相對布局，可以通過相對的定位方式讓控件出現(xiàn)在布局的任何位置。RelativeLayout的屬性：Android:ignoregravity：設置哪個組件不受gravity屬性的影響。

2.2相對布局二、布局1)屬性值為具體像素值的屬性android:layout_marginBottom：離某元素底邊緣的距離。android:layout_marginLeft：離某元素左邊緣的距離。android:layout_marginRight：離某元素右邊緣的距離。android:layout_marginTop：離某元素上邊緣的距離。二、布局2)屬性值為true或是false的屬性android:layout_alignParentBottom：控制該組件是否和布局管理器底端對齊。android:layout_alignParentLeft：控制該組件是否和布局管理器左邊對齊。android:layout_alignParentRight：控制該組件是否和布局管理器右邊對齊。android:layout_alignParentTop：控制該組件是否和布局管理器頂部對齊。二、布局

3)屬性值為其他組件ID的屬性android:layout_toLeftOf：本組件在某組件的左邊。android:layout_toRightOf：本組件在某組件的右邊。android:layout_above：本組件在某組件的上方。android:layout_below：本組件在某組件的下方。二、布局

以一個項目為例來講述相對布局的屬性。

創(chuàng)建項目MyRelativeLayout，修改activity_main.xml的代碼(添加五個按鈕控件)。activity_main.xml文件：代碼

MainActivity文件：代碼

運行模擬器，結(jié)果如圖2.2所示。圖2.2二、布局

表格布局(TableLayout)即排成行和列的布局。一個TableLayout由若干TableRow組成，TableRow定義了一行。TableLayout容器不顯示行、列或單元格邊框線。每行有零個或多個單元格，每個單元格可容納一個視圖對象。

列的寬度是由該列中最寬的單元格決定的，通過調(diào)用setcolumnshrinkable()或setcolumnstretchable()，一個TableLayout可以指定某些列為收縮或伸展的。2.3表格布局二、布局TableLayout的子類不能指定寬度屬性，寬度總是match_parent。而layout_height屬性可以通過它的子控件來設置，默認值是wrap_content。如果子控件是個TableRow，那么它的高度總是wrap_content。

必須將單元格添加到遞增列順序中，無論是在代碼或XML中。默認列數(shù)為零。如果你不指定一個孩子單元格列數(shù)，它將自動遞增到下一個可用的列。如果你跳過了一個列號，它就會被認為是一個空單元格。二、布局。屬性名相關方法描

述android:collapseColumnssetColumnCollapsed(int,boolean)設置需要隱藏的列android:shrinkColumnssetShrinkAllColumns(boolean)設置允許收縮的列android:stretchColumnssetStretchAllColumns(boolean)設置允許拉伸的列表2.1表格布局的XML屬性二、布局表格布局案例:布局文件：activity_main.xml文件：代碼使用Activity顯示該布局，得到如圖2.3所示效果。圖2.3二、布局

幀布局是指在屏幕的一塊區(qū)域中顯示單獨的一個元素。幀布局是最簡單的布局形式。所有添加到這個布局中的視圖都以層疊的方式顯示。第一個添加的控件被放在最底層，最后一個添加到框架布局中的視圖顯示在最頂層，上一層的控件會覆蓋下一層的控件。這種顯示方式有些類似于堆棧。

2.4幀布局二、布局

當我們往幀布局中添加組件的時候，所有的組件都會放置于這塊區(qū)域的左上角；幀布局的大小由子控件中最大的子控件決定；如果組件大小相同，同一時刻就只能看到最上面的那個組件。當然我們也可以為組件添加layout_gravity屬性，從而制定組件的對齊方式。屬性名相關方法描

述android:foregroundsetForeground(Drawable)設置前景圖像android:foregroundGravitysetForegroundGravity(int)定義繪制前景圖像的gravity屬性android:measureAllChildrensetMeasureAllChildren(boolean)決定是否測量所有子類或只是那些在可見或不可見狀態(tài)時測量表2.2幀布局的XML屬性二、布局幀布局案例：布局文件：activity_main.xml文件：代碼使用FrameLayout布局，得到如圖2.4所示效果。圖2.4二、布局1．像素px(pixels)px是像素的意思，即屏幕中可以顯示的最小元素單位。Android應用程序中任何可見的圖像都是由一個個像素點組成的。目前HVGA代表320×480像素。

一個組件的不同像素，在分辨率不同的手機上顯示的效果是不同的。低分辨率的手機，圖像看起來比較大；高分辨率手機，圖像看起來比較小，用戶體驗不同。

2.5Android常見顯示單位二、布局2．設備獨立像素dip或dp(deviceindependentpixels)dip和設備硬件有關，不依賴像素。一般為了支持WVGA、HVGA和QVGA，推薦使用這種顯示方式。

這里要特別注意，dip與屏幕密度有關，而屏幕密度又與具體的硬件有關，硬件設置不正確，有可能導致dip不能正常顯示。在屏幕密度為160的顯示屏上，1dip=1px，如果屏幕分辨率很高，如480×800，但是屏幕密度沒有正確設置，比如說還是160，那么此時凡是使用dip的都會顯示異常，普遍表現(xiàn)為顯示過小。dip的換算：dip(value)=(int)(px(value)/1.5+0.5)二、布局3．比例像素sp(scaledpixels—bestfortextsize)sp主要處理字體的大小，用于字體顯示，可以根據(jù)系統(tǒng)的字體自適應。

除了上面三個顯示單位，還有如下幾種不太常用的顯示單位：

in(inches)英寸

mm(millimeters)毫米

pt(points)點，1/72英寸另外根據(jù)google的推薦，像素統(tǒng)一使用dip，字體統(tǒng)一使用sp。二、布局<LinearLayoutxmlns:android="/apk/res/android" xmlns:tools="/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <!--按鈕1--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button1" android:text="button1"/>二、布局 <!--按鈕2--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button2" android:text="button2"/> <!--按鈕3--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button3" android:text="button3"/>二、布局 <!--按鈕4--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button4" android:text="button4"/></LinearLayout>back二、布局publicclassMainActivityextendsActivity{

@Override protectedvoidonCreate(BundlesavedInstanceState){

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

}}back二、布局<RelativeLayoutxmlns:android="/apk/res/android" xmlns:tools="/tools" android:layout_width="match_parent" android:layout_height="match_parent"> <!--按鈕1--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:id="@+id/button1" android:text="button1"/>二、布局 <!--按鈕2--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button2" android:text="button2" android:layout_above="@+id/button1" android:layout_toLeftOf="@+id/button1"/>二、布局 <!--按鈕3--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button3" android:text="button3" android:layout_below="@+id/button1" android:layout_toLeftOf="@+id/button1"/>二、布局 <!--按鈕4--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button4" android:text="button4" android:layout_above="@+id/button1" android:layout_toRightOf="@+id/button1"/>二、布局 <!--按鈕5--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button5" android:text="button5" android:layout_below="@+id/button1" android:layout_toRightOf="@+id/button1"/></RelativeLayout>back二、布局publicclassMainActivityextendsActivity{ @Override protectedvoidonCreate(BundlesavedInstanceState){ super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); }}back二、布局<?xmlversion="1.0"encoding="utf-8"?><LinearLayoutxmlns:android="/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical">二、布局 <!--表格1-伸展--> <TableLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:shrinkColumns="0,1,2"> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="一行"/> <TableRow>二、布局 <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="按鈕1"> </Button> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="按鈕2"> </Button>二、布局

<Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="按鈕2"> </Button> </TableRow> <TableRow> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="按鈕4"> </Button>二、布局 <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_span="2" android:text="兩列"> </Button> </TableRow> </TableLayout>二、布局 <!--表格2-收縮--> <TableLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:stretchColumns="0,1"> <TableRow> <Button android:layout_width="wrap_content" android:layout_height="wrap_content"