Android Studio安卓學習筆記(三)Android用戶界面的設計佈局與組件(一)用戶界面佈局設計(1)

當咱們建立了一個安卓項目後，咱們會發現真正創建一個完善的安卓項目並非想象的那麼容易。其實和設計GUI可視化界面同樣，開發安卓也須要考慮不少方面，主要考慮的仍是界面佈局和須要的組件。

 

一：Android用戶界面佈局管理

        Android系統按照MVC(模型(model)－視圖(view)－控制器(controller))設計模式將應用程序的界面設計與功能控制設計分離，相似於先後端分離，能夠單獨哦修改用戶界面和後面的控制代碼，而在AS中，前端的界面佈局文件是在生成的應用程序框架項目的res資源目錄的layout子目錄中，文件名爲activity_main.xml(建立新項目時能夠更名字)，能夠用界面化的和XML文件共同管理。若是要調用資源文件，就使用R.java的R類，把res目錄中的資源與id編號進行映射，用id號進行資源管理。

 

1.佈局文件的規範

(1)佈局文件做爲項目的資源存放在res\layout目錄下，是一個xml文件，默認文件名爲activity_main.xml。

(2)佈局文件的根節點一般是一個佈局方式，在根節點內能夠添加組件做爲結點。

(3)佈局文件的根節點必須包含一個命名空間，爲了與其餘項目進行分離。

以下：

xmlns:android="http://schemas.android.com/apk/res/android"

(4)若是要實現Java程序中控制界面的組件，則必須爲界面文件的組件定義一個id，也就是經過id把資源文件以及組件引用過來進行控制。

組件定義格式以下：

android:id="@+id/<組件id>"

 

2.佈局文件經常使用的重要屬性值

(1)設置組件大小的屬性值

wrap_contont：強制性地使視圖擴展以顯示所有內容，完整顯示其內部的文本和圖像，根據組件內容的大小來決定組件的大小。

match_parent：Android2.2以上和fill_parent通用，填充在容器的全部空間。

fill_parent：強制性地使構件擴展，以填充佈局單元內儘量多的空間，就是強制性讓它佈滿整個屏幕。

(2)設置組件大小的單位

px(pixels)：像素，即屏幕上的發光點。

dp(或dip，全稱爲device independent pixels)：設備獨立像素，一種支持多分辨率設備的抽象單位，和硬件相關。

sp(scaled pixels)：比例像素，設置字體大小。

(3)設置組件的對齊方式

在組件中由"android:gravity"屬性控制組件的對齊方式，其屬性有上(top)，下(bottom)，坐(left)，右(right)，水平方向居中(center_horizontal)，垂直方向居中(center_vertical)等。

 

3.常見的佈局

有關用戶界面的佈局有下面常見的七種佈局。

線性佈局(LinearLayout)，幀佈局(FrameLayout)，表格佈局(TableLayout)，相對佈局(RelativeLayout)，絕對佈局(AbsolateLayout)，網格佈局(GridLayout)，約束布(ConstraintLayout)。而相對佈局已使用約束佈局替代，絕對佈局難以實現多分辨率適配，不建議使用。

(1)線性佈局(LinearLayout)

特色：將組件按照水平或垂直方向排列。

特殊屬性：由"android:orientation"屬性控制排列方式，其屬性值有水平(horizontal)和垂直(vertical)兩種。

實例：按水平和垂直方向線性佈局顯示幾個按鈕。

水平：

 結果以下：

 

 

豎直方向的結果以下：

 

(2)幀佈局(FrameLayout)

特色：將組件放置在左上角位置，當添加多個組件時後面的組件將遮蓋前面的組件。幀佈局會按照添加順序層疊在一塊兒，默認層疊在左上角位置。

特殊屬性：用"layout_gravity"能夠設置層疊的位置。

實例：將不一樣大小的圖片進行層疊，這裏引用圖片的方法能夠在用戶界面，也能夠在源程序控制文件中。

運行結果以下：

(3)表格佈局(TableLayout)

特色：將頁面分爲由行，列構成的單元格。

特殊屬性：表格的列數由android:shrinkColumns定義，例如android:shrikColumns = "0,1,2"表示表格爲三列，編號爲1，2，3。

• android:collapseColumns:設置須要被隱藏的列的序號

• android:shrinkColumns:設置容許被收縮的列的列序號

• android:stretchColumns:設置運行被拉伸的列的列序號

實例：實現相似手機待機界面的六行四列的表格。

首先，將所要顯示的圖片添加到res資源目錄文件drawable-hdpi下，具體過程以下：

選擇Project視圖，app—>src—>res—>右鍵new resource directory—>選擇resource type （drawable）->density,根據須要，選擇合適的分辨率，這裏選擇high density確認後

會生成一個資源文件夾drawable-hdpi—>將圖片文件複製到文件夾裏。

 

 而後代碼以下：

運行結果以下：

 (4)相對佈局(RelativeLayout)

特色：相對其餘組件位置進行佈局，經過相對定位的方式讓控件出如今佈局任意位置 。在相對佈局中，經過指定id關聯其餘組件與之右對齊，上下對齊或以屏幕中央方式來排列組件。

特殊常見屬性：

    相對於父元素給控件佈局(屬性值爲true或false)
    android:layout_centerHrizontal  水平居中 
    android:layout_centerVertical 垂直居中 
    android:layout_centerInparent    相對於父元素徹底居中 
    android:layout_alignParentBottom 位於父元素的下邊緣 
    android:layout_alignParentLeft   位於父元素的左邊緣 
    android:layout_alignParentRight  位於父元素的右邊緣 
    android:layout_alignParentTop    位於父元素的上邊緣 
    android:layout_alignWithParentIfMissing  若是對應的兄弟元素找不到的話就以父元素作參照物 

    屬性值必須爲id的引用名「@id/id-name」 
    android:layout_below      位於元素的下方 
    android:layout_above      位於元素的的上方 
    android:layout_toLeftOf   位於元素的左邊 
    android:layout_toRightOf  位於元素的右邊 

    android:layout_alignTop   該元素的上邊緣和某元素的的上邊緣對齊 
    android:layout_alignLeft  該元素的左邊緣和某元素的的左邊緣對齊 
    android:layout_alignBottom 該元素的下邊緣和某元素的的下邊緣對齊 
    android:layout_alignRight  該元素的右邊緣和某元素的的右邊緣對齊 

    給屬性賦予像素值
    android:layout_marginBottom      底邊緣的距離 
    android:layout_marginLeft           左邊緣的距離 
    android:layout_marginRight         右邊緣的距離 
    android:layout_marginTop           上邊緣的距離

實例：生成一個組件排列的應用程序。

 

運行結果以下：