Android学习之常见的布局方式

第一种：线性布局

        这种布局相对是比较简单的，要么竖向排列，要么横向排列

属性分别为： android:orientation= " horizontal " android:orientation= "vertical" 。

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.     android:orientation="vertical"  
6.     android:padding="10px">  
7.     <TextView   
8.         android:id="@+id/text"  
9.         android:layout_width="wrap_content"  
10.         android:layout_height="wrap_content"  
11.         android:text="Type:"/>  
12.     <EditText   
13.         android:id="@+id/et_entry"  
14.         android:layout_width="match_parent"  
15.         android:layout_height="wrap_content"  
16.         android:background="#ffffff"/>  
17.     <Button   
18.         android:id="@+id/ok"  
19.         android:layout_width="wrap_content"  
20.         android:layout_height="wrap_content"  
21.         android:layout_below="@id/et_entry"  
22.         android:text="OK"/>  
23.     <Button   
24.         android:id="@+id/cancel"  
25.         android:layout_width="wrap_content"  
26.         android:layout_height="wrap_content"  
27.         android:text="Cancel"/>  
28. </LinearLayout>  

效果如下：

第二种：相对布局

       相对布局：即相对于一个参照物的位置，那么必须先有参照物，才能确定接下来的控件的位置，例如先有A，然后B相对于A，在A的右边、下边或者什么位置。当然android中也可以相对于父窗体。

附加几类 RelativeLayout 的属性供大家参考：

　　第一类 : 属性值为 true 或 false

　　android:layout_centerHrizontal 水平居中

　　android:layout_centerVertical 垂直居中

　　android:layout_centerInparent 相对于父元素完全居中

　　android:layout_alignParentBottom 贴紧父元素的下边缘

　　android:layout_alignParentLeft 贴紧父元素的左边缘

　　android:layout_alignParentRight 贴紧父元素的右边缘

　　android:layout_alignParentTop 贴紧父元素的上边缘

　　android:layout_alignWithParentIfMissing 若找不到兄弟元素以父元素做参照物

　　第二类：属性值必须为 id 的引用名“ @id/id-name ”

　　android:layout_below 在某元素的下方

　　android:layout_above 在某元素的上方

　　android:layout_toLeftOf 在某元素的左边

　　android:layout_toRightOf 在某元素的右边

　　android:layout_alignTop 本元素的上边缘和某元素的的上边缘对齐

　　android:layout_alignLeft 本元素的左边缘和某元素的的左边缘对齐

　　android:layout_alignBottom 本元素的下边缘和某元素的的下边缘对齐

　　android:layout_alignRight 本元素的右边缘和某元素的的右边缘对齐

　　第三类：属性值为具体的像素值，如 30dip ， 40px

　　android:layout_marginBottom 离某元素底边缘的距离

　　android:layout_marginLeft 离某元素左边缘的距离

　　android:layout_marginRight 离某元素右边缘的距离

　　android:layout_marginTop 离某元素上边缘的距离

[html] view plaincopy

1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="100px"  
5.     tools:context=".MainActivity" >  
6.   
7.     <TextView  
8.         android:id="@+id/tv_title"  
9.         android:layout_width="wrap_content"  
10.         android:layout_height="wrap_content"  
11.         android:layout_marginLeft="10px"  <span style="font-family: Arial, Helvetica, sans-serif;">/*距离父窗体的左边10个像素*/</span>  
12.         android:layout_marginTop="10px"   <span style="font-family: Arial, Helvetica, sans-serif;">/*距离父窗体的顶部10个像素*/</span>  
13.         android:textColor="#660000"       /*控件上显示文本的颜色RGB*/  
14.         android:textSize="20px"           /*控件上显示文本的字体大小*/  
15.         android:text="我是大的文本" />  
16.     <TextView  
17.         android:layout_below="@id/tv_title"    /*当前控件位于tv_title这个控件的下方*/  
18.         android:layout_width="wrap_content"  
19.         android:layout_height="wrap_content"  
20.         android:layout_marginLeft="10px"  
21.         android:layout_marginTop="10px"  
22.         android:textColor="#660000"  
23.         android:textSize="14px"  
24.         android:text="我是小的文本" />  
25.     <CheckBox   
26.         android:layout_width="wrap_content"  
27.         android:layout_height="wrap_content"  
28.         android:layout_alignParentRight="true"    /*当前控件与父窗体的右边对齐*/  
29.         android:layout_centerVertical="true"      /*当前控件在父窗体的竖直中心位置*/  
30.         />  
31. </RelativeLayout>  

这个布局如下图所示：

第三种：表格布局

[html] view plaincopy

1.   

          表格布局：比如几行几列的格式，例如excel的样子

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.     android:background="#000000"  
6.     android:stretchColumns="1" >  //它的意思就是自动拉伸第1列
7.     <TableRow >  
8.         <TextView   
9.             android:text="姓名"  
10.             android:padding="10dip"  
11.             android:textColor="#ffffff"/>  
12.         <EditText   
13.             android:layout_marginLeft="20dp"  
14.             android:background="#ffffff"  
15.             />  
16.     </TableRow>  
17.     <TableRow >  
18.         <TextView   
19.             android:text="密码"  
20.             android:padding="10dip"  
21.             android:textColor="#ffffff"/>  
22.         <EditText  
23.             android:layout_marginLeft="20dp"  
24.             android:background="#ffffff"  
25.             android:password="true"   
26.             />  
27.     </TableRow>  
28.   
29. </TableLayout>  

效果如下：

第四种：帧布局

             帧布局：其实比较简单的理解就是，一个图片叠加到一个图片的上面，就是图片的叠加

[html] view plaincopy

1. <?xml version="1.0" encoding="utf-8"?>  
2. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.      >  
6.     <TextView  
7.         android:layout_width="match_parent"  
8.         android:layout_height="match_parent"  
9.         android:layout_gravity="center"  
10.         android:background="#ff0000" />  
11.   
12.     <TextView  
13.         android:layout_width="250dp"  
14.         android:layout_height="390dp"  
15.         android:layout_gravity="center"  
16.         android:background="#dd0000" />  
17.     <TextView  
18.         android:layout_width="180dp"  
19.         android:layout_height="300dp"  
20.         android:layout_gravity="center"  
21.         android:background="#bb0000" />  
22.     <TextView  
23.         android:layout_width="110dp"  
24.         android:layout_height="210dp"  
25.         android:layout_gravity="center"  
26.         android:background="#990000" />  
27.     <TextView  
28.         android:layout_width="40dp"  
29.         android:layout_height="120dp"  
30.         android:layout_gravity="center"  
31.         android:background="#770000" />  
32. </FrameLayout>  

效果如下：

好了，击中常见的布局方式就介绍完了，这些也是自己在看代码的过程中摸索出来的，希望对自己，对别人会有所帮助