1. 程式人生 > >Android學習--佈局檔案解析

Android學習--佈局檔案解析

學習過Android的基本內容之後開始對Android的ui開發進行學習,主要是對佈局的瞭解和對樣式主題的應用。

Android的佈局檔案是XML的格式,而且該檔案在res/layout資料夾中 。而佈局檔案可以用圖形化的視圖表示,在Graphical Layout中可以檢視到。

Android的佈局主要有以下幾個型別:相對佈局、線性佈局、表格佈局、網格佈局、幀佈局、絕對佈局這幾個方式。不同的佈局會有不同的視覺效果。接下來簡單學習下各個佈局的設計程式碼:

相對佈局的設計程式碼:(RelativeLayout)

<RelativeLayout xmlns:android="******/apk/res/android"                 //標籤

xmlns:tools="******/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity'>

<Button              //控制元件1

android:id="@+id/button1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentTop="true"                //頂部

android:layout_centerHorizontal="true"            //居中

android:layout_marginTop="260dp"              //設定距離

android:text="Button1"/>

<Button    //控制元件2

android:id="@+id/button2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignBottom="@+id/button1"    //對齊

android:layout_marginBottom="100dp"   //距離

android:layout_toRightOf="@+id/button1"  //右邊屬性

android:text="Button2"/>

</RelativeLayout>

這樣就定義了一個相對的佈局,程式碼中的margin用於定義元件間的距離。android:margin用於定義控制元件四周的邊距。而與margin類似的padding則是對內邊距的設定,需要注意使用的範圍和情況才可。

在你設定控制元件和佈局的時候需要注意使用“match_parent”或者是“wrap_content”的佈局格式,需要注意避免將空間的寬度和高度設計為固定的值。

線性佈局的設計程式碼:(LinearLayout)
<?xml version="1.0" encoding="'utf-8"?>

<LinearLayout xmlns:android="******/apk/res/android"                 //標籤

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical">

<Button              //控制元件1

android:id="@+id/button1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Button1"/>

<Button              //控制元件2

android:id="@+id/button2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Button2"/>

<Button              //控制元件3

android:id="@+id/button3"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Button3"/>

</LinearLayout>

線性佈局的設計主要分為兩種形式:水平線性佈局(horizontal)以及垂直線性佈局(vertical)。在預設選擇的時候是水平顯示佈局(horizontal)。 表格佈局的設計程式碼:(TableLayout) <?xml version="1.0" encoding="'utf-8"?>

<TableLayout xmlns:android="******/apk/res/android"                 //標籤

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:stretchColumns=“2”>

<TableRow>     //物件

<Button              //控制元件1

android:id="@+id/button1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_column="0"    //第一列

android:text="Button1"/>

<Button              //控制元件2

android:id="@+id/button2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_column="1"

android:text="Button2"/>

</TableRow>

<TableRow>

<Button              //控制元件3

android:id="@+id/button3"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_column="1"

android:text="Button3"/>

<Button              //控制元件4

android:id="@+id/button4"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_column="1"

android:text="Button4"/>

</TableRow>

<TableRow>

<Button              //控制元件5

android:id="@+id/button5"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_column="2"

android:text="Button5"/>

</TableRow>

</TableLayout> 這樣的表格佈局就形成了,對於表格佈局,主要的目的在於將控制元件排列整齊,按照表格的形式來進行設計,對於表格佈局,行數由TableRow來控制,從“0”開始表示第一列。注意的是,表格佈局不用設定高度和寬度,寬度一定是match_parent,高度一定為wrap_content。

網格佈局的設計程式碼:(GridLayout)

<?xml version="1.0" encoding="'utf-8"?>

<GridrLayout xmlns:android="******/apk/res/android"                 //標籤

android:layout_width="wrap_parent"

android:layout_height="wrap_parent"

android:gravity=“center”

android:columnCount="4"

android:orientation="horizontal">

<Button         

android:layout_column="3"

android:text="/"/>

<Button   android:text="1"/>

<Button   android:text="2"/>

<Button   android:text="3"/>

<Button   android:text="4"/>

<Button   android:text="5"/>

<Button   android:text="6"/>

<Button   android:text="7"/>

<Button   android:text="8"/>

<Button   android:text="9"/>

<Button   android:layout_gravity="fill"

androoid:alyout_rowSpan="3"//佔用3行

android:text="+"/>

<Button 

android:layout_columnSpan="2"//佔用2列

android:layout_gravity="fill"

android:text="0" />

<button android:text="00"  />

<Button

android:layout_columnSpan="3"//佔用3列

android:layout_gravity="fill"

android:text="=" />

</GridLayout>

這個網格佈局是Android4.0新增的佈局,用一組無限細的直線將繪圖區域分成行列和單元。android:layout_column表示按鈕在第幾列,android:layout_rowSpan表示控制元件佔用幾行,android:layout——columnSpan表示控制元件佔幾列。

幀佈局的設計程式碼:(FrameLayout)

<?xml version="1.0" encoding="'utf-8"?>

<FrameLayout xmlns:android="******/apk/res/android"                 //標籤

android:layout_width="match_parent"

android:layout_height="match_parent">

<Button              //控制元件1

android:id="@+id/button1"

android:layout_width="294dp"

android:layout_height="294dp"

android:text="Button1"/>

<Button              //控制元件2

android:id="@+id/button2"

android:layout_width="218dp"

android:layout_height="214dp"

android:text="Button2"/>

<Button              //控制元件3

android:id="@+id/button3"

android:layout_width="156dp"

android:layout_height="143dp"

android:text="Button3"/>

</FrameLayout>

幀佈局的設計是為每一個加入其中的控制元件建立一個空白的區域,稱之為幀。如果新增多個控制元件則會按照順序在螢幕的左上角進行顯示,並且會透明顯示之前的看控制元件文字。常見的刮刮卡就是通過幀佈局來實現的!

絕對佈局的設計程式碼:(AbsoluteLayout)

<?xml version="1.0" encoding="'utf-8"?>

<AbsoluteLayout xmlns:android="******/apk/res/android"                 //標籤

android:layout_width="match_parent"

android:layout_height="match_parent">

<Button         

android:id="@+id/button2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_x="50dp"

android:layout_y="50dp"

android:text="Button1"/>

<Button           

android:id="@+id/button1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_x="200dp"

android:layout_y="150dp"

android:text="Button2"/>

</AbsoluteLayout>

絕對佈局的設計形式主要在於通過指定x,y的座標來控制每一個控制元件的具體位置,實際工程中不提倡這個佈局。