教學(xué)理論授課android程序設(shè)計(jì)基礎(chǔ)第五章界面布局

Android程序設(shè)計(jì)基礎(chǔ)第5章：界面布局本章內(nèi)容第1節(jié)線(xiàn)性布局第2節(jié)相對(duì)布局第3節(jié)幀布局第4節(jié)

表格布局第5節(jié)

絕對(duì)布局第6節(jié)縱橫屏切換第7節(jié)

優(yōu)化布局第8節(jié)查看apk中的布局本章目標(biāo)掌握線(xiàn)性布局的用法。掌握相對(duì)布局的用法。掌握幀布局的用法。掌握表格布局的用法。掌握絕對(duì)布局的用法。掌握縱橫屏切換的處理。學(xué)會(huì)優(yōu)化布局。學(xué)會(huì)查看apk中的布局。第1節(jié)

線(xiàn)性布局知識(shí)點(diǎn)預(yù)覽#知識(shí)點(diǎn)重點(diǎn)難點(diǎn)應(yīng)用說(shuō)明1線(xiàn)性布局概述√介紹線(xiàn)性布局的特點(diǎn)。2常用屬性√√介紹線(xiàn)性布局的常見(jiàn)屬性。3布局實(shí)例√√介紹線(xiàn)性布局的使用實(shí)例線(xiàn)性布局是一種讓視圖水平或垂直線(xiàn)性排列的布局線(xiàn)性布局使用<LinearLayout>標(biāo)簽進(jìn)行配置對(duì)應(yīng)代碼中的類(lèi)是android.widget.LinearLayout線(xiàn)性布局分為水平和垂直兩種方向線(xiàn)性布局的特點(diǎn)水平布局垂直布局線(xiàn)性布局的常用屬性如下：android:orientation表示布局方向取值vertical表示垂直布局取值horizontal表示水平布局android:gravity表示視圖的對(duì)齊方式內(nèi)容包括：top、bottom、left、right、center_vertical、center_horizontal、center可以使用|分隔填寫(xiě)多個(gè)值布局中的視圖可以使用如下屬性android:layout_gravity表示單個(gè)視圖的對(duì)齊方式android:layout_weight表示單個(gè)視圖所在大小的比重當(dāng)layout_weight為0時(shí)，視圖大小由自身確定當(dāng)layout_weight大于0時(shí)，視圖在線(xiàn)性布局方向上根據(jù)比重拉伸常用屬性通過(guò)線(xiàn)性布局實(shí)現(xiàn)如下圖的視圖界面相對(duì)布局實(shí)例線(xiàn)性布局實(shí)例演示演示線(xiàn)性布局實(shí)例第2節(jié)相對(duì)布局知識(shí)點(diǎn)預(yù)覽#知識(shí)點(diǎn)重點(diǎn)難點(diǎn)應(yīng)用說(shuō)明1相對(duì)布局概述√

介紹相對(duì)布局的特點(diǎn)。2常用屬性√√介紹相對(duì)布局的常用屬性。3相對(duì)布局實(shí)例√√介紹使用相對(duì)布局的實(shí)例。相對(duì)布局是一種通過(guò)設(shè)置相對(duì)位置進(jìn)行的布局相對(duì)布局使用<RelativeLayout>標(biāo)簽進(jìn)行配置對(duì)應(yīng)代碼中的類(lèi)是android.widget.RelativeLayout布局中的視圖通過(guò)設(shè)置相互間的相對(duì)位置進(jìn)行排列相對(duì)的排列位置相對(duì)的對(duì)齊方式相對(duì)布局概述相對(duì)布局內(nèi)視圖可用的常用屬性如下：與位置相關(guān)的屬性android:layout_above表示在目標(biāo)組件之上android:layout_below表示在目標(biāo)組件之下android:layout_toLeftOf表示在目標(biāo)組件的左邊android:layout_toRightOf表示在目標(biāo)組件的右邊與對(duì)齊相關(guān)的屬性android:alignBaseLine表示與目標(biāo)組件的基線(xiàn)對(duì)齊android:alignBottom表示與目標(biāo)組件的底邊對(duì)齊android:alignTop表示與目標(biāo)組件的頂邊對(duì)齊android:alignLeft表示與目標(biāo)組件的左邊對(duì)齊android:alignRight表示與目標(biāo)組件的右邊對(duì)齊android:layout_centerHorizontal表示在相對(duì)布局容器內(nèi)水平居中android:layout_centerVertical表示在相對(duì)布局容器內(nèi)垂直居中常用屬性通過(guò)相對(duì)布局實(shí)現(xiàn)如下圖的視圖界面相對(duì)布局實(shí)例相對(duì)布局實(shí)例演示演示相對(duì)布局實(shí)例第3節(jié)幀布局知識(shí)點(diǎn)預(yù)覽#知識(shí)點(diǎn)重點(diǎn)難點(diǎn)應(yīng)用說(shuō)明1幀布局概述√

介紹幀布局的特點(diǎn)。2常用屬性√√介紹幀布局相關(guān)的常用屬性。3幀布局實(shí)例√√介紹幀布局的使用實(shí)例。

幀布局是一種把視圖層疊起來(lái)顯示的布局使用<FrameLayout>標(biāo)簽進(jìn)行配置對(duì)應(yīng)的類(lèi)是android.widget.FrameLayout布局中的視圖按照書(shū)寫(xiě)的先后順序排列先加入的顯示在底層，最后加入的顯示在頂層每一個(gè)視圖都可以針對(duì)布局容器設(shè)置擺放位置幀布局概述幀布局的常用屬性android:foreground用于表示幀布局最頂層的覆蓋層android:foregroundGravity用于表示覆蓋層內(nèi)容的位置幀布局內(nèi)視圖可用的常用屬性如下：android:layout_gravity表示視圖的位置內(nèi)容包括：top、bottom、left、right、center_vertical、center_horizontal、center可以使用|分隔填寫(xiě)多個(gè)值常用屬性通過(guò)幀布局實(shí)現(xiàn)如下圖的視圖界面幀布局實(shí)例布局文件概覽幀布局實(shí)例2<FrameLayoutxmlns:android=""android:layout_width="match_parent"android:layout_height="match_parent"><TextViewandroid:layout_gravity="center"android:layout_width="300dp"android:layout_height="300dp"android:background="#FF0000"android:text="@string/tip1"/>……</FrameLayout>幀布局實(shí)例演示演示幀布局實(shí)例第4節(jié)表格布局知識(shí)點(diǎn)預(yù)覽#知識(shí)點(diǎn)重點(diǎn)難點(diǎn)應(yīng)用說(shuō)明1表格布局概述√

介紹表格布局的特點(diǎn)。2常用屬性√√介紹表格布局的常用屬性。3表格布局實(shí)例√√介紹使用表格布局的實(shí)例。表格布局是一種行列方式排列視圖的布局使用<TableLayout>和<TableRow>標(biāo)簽進(jìn)行配置對(duì)應(yīng)的類(lèi)是android.widget.TableLayout一對(duì)<TableRow>標(biāo)簽包含著一行中顯示的視圖表格布局概述表格布局的常用屬性android:stretchColumns用于指定可以被拉伸的列可以被拉伸的列在屏幕還有空白區(qū)域時(shí)被拉伸充滿(mǎn)列通過(guò)0開(kāi)始的索引值表示多個(gè)列之間用逗號(hào)隔開(kāi)android:shrinkColumns用于指定可以被壓縮的列當(dāng)屏幕不夠用時(shí)，列被壓縮直到完全顯示android:collapseColumns用于表示可以被完全折疊的列表格布局內(nèi)視圖可用的常用屬性如下：android:layout_column指定列索引號(hào)由于有些行可能列數(shù)量不全，這時(shí)候需要給列指定索引號(hào)常用屬性通過(guò)表格布局實(shí)現(xiàn)如下圖的視圖界面表格布局實(shí)例表格布局實(shí)例演示演示表格布局實(shí)例第5節(jié)絕對(duì)布局知識(shí)點(diǎn)預(yù)覽#知識(shí)點(diǎn)重點(diǎn)難點(diǎn)應(yīng)用說(shuō)明1絕對(duì)布局概述√

介紹絕對(duì)布局的特點(diǎn)。2常用屬性√√介紹絕對(duì)布局的常用屬性。3絕對(duì)布局實(shí)例√√介紹使用絕對(duì)布局的實(shí)例。絕對(duì)布局是一種通過(guò)絕對(duì)坐標(biāo)實(shí)現(xiàn)的布局使用<AbsoluteLayout>標(biāo)簽進(jìn)行配置對(duì)應(yīng)的類(lèi)是android.widget.AbsoluteLayout子視圖通過(guò)設(shè)定坐標(biāo)進(jìn)行位置的確定絕對(duì)布局概述絕對(duì)布局內(nèi)視圖可用的常用屬性如下：android:layout_x指定子視圖的x軸坐標(biāo)android:layout_y指定子視圖的y軸坐標(biāo)android:layout_width指定子視圖的寬度android:layout_height指定子視圖的高度常用屬性通過(guò)絕對(duì)布局實(shí)現(xiàn)如下圖的視圖界面絕對(duì)布局實(shí)例布局的XML如下絕對(duì)布局實(shí)例<AbsoluteLayoutxmlns:Android=""android:layout_width="wrap_content"android:layout_height="wrap_content"><ImageViewandroid:layout_width="wrap_content“android:layout_height="wrap_content“android:src="@drawable/google“android:layout_x="22px“android:layout_y="60px"/><TextViewandroid:layout_width="wrap_content“android:layout_height="wrap_content“android:text="IloveAndroid“android:layout_x="100px“android:layout_y="175px"/>……</AbsoluteLayout>第6節(jié)縱橫屏切換知識(shí)點(diǎn)預(yù)覽#知識(shí)點(diǎn)重點(diǎn)難點(diǎn)應(yīng)用說(shuō)明1資源限定符√√介紹Android系統(tǒng)中的資源限定符規(guī)則。2限定屏幕類(lèi)型√√介紹如何通過(guò)限定符限定屏幕類(lèi)型。3實(shí)現(xiàn)切換√√介紹縱橫屏切換的過(guò)程。4切換事件處理√√介紹縱橫屏切換過(guò)程中的事件觸發(fā)。資源限定符是針對(duì)資源搜索而設(shè)定的定位資源時(shí)自動(dòng)根據(jù)當(dāng)前軟件硬件的特征對(duì)目錄名稱(chēng)進(jìn)行匹配res/下的子目錄的命名規(guī)則：<資源名>-<限定符>資源名包含animatorcolordrawablelayoutmenurawvaluesxml限定符可以包含多個(gè)，中間使用“-”符號(hào)連接資源限定符的前后順序必須按照系統(tǒng)規(guī)定的順序排列資源限定符系統(tǒng)給定的資源限定符資源限定符2配置限定符說(shuō)明MCC/MCNmcc310、mcc310-mnc004、……移動(dòng)國(guó)家代碼/移動(dòng)網(wǎng)絡(luò)代號(hào)語(yǔ)言和區(qū)域en、fr、en-rUS、zh、……語(yǔ)言代碼和區(qū)域代碼，區(qū)域代碼前加r布局方向ldrtl、ldltr指的是布局從左到右還是從右到左最小寬度sw<N>dp，比如：sw320dp屏幕的基本尺寸可用寬度w<N>dp屏幕的最小有效寬度可用高度h<N>dp屏幕的最小有效高度系統(tǒng)給定的資源限定符資源限定符3配置限定符說(shuō)明屏幕尺寸small、normal、large、xlarge硬件屏幕的尺寸屏幕寬高比long、notlong屏幕的方向land、portland表示橫屏、port表示豎屏夜間模式night、notnight像素密度ldpi、mdpi、hdpi、xhdpi、……屏幕的像素密度有效鍵盤(pán)keysexposed、keyshidden、keyssoft鍵盤(pán)的狀態(tài)使用限定符來(lái)限定屏幕類(lèi)型縱橫屏幕切換時(shí)首先影響到的時(shí)候界面布局為界面布局使用限定屏幕類(lèi)型的限定符/res/layout-land/這個(gè)目錄下的布局文件將會(huì)在橫屏?xí)r被使用/res/layout-port/這個(gè)目錄下的布局文件將會(huì)在豎屏?xí)r被使用存放在兩個(gè)目錄下的文件名應(yīng)該是相同的，比如：/res/layout-land/main.xml/res/layout-port/main.xml限定屏幕類(lèi)型屏幕切換時(shí)布局文件會(huì)被自動(dòng)重新加載為橫屏和豎屏定義不同的布局文件存放在各自的限定符目錄中在模擬器中通過(guò)Ctrl+F11進(jìn)行橫屏和豎屏的切換操作實(shí)現(xiàn)切換縱橫屏切換演示演示縱橫屏切換時(shí)布局的自動(dòng)切換縱橫屏切換時(shí)，默認(rèn)情況下Activity的onCreate會(huì)被調(diào)用可以通過(guò)對(duì)Activity進(jìn)行配置改變事件處理的流程使用android:configChanges進(jìn)行配置onCreate將不會(huì)再被通知通過(guò)覆蓋onConfigurationChanged方法處理事件默認(rèn)狀態(tài)下Activity將會(huì)被銷(xiāo)毀重建，布局的切換自動(dòng)完成通過(guò)上述配置Activity將不會(huì)被重建但是布局的切換需要程序來(lái)處理切換事件處理<activity

android:configChanges="orientation|screenSize"android:name="com.example.screen.MainActivity"android:label="@string/app_name"></activity>切換事件處理演示演示切換事件的處理第7節(jié)優(yōu)化布局知識(shí)點(diǎn)預(yù)覽#知識(shí)點(diǎn)重點(diǎn)難點(diǎn)應(yīng)用說(shuō)明1HierarchyViewer調(diào)試√√√介紹HierarchyViewer調(diào)試工具。2優(yōu)化UI布局√√√介紹如何進(jìn)行UI布局的優(yōu)化。HierarchyViewer是隨AndroidSDK提供的一個(gè)工具位于SDK的tools目錄下，名為：hierarchyviewer.bat是一個(gè)單機(jī)版的軟件，能夠連接正在運(yùn)行的模擬器設(shè)備提供了通過(guò)可視化功能查看運(yùn)行在設(shè)備中應(yīng)用的UI布局結(jié)構(gòu)能夠結(jié)合開(kāi)Eclipse的Debug功能進(jìn)行UI的調(diào)試HierarchyViewer調(diào)試HierarchyViewer提供了如下一些功能可視化瀏覽UI布局的層級(jí)結(jié)構(gòu)HierarchyViewer調(diào)試2HierarchyViewer提供了如下一些功能可以按照實(shí)際運(yùn)行效果查看UI布局的細(xì)節(jié)HierarchyViewer調(diào)試3優(yōu)化UI布局的幾個(gè)方法通過(guò)HierarchyViewer查看布局的層級(jí)結(jié)構(gòu)，找出可以?xún)?yōu)化的部分如下圖所示的結(jié)構(gòu)樹(shù)在一個(gè)FrameLayout下只存在唯一一個(gè)FrameLayout這里的原因是因?yàn)锳ctivity的根布局就是FrameLayout所以假如Activity的中的頂層布局可以不用定義成FrameLayout這里可以通過(guò)<merge>標(biāo)簽進(jìn)行優(yōu)化優(yōu)化UI布局優(yōu)化UI布局的幾個(gè)方法通過(guò)HierarchyViewer查看布局的層級(jí)結(jié)構(gòu)，找出可以?xún)?yōu)化的部分使用<merge>標(biāo)簽的優(yōu)化如下：優(yōu)化前優(yōu)化后優(yōu)化UI布局2<FrameLayout……><View……/></FrameLayout><merge……><View……/></merge>優(yōu)化UI布局的幾個(gè)方法使用<include>標(biāo)簽進(jìn)行界面布局的優(yōu)化提取多個(gè)界面的公共部分并放在一個(gè)獨(dú)立的布局文件(shap.xml)中優(yōu)化UI布局3<LinearLayoutxmlns:android=""android:orientation="vertical"android:layout_width="fill_parent"android:layout_height="fill_parent”><TextViewandroid:layout_width="fill_parent"android:layout_height="wrap_content"android:text="這是一個(gè)共享布局”/></LinearLayout>優(yōu)化UI布局的幾個(gè)方法使用<include>標(biāo)簽進(jìn)行界面布局的優(yōu)化在需要使用的布局中通過(guò)include使用公