android菜鸟学习笔记7----android布局(二)
3.FrameLayout:帧布局
如同Flash或者photoshop中图层的概念,在上面的图层遮盖下面的图层,没被遮到的地方仍然显示出来。
右击res/layout,然后在弹出的菜单中选择new,然后选择Android Xml File,要新建FrameLayout布局文件,就选择FrameLayout作为其根节点即可。文件名为frame_layout.xml。
代码如下:
1 <?xml version="1.0" encoding="utf-8"?> 2 3 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 4 5 android:layout_width="match_parent" 6 7 android:layout_height="match_parent" > 8 9 <ImageView 10 11 android:src="@drawable/bg" 12 13 android:layout_gravity="center" 14 15 android:layout_width="wrap_content" 16 17 android:layout_height="wrap_content"/> 18 19 <ImageView 20 21 android:src="@drawable/hero" 22 23 android:layout_width="wrap_content" 24 25 android:layout_gravity="center" 26 27 android:layout_height="wrap_content"/> 28 29 </FrameLayout>
依次放置两个ImageView用于显示两张图片,第一张为背景图片,第二张为一个人物图片。
修改FirstActivity中setContentView(R.layout.frame_layout);
显示效果如下:
先添加的控件位于下面,后添加的控件位于上面。
4.AbsoluteLayout:绝对布局
根据绝对坐标位置进行布局,不灵活,故而很少使用。
eclipse中也提示:AbsoluteLayout is deprecated,即不建议使用绝对布局。
新建一个layout文件,名为absolute_layout.xml,代码入下:
1 <?xml version="1.0" encoding="utf-8"?> 2 3 <AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android" 4 5 android:layout_width="match_parent" 6 7 android:layout_height="match_parent" > 8 9 <Button 10 11 android:layout_width="wrap_content" 12 13 android:layout_height="wrap_content" 14 15 android:layout_x="100dp" 16 17 android:layout_y="100dp" 18 19 android:text="aaaaaa" 20 21 /> 22 23 </AbsoluteLayout>
修改FirstActivity中代码:setContentView(R.layout.absolute_layout);
显示如下:
属性:
android:layout_x 指定控件在父布局的x轴坐标
android:layout_y 指定控件在父布局的y轴坐标
5.TableLayout:表格布局
需要配合TableRow进行使用,也不是太常用。
在TableLayout中每加入一个TableRow子节点,就表示在表格中加入了一行,之后在TableRow中每加入一个控件,就表示加入了一列。注意TableRow单元行里的单元格的宽度小于默认的宽度时就不起作用,其默认是fill_parent,高度可以自定义大小。
如果直接在TableLayout中添加控件,那么该控件将会占用一行。
新建一个layout布局文件,名为table_layout.xml,代码如下:
1 <?xml version="1.0" encoding="utf-8"?> 2 3 <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" 4 5 android:layout_width="match_parent" 6 7 android:layout_height="match_parent" 8 9 > 10 11 <Button 12 13 android:layout_width="wrap_content" 14 15 android:layout_height="wrap_content" 16 17 android:text="aaaaaa" 18 19 /> 20 21 <TableRow > 22 23 <Button 24 25 android:layout_width="wrap_content" 26 27 android:layout_height="wrap_content" 28 29 android:text="bbbbbb" 30 31 /> 32 33 <Button 34 35 android:layout_width="wrap_content" 36 37 android:layout_height="wrap_content" 38 39 android:text="cccccc" 40 41 /> 42 43 <Button 44 45 android:layout_width="wrap_content" 46 47 android:layout_height="wrap_content" 48 49 android:text="bbbbbb" 50 51 /> 52 53 <Button 54 55 android:layout_width="wrap_content" 56 57 android:layout_height="wrap_content" 58 59 android:text="cccccc" 60 61 /> 62 63 <Button 64 65 android:layout_width="wrap_content" 66 67 android:layout_height="wrap_content" 68 69 android:text="bbbbbb" 70 71 /> 72 73 <Button 74 75 android:layout_width="wrap_content" 76 77 android:layout_height="wrap_content" 78 79 android:text="cccccc" 80 81 /> 82 83 </TableRow> 84 85 <TableRow > 86 87 <Button 88 89 android:layout_width="wrap_content" 90 91 android:layout_height="wrap_content" 92 93 android:text="dddddd" 94 95 /> 96 97 </TableRow> 98 99 <Button 100 101 android:layout_width="wrap_content" 102 103 android:layout_height="wrap_content" 104 105 android:text="eeeeee" 106 107 /> 108 109 </TableLayout>
修改setContentView(R.layout.table_layout);
显示效果如下:
第0行一个按钮aaaaaa
第1行6个按钮,但是父控件宽度有限,只显示了5个
第2行一个TableRow,里面加了一个按钮dddddd
第3行也是一个按钮eeeeee
主要属性:
android:shrinkColumns 设置收缩的列,其值为要收缩的列的索引,从0开始,多个时用逗号分隔。
如:android:shrinkColumns="0,2",表示第0和第2列收缩,显示效果如下:
可以看出没有放在TableRow中的行没有被收缩。
android:stretchColumns 设置拉伸的列,其值为要收缩的列的索引,从0开始,多个时用逗号分隔。如上显示中第1行有6个按钮,父容器宽度不够用,此时拉伸任何一列都不会有效果。若第1行只有两个按钮,此时,设置android:stretchColumns="1",则会把第1列拉伸,充满父容器剩下的空间。显示效果如下:
android:collapseColumns 设置要隐藏的列,这里的隐藏于visibility设置为gone效果相同的。隐藏之后不占用父容器的空间。
如:android:collapseColumns="1,3,5",则第一行6个按钮,只剩下3个bbbbbb
6.GridLayout:网格布局
Android4.0中新增的布局管理器。因此,在android4.0之后的版本才可以直接使用。
新建项目设置最小SDK为14,其他也要高于14。
新建一个layout文件,名为grid_layout.xml,代码如下:
1 <?xml version="1.0" encoding="utf-8"?> 2 3 <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" 4 5 android:layout_width="match_parent" 6 7 android:layout_height="match_parent" 8 9 android:columnCount="5" 10 11 android:rowCount="4"> 12 13 <Button 14 15 android:layout_row="0" 16 17 android:text="aaaaaa" 18 19 android:layout_width="wrap_content" 20 21 android:layout_height="wrap_content"/> 22 23 <Button 24 25 android:layout_row="1" 26 27 android:layout_column="0" 28 29 android:text="bbbbbb" 30 31 android:layout_width="wrap_content" 32 33 android:layout_height="wrap_content"/> 34 35 <Button 36 37 android:layout_row="2" 38 39 android:layout_column="2" 40 41 android:text="cccccc" 42 43 android:layout_width="wrap_content" 44 45 android:layout_height="wrap_content"/> 46 47 <Button 48 49 android:layout_row="3" 50 51 android:layout_column="1" 52 53 android:text="dddddd" 54 55 android:layout_width="wrap_content" 56 57 android:layout_height="wrap_content"/> 58 59 </GridLayout>
显示效果如下:
整个布局被分为4行5列。
主要属性:
android:columnCount 设置GridLayout的列数
android:rowCount设置GridLayou的行数
每个添加到GridLayout中的子控件都可以设置如下属性:
android:layout_row 设置该元素所在行,从0开始
android:layout_column 设置该元素所在列,从0开始
android:layout_rowSpan 设置该元素所跨的行数
android:layout_columnSpan 设置该元素所跨的列数。