android五大布局對象

1.RelativeLayout :相對佈局類

        允許子元素指定他們相對於其它元素或父元素的位置(通過ID 指定)。

        android:layout_below="@id/text"    在佈局id爲text的下面

             android:layout_above:在某view的之上

            android:layout_marginLeft="20dp":表示距離視圖左面20dp的位置,及座標(20,0),

        android:layout_marginTop="50dp":表示距離視圖上沿50dp的位置及(0,50),

        還可設置right,bottom的值

        android:layout_toLeftOf="@id/ok":  表示在ok組件的左側

      如下效果:

xml文件佈局代碼:

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginTop="50dp"
        android:text="暱稱"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textColor="#243447" />

    <EditText
        android:id="@+id/edit"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="80dp"
        android:layout_marginTop="50dp" >
    </EditText>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginTop="140dp"
        android:text="時間"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TimePicker
        android:id="@+id/timePicker1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="80dp"
        android:layout_marginTop="140dp" />

</RelativeLayout>

2.LinearLayout:線性佈局

可以設置佈局的方向orientation:水平和垂直,

所有的子元素是按順序水平或垂直排列,高度不同的也會佈局在同行或同列,也可以設置該元素在行或列的權重gravity,子元素可以嵌套多個LinearLayout

效果圖:

xml代碼:

<?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="match_parent"
    android:orientation="horizontal" >
	<!-- 第一列顯示圖片 -->
    <ImageView
        android:id="@+id/image"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:padding="10dp" />
	<!-- 第二列顯示文本 -->
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >
		<!-- 第一行水平顯示暱稱、發表時間 -->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >
			<!-- 暱稱 -->
            <TextView
                android:id="@+id/text1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
			<!-- 發表時間 -->
            <TextView
                android:id="@+id/text2"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:gravity="right" />
        </LinearLayout>
		<!-- 第二行顯示發表內容 -->
        <TextView
            android:id="@+id/text3"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />
    </LinearLayout>

</LinearLayout>


 

 

 3.AbsoluteLayout:絕對佈局

   可以指定子元素準確的x/y座標值,並顯示在屏幕上。(0, 0)爲左上角,當向下或向右移動時,座標值將變大

效果:

xml代碼:

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_x="20dp"
        android:layout_y="40dp"
        android:text="暱稱"
        android:textSize="23dp" />

    <EditText
        android:id="@+id/name"
        android:layout_width="180dp"
        android:layout_height="wrap_content"
        android:layout_x="80dp"
        android:layout_y="40dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_x="20dp"
        android:layout_y="120dp"
        android:text="密碼"
        android:textAppearance="?android:attr/textAppearanceLarge" />


    <EditText
        android:id="@+id/pass"
        android:layout_width="180dp"
        android:layout_height="wrap_content"
        android:layout_x="80dp"
        android:layout_y="120dp" />

</AbsoluteLayout>

4.TableLayout:表格佈局

表格式的佈局,把包含的元素以行和列的形式排列

效果圖:

 

xml文件代碼編寫

<?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" >

    <TableRow>

        <TextView
            android:gravity="right"
            android:padding="3dip"
            android:text="用戶名:"
            android:textStyle="bold" />

        <EditText
            android:id="@+id/username"
            android:padding="3dip"
            android:scrollHorizontally="true" />
    </TableRow>

    <TableRow>

        <TextView
            android:gravity="right"
            android:padding="3dip"
            android:text="密碼:"
            android:textStyle="bold" />

        <EditText
            android:id="@+id/pass"
            android:padding="3dip"
            android:password="true"
            android:scrollHorizontally="true" />
    </TableRow>

    <TableRow android:gravity="right" >

        <Button
            android:id="@+id/cancel"
            android:text="取消" />

        <Button
            android:id="@+id/login"
            android:text="登錄" />
    </TableRow>

</TableLayout>

5.FrameLayout:框架佈局

所有的元素都被放置在最左上的區域,無法爲這些元素指定確切的位置,多個元素,後面的元素會重疊在前一個元素上,最後的元素在最上面一層。

效果圖:

佈局文件代碼:

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

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:src="@drawable/aa" />

    <EditText
        android:id="@+id/username"
        android:layout_width="fill_parent"
        android:layout_height="60dp" >
    </EditText>

    <Button
        android:id="@+id/login"
        android:layout_width="100dp"
        android:layout_height="80dp"
        android:text="登錄" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="見到你很高興"
        android:textStyle="bold" />

</FrameLayout>

從效果圖可看出,圖片在最下面一層,接着是輸入文本框、按鈕、最上面一層是文本域


 


 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章