android整合--屏幕组件

Activity（活动）中包含views（视图）和ViewGroups（视图组）。

views继承自android.view.view

views 包括button textview deittext ...

viewgroups继承自android.view.viewgroup

包括

• LinearLayout
• AbsoluteLayout
• TableLayout
• RelativeLayout
• FrameLayout
• <ScrollView>        
  

每一个View和ViewGroup有一些共同的属性，一些例子：

LinearLayout把视图组织成一行或一列

属性	描述
layout_width	指定View或ViewGroup的宽度
layout_height	指定View或ViewGroup的高度
layout_marginTop	指定View或ViewGroup上方的额外空间
layout_marginBottom	指定View或ViewGroup下方的额外空间
layout_marginLeft	指定View或ViewGroup左侧的额外空间
layout_marginRight	指定View或ViewGroup右侧的额外空间
layout_gravity	指定View或ViewGroup中的子视图的排列位置
layout_weight	指定指派给View或ViewGroup的额外空间尺寸
layout_x	指定View或ViewGroup的x坐标
layout_y	指定View或ViewGroup的y坐标

使用AbsoluteLayout，可以指定它其中的子View的确切位置。观察如下main.xml中的代码：

1. <?xml version="1.0" encoding="utf-8"?>  
2. <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="fill_parent"  
4.     android:layout_height="fill_parent" >  
5.   
6.     <Button  
7.         android:layout_width="188dp"  
8.         android:layout_height="wrap_content"  
9.         android:layout_x="126px"  
10.         android:layout_y="361px"  
11.         android:text="Button" />  
12.   
13.     <Button  
14.         android:layout_width="113dp"  
15.         android:layout_height="wrap_content"  
16.         android:layout_x="12px"  
17.         android:layout_y="361px"  
18.         android:text="Button" />  
19.   
20. </AbsoluteLayout> 
    

从Android1.5开始，Google官方已经不推荐使用这个布局了，尽管它现在还是可以使用的。在创建UI的时候，应该避免使用AbsoluteLayout这个布局，因为，Android并不确保会在将来的版本中还继续支持它。

TableLayout可以把视图views组织成“行”或“列”。可以使用<TableRow>元素指定表格中的一行。每一行又可以包含一个或多个视图。每行中的每个视图组成了表格的一个元素。每列的宽度，取决于这一列中宽度最大的视图view。

    <?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" >  
      
        <TableRow>  
      
            <TextView  
                android:text="User Name:"  
                android:width="120dp" />  
      
            <EditText  
                android:id="@+id/txtUserName"  
                android:width="200dp" />  
        </TableRow>  
      
        <TableRow>  
      
            <TextView android:text="Password:" />  
      
            <EditText  
                android:id="@+id/txtUserName"  
                android:password="true" />  
        </TableRow>  
      
        <TableRow>  
      
            <TextView />  
      
            <CheckBox  
                android:id="@+id/chkRememberPassword"  
                android:layout_width="fill_parent"  
                android:layout_height="wrap_content"  
                android:text="Remember Password" />  
        </TableRow>  
      
        <TableRow>  
      
            <Button  
                android:id="@+id/buttonSignIn"  
                android:text="Log In" />  
        </TableRow>  
      
    </TableLayout>  

模拟器上的效果图：

以上的例子，TableLayout中有2列，4行。在“Password” TextView视图的正下方，是一个空的<TextView>元素。如果不这么做的话，“Remember Password” CheckBox就会出现在“Password”TextView视图的下面，就像这样：

使用RelativeLayout，可以通过设置“相对位置”（每个View相对于另一个view的位置），来指定它所包含的子view的位置。看下面main.xml中的代码：

[java] view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:id="@+id/RLayout"  
4.     android:layout_width="fill_parent"  
5.     android:layout_height="fill_parent" >  
6.   
7.     <TextView  
8.         android:id="@+id/lblComments"  
9.         android:layout_width="wrap_content"  
10.         android:layout_height="wrap_content"  
11.         android:layout_alignParentLeft="true"  
12.         android:layout_alignParentTop="true"  
13.         android:text="Comments" />  
14.   
15.     <EditText  
16.         android:id="@+id/txtComments"  
17.         android:layout_width="fill_parent"  
18.         android:layout_height="170px"  
19.         android:layout_alignLeft="@+id/lblComments"  
20.         android:layout_below="@+id/lblComments"  
21.         android:layout_centerHorizontal="true"  
22.         android:textSize="18sp" />  
23.   
24.     <Button  
25.         android:id="@+id/btnSave"  
26.         android:layout_width="125px"  
27.         android:layout_height="wrap_content"  
28.         android:layout_alignRight="@+id/txtComments"  
29.         android:layout_below="@+id/txtComments"  
30.         android:text="Save" />  
31.   
32.     <Button  
33.         android:id="@+id/btnCancel"  
34.         android:layout_width="124px"  
35.         android:layout_height="wrap_content"  
36.         android:layout_alignLeft="@+id/txtComments"  
37.         android:layout_below="@+id/txtComments"  
38.         android:text="Cancel" />  
39.   
40. </RelativeLayout>  

可以观察到，这些views都被嵌在了RelativeLayout里面，每个view都有一些特有的属性去和其他view对准位置。这些属性是：

• layout_alignParentTop
• layout_alignParentLeft
• layout_alignRight
• layout_below
• layout_centerHorizontal

这些属性的值，就是每个被引用的view的id。

效果图：

(内容部分摘自孙国威老师博客)