Android开发 - 布局

back >>

1. LinearLayout布局 (代码见Layout_01)

    * 四个属性

        - android:orientation  指定线性布局的朝向，vertical表示垂直布局，由上到下排版，horizontal表示由左到右排版

        - android:layout_weight 子元素对未被占用空间分配权重值

        - android:layout_gravity 本元素相对于父元素的重力方向

        - android:gravity 指定本元素的所有子元素的重力方向

    * 代码示例

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal/vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <!--
    	android:id  — 为控件指定相应的ID
    	android:text — 指定控件中显示的文字，需要注意的是，这里尽量使用strings.xml文件当中的字符串
    	android:grivity — 指定控件的基本位置，比如说居中，居右等位置
    	android:textSize — 指定控件当中字体的大小
    	android:background — 指定该控件所使用的背景色,RGB命名法 
    	android:width — 指定控件的宽度
    	android:height — 指定控件的高度
    	android:padding* — 指定控件的内边距，也就是说控件当中的内容
    	android:sigleLine — 如果设置为真的话，则将控件的内容在同一行当中进行显示(不折行)
    	android:layout_weight — 指示控件在当前activity中所占的高度比重，要考虑到当前内容大小，决定该值
     -->
	<TextView
		android:id="@+id/firstText"
		android:text="第一行很多字很多字很多字很多字"
		android:gravity="right"
		android:textSize="15pt"
		android:background="#aa0000"
		android:layout_width="fill_parent"
		android:layout_height="wrap_content"
		android:padding="30px"
		android:layout_weight="1"
        android:singleLine="true"/>
	<TextView
		android:id="@+id/secondText"
		android:text="第二行"
		android:gravity="center_vertical"
		android:textSize="15pt"
		android:background="#0000aa"
		android:layout_width="fill_parent"
		android:layout_height="wrap_content"
		android:layout_weight="1"/>
</LinearLayout>

    * 运行效果 android:orientation=horizontal

 

2. TableLayout布局 (代码见Layout_02)

    * 代码示例

<?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="0">
    <!-- 
    	android:stretchColumns  拉伸指定列，以填满，列从0计数
     -->
    <TableRow android:layout_width="fill_parent">
        <TextView
            android:text="@string/row1_column1"
            android:background="#aa0000"
            android:padding="3dip" />
        <TextView
        	android:text="@string/row1_column1"
        	android:padding="3dip"
        	android:gravity="center_horizontal"
            android:background="#00aa00"
        	></TextView>
    </TableRow>
    <TableRow>
        <TextView
            android:text="@string/row2_column1"
             android:background="#0000aa"
            android:padding="3dip" />
        <TextView
            android:text="@string/row2_column2"
            android:gravity="right"
             android:background="#0044aa"
            android:padding="3dip" />
    </TableRow>
</TableLayout>

     * 运行效果

 

3. RelativeLayout布局 (代码见Layout_03)

    * 代码示例

<?xml version="1.0" encoding="utf-8"?>
	<!--
		android:layout_above 将该控件的底部至于给定ID的控件之上
		android:layout_below 将该控件的顶部至于给定ID的控件之下
		android:layout_toLeftOf 将该控件的右边缘和给定ID的控件的左边缘对齐
		android:layout_toRightOf 将该控件的左边缘和给定ID的控件的右边缘对齐

		android:layout_alignBaseline 该控件的baseline和给定ID的控件的baseline对齐
		android:layout_alignBottom 将该控件的底部边缘与给定ID控件的底部边缘
		android:layout_alignLeft 将该控件的左边缘与给定ID控件的左边缘对齐
		android:layout_alignRight 将该控件的右边缘与给定ID控件的右边缘对齐
		android:layout_alignTop 将给定控件的顶部边缘与给定ID控件的顶部对齐


		android:alignParentBottom 如果该值为true，则将该控件的底部和父控件的底部对齐
		android:layout_alignParentLeft 如果该值为true，则将该控件的左边与父控件的左边对齐
		android:layout_alignParentRight 如果该值为true，则将该控件的右边与父控件的右边对齐
		android:layout_alignParentTop 如果该值为true，则将空间的顶部与父控件的顶部对齐

		android:layout_centerHorizontal 如果值为真，该控件将被至于水平方向的中央
		android:layout_centerInParent 如果值为真，该控件将被至于父控件水平方向和垂直方向的中央
		android:layout_centerVertical 如果值为真，该控件将被至于垂直方向的中央
	-->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:padding="10px" >

    <TextView android:id="@+id/label" 
              android:layout_width="fill_parent" 
              android:layout_height="wrap_content" 
              android:text="Type here:" />

    <EditText android:id="@+id/entry" 
              android:layout_width="fill_parent" 
              android:layout_height="wrap_content" 
              android:background="@android:drawable/editbox_background"
              android:layout_below="@id/label" />
  
    <Button android:id="@+id/ok" 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:layout_below="@id/entry"
            android:layout_alignParentRight="true"
            android:layout_marginLeft="10px"
            android:text="OK" />

    <Button android:layout_width="wrap_content" 
            android:layout_height="wrap_content"
            android:layout_toLeftOf="@id/ok"
            android:layout_alignTop="@id/ok"
            android:text="Cancel" />
</RelativeLayout>

    * 效果

 

4. 混合布局 (代码见Layout_04)

    * 效果1----setContentView(R.layout.main);

    * 效果2----setContentView(R.layout.second);