Android的佈局介紹

我叫阿狸貓發表於2014-01-19

1.線性佈局(從上到下,垂直的佈局)   android:orientation="vertical"   根元素LinearLayout



2.水平佈局(從左到右)   預設  android:orientation="horizontal"    根元素LinearLayout



3.巢狀的線性佈局    根元素LinearLayout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    ><!-- 外部是垂直佈局 -->
    <!-- 裡邊是水平佈局,注意水平佈局的高度是包裹內容 -->
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	    android:orientation="horizontal"
    	>
    	<Button
      	  android:layout_width="wrap_content"
       	  android:layout_height="wrap_content"
      	  android:text="Button" />
    	<Button
      	  android:layout_width="wrap_content"
       	  android:layout_height="wrap_content"
      	  android:text="Button" />
    	<Button
      	  android:layout_width="wrap_content"
       	  android:layout_height="wrap_content"
      	  android:text="Button" /><Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button" />
        
    </LinearLayout>

	
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

</LinearLayout>



4.幀式佈局(將圖片跌在某張圖片上,先設定的圖片在下層,後設定的在上層)   根元素FrameLayout

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" ><!-- "fill_parent"和 match_parent是一樣的,都是填充父元素-->
    
	<ImageView 
	    android:src="@drawable/transformers"
	  	android:layout_width="wrap_content"
   	 	android:layout_height="wrap_content" 
	    />
	
	<ImageView 
	    android:layout_gravity="center"
	    android:src="@drawable/play"
	  	android:layout_width="50dp"
   	 	android:layout_height="50dp" 
	    />
	<!-- 
		px單位不管螢幕大小都是同一個尺寸
		dp單位會隨著螢幕大小改變而改變圖形大小(推薦)
	 -->
	
</FrameLayout>



5.表格佈局  根元素TableLayout

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:stretchColumns="1"><!-- android:stretchColumns="1"將索引為1的列拉伸,指定了寬度後,這個設定就不起作用了,按照寬度來 -->

    <TableRow>
        <TextView
            android:layout_width="0dp"
            android:layout_weight="1"
            android:padding="0dip"
            android:text="1, 1" />
		<!-- 
			將文字內容右對齊android:gravity="right",預設是左對齊 
			android:layout_weight="1"表示權重的意思,數值越大寬度就越大	
		-->
        <TextView
            android:layout_width="0dp"
            android:layout_weight="1"
            android:padding="10dip"
            android:text="1, 2" />
        <TextView
            android:layout_width="0dp"
            android:layout_weight="1"
            android:padding="0dip"
            android:text="1, 3" />
    </TableRow>

    <TableRow>
        <TextView
            android:padding="10dip"
            android:text="2, 1" />
        <TextView
            android:padding="10dip"
            android:text="2, 2" />
        <TextView
            android:padding="10dip"
            android:text="2, 3" />
    </TableRow>

</TableLayout>



6.相對佈局  根元素RelativeLayout

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp" ><!-- android:padding表示和四周的邊距 -->
   
   
   	<!-- 
   		android:layout_marginLeft   	距離左邊距離
   		android:layout_below        	在哪個元件下面
   		android:layout_alignTop     	和哪個元件的上邊距對齊
   		android:layout_toRightOf		在哪個元件的右邊
   		android:layout_alignParentRight	對齊父元素的右邊
   	 -->

    <TextView
        android:id="@+id/numTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="手機號碼"
        android:textSize="20sp" />

    <EditText
        android:id="@+id/numET"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="30dp"
        android:layout_toRightOf="@id/numTV" />

    <TextView
        android:id="@+id/contentTV"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/numET"
        android:text="簡訊內容"
        android:textSize="20sp" />

    <EditText
        android:id="@+id/contentET"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignTop="@id/contentTV"
        android:layout_marginLeft="30dp"
        android:layout_toRightOf="@id/contentTV"
        android:lines="3" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_below="@id/contentET"
        android:text="傳送簡訊" />

</RelativeLayout>



7.絕對佈局  根元素AbsoluteLayout   靠的是座標定位

<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_x="16dp"
        android:layout_y="9dp"
        android:text="Button" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_x="161dp"
        android:layout_y="184dp"
        android:text="Button" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_x="220dp"
        android:layout_y="84dp"
        android:text="Button" />

</AbsoluteLayout>



相關文章