Android布局.docx
- 文档编号:29122875
- 上传时间:2023-07-20
- 格式:DOCX
- 页数:21
- 大小:197.72KB
Android布局.docx
《Android布局.docx》由会员分享,可在线阅读,更多相关《Android布局.docx(21页珍藏版)》请在冰豆网上搜索。
Android布局
View的布局显示方式有下面几种:
线性布局(LinearLayout)、相对布局(RelativeLayout)、表格布局(TableLayout)、网格视图(GridView)、标签布局(TabLayout)、列表视图(ListView)、绝对布局(AbsoluteLayout)。
本文虽然是介绍View的布局方式,但不仅仅是这样,其中涉及了很多小的知识点,绝对能给你带来Android大餐!
本文的主要内容就是分别介绍以上视图的七种布局显示方式效果及实现,大纲如下:
∙1、View布局概述
∙2、线性布局(LinearLayout)
∙2.1、Tips:
android:
layout_weight="1"
∙3、相对布局(RelativeLayout)
∙4、表格布局(TableLayout)
∙5、列表视图(ListView)
∙5.1、一个小的改进
∙5.2、补充说明
∙6、网格视图(GridView)
∙7、绝对布局()
∙8、标签布局(TabLayout)
1、view的布局显示概述
通过前面的学习我们知道:
在一个Android应用程序中,用户界面通过View和ViewGroup对象构建。
Android中有很多种View和ViewGroup,他们都继承自View类。
View对象是Android平台上表示用户界面的基本单元。
View的布局显示方式直接影响用户界面,View的布局方式是指一组View元素如何布局,准确的说是一个ViewGroup中包含的一些View怎么样布局。
ViewGroup类是布局(layout)和视图容器(Viewcontainer)的基类,此类也定义了ViewGroup.LayoutParams类,它作为布局参数的基类,此类告诉父视图其中的子视图想如何显示。
例如,XML布局文件中名为layout_something的属性(参加上篇的4.2节)。
我们要介绍的View的布局方式的类,都是直接或间接继承自ViewGroup类,如下图所示:
其实,所有的布局方式都可以归类为ViewGroup的5个类别,即ViewGroup的5个直接子类。
其它的一些布局都扩展自这5个类。
上面提到的几个ViewGroup,稍微详细点介绍一下:
∙AbsoluteLayout,绝对定位的布局方式,在它内部嵌套的元素必须指定具体的位置。
∙FrameLayout,帧布局方式,说帧不太容易理解,可以说成是层布局方式,也就是说,在它内部的元素,是一层一层的叠加在一起的。
如果用过Photoshop,或者Flash,这里面的层的概念是和他们一致的。
如果最上层的元素是不透明的,并且比下面的元素尺寸要大,那么将看不到下面的元素,只能看到顶层元素。
这些层的顺序是:
最新声明的放到最前面。
可以这样理解,Android按文件的书写顺序来组织这个布局,先声明的放在第一层,再声明的放到第二层,…,最后声明的放在最顶层。
∙LinearLayout,线性布局方式(真不知道这该怎么翻译,其实很多技术名词还是不翻译的好),这种布局比较常用,也比较简单,就是每个元素占一行,当然也可能声明为横向排放,也就是每个元素占一列。
∙RelativeLayout,相对定位的布局方式,这个比较好玩,在元素的位置的时候,使用相对位置,可以相对其他元素,也可以相对这个布局,就像我说:
我现在站在pawa和tempest的中间;或者说,我站在队伍的中间。
前者就是相对其他元素来定义位置,后者是相对整个布局来定义位置。
(注:
pawa和tempest是Android历史上很著名的两位人物,具体请参阅R)。
∙TableLayout,表格的布局方式,我真的不忍心翻译Table这个词,翻译成表格,似乎少了一些神韵,这里面的Table和HTML中的Table非常像,就连写法都非常像。
下面分小节分别介绍View的七种布局显示方式。
2、线性布局(LinearLayout)
线性布局:
是一个ViewGroup以线性方向显示它的子视图(view)元素,即垂直地或水平地。
之前我们的HelloWorld!
程序中view的布局方式就是线性布局的,一定不陌生!
如下所示res/layour/main.xml:
01
xmlversion="1.0" encoding="utf-8"?
>
02
android=" 03 android: layout_width="fill_parent" 04 android: layout_height="fill_parent" 05 android: orientation="horizontal"> --haveaneyeon! --> 06 id="@+id/button1" 07 android: layout_width="wrap_content" 08 android: layout_height="wrap_content" 09 android: text="Hello,IamaButton1" 10 android: layout_weight="1" 11 /> 12 id="@+id/button2" 13 android: layout_width="wrap_content" 14 android: layout_height="wrap_content" 15 android: text="Hello,IamaButton2" 16 android: layout_weight="1" 17 /> 18 id="@+id/button3" 19 android: layout_width="wrap_content" 20 android: layout_height="wrap_content" 21 android: text="Hello,IamaButton3" 22 android: layout_weight="1" 23 /> 24 id="@+id/button4" 25 android: layout_width="wrap_content" 26 android: layout_height="wrap_content" 27 android: text="Hello,IamaButton4" 28 android: layout_weight="1" 29 /> 30 id="@+id/button5" 31 android: layout_width="wrap_content" 32 android: layout_height="wrap_content" 33 android: text="Hello,IamaButton5" 34 android: layout_weight="1" 35 /> 36 从上面可以看出根LinearLayout视图组(ViewGroup)包含5个Button,它的子元素是以线性方式(horizontal,水平的)布局,运行效果如下图所示: 如果你在android: orientation="horizontal"设置为vertical,则是是垂直或者说是纵向的,如下图所示: 2.1、Tips: android: layout_weight="1" 没有了这个属性,我们本来定义的5个Button运行后却只显示了2个Button,为什么呢? ? "weight"顾名思义是权重的意思,layout_weight用于给一个线性布局中的诸多视图的重要程度赋值。 所有的视图都有一个layout_weight值,默认为零,意思是需要显示多大的视图就占据多大的屏幕空间。 这就不难解释为什么会造成上面的情况了: Button1~Button5都设置了layout_height和layout_width属性为wrap_content即包住文字内容,他们都没有设置layout_weight属性,即默认为0.,这样Button1和Button2根据需要的内容占据了整个屏幕,别的就显示不了啦! 若赋一个高于零的值,则将父视图中的可用空间分割,分割大小具体取决于每一个视图的layout_weight值以及该值在当前屏幕布局的整体layout_weight值和在其它视图屏幕布局的layout_weight值中所占的比率而定。 举个例子: 比如说我们在水平方向上有一个文本标签和两个文本编辑元素。 该文本标签并无指定layout_weight值,所以它将占据需要提供的最少空间。 如果两个文本编辑元素每一个的layout_weight值都设置为1,则两者平分在父视图布局剩余的宽度(因为我们声明这两者的重要度相等)。 如果两个文本编辑元素其中第一个的layout_weight值设置为1,而第二个的设置为2,则剩余空间的三分之二分给第一个,三分之一分给第二个(数值越小,重要度越高)。 这个属性很关键,如果你没有显示设置它,它默认为0。 把上面布局文件(水平显示的那个)中的这个属性都去掉,运行会得出如下结果: 没有了这个属性,我们本来定义的5个Button运行后却只显示了2个Button,为什么呢? ? " weight " 顾名思义是权重的意思,layout_weight用于给一个线性布局中的诸多视图的重要程度赋值。 所有的视图都有一个layout_weight值,默认为零,意思是需要显示多大的视图就占据多大的屏幕空间。 这就不难解释为什么会造成上面的情况了: Button1 ~ Button5都设置了layout_height和layout_width属性为wrap_content即包住文字内容,他们都没有设置layout_weight属性,即默认为0.,这样Button1和Button2根据需要的内容占据了整个屏幕,别的就显示不了啦! 若赋一个高于零的值,则将父视图中的可用空间分割,分割大小具体取决于每一个视图的layout_weight值以及该值在当前屏幕布局的整体layout_weight值和在其它视图屏幕布局的layout_weight值中所占的比率而定。 举个例子: 比如说我们在水平方向上有一个文本标签和两个文本编辑元素。 该文本标签并无指定layout_weight值,所以它将占据需要提供的最少空间。 如果两个文本编辑元素每一个的layout_weight值都设置为1,则两者平分在父视图布局剩余的宽度(因为我们声明这两者的重要度相等)。 如果两个文本编辑元素其中第一个的layout_weight值设置为1,而第二个的设置为2,则剩余空间的三分之二分给第一个,三分之一分给第二个(数值越小,重要度越高)。 3、相对布局(RelativeLayout) 相对布局: 是一个ViewGroup以相对位置显示它的子视图(view)元素,一个视图可以指定相对于它的兄弟视图的位置(例如在给定视图的左边或者下面)或相对于RelativeLayout的特定区域的位置(例如底部对齐,或中间偏左)。 相对布局是设计用户界面的有力工具,因为它消除了嵌套视图组。 如果你发现你使用了多个嵌套的LinearLayout视图组后,你可以考虑使用一个RelativeLayout视图组了。 看下面的res/layour/main.xml: 01 xml version="1.0" encoding="utf-8"? > 02 android=" 03 android: layout_width="fill_parent" 04 android: layout_height="fill_parent"> 05 06 android: id="@+id/label" 07 android: layout_width="fill_parent" 08 android: layout_height="wrap_content" 09 android: text="Typehere: "/> 10 11 android: id="@+id/entry" 12 android: layout_width="fill_parent" 13 android: layout_height="wrap_content" 14 android: background="@android: drawable/editbox_background" 15 android: layout_below="@id/label"/> --haveaneyeon! --> 16 从上面的布局文件我们知道,RelativeLayout视图组包含一个TextView、一个EditView、两个Button,注意标记了 --haveaneyeon! -->(请注意运行代码的时候,请把这些注释去掉,否则会运行出错,上面加上是为了更加醒目! )的属性,在使用相对布局方式中就是使用这些类似的属性来定位视图到你想要的位置,它们的值是你参照的视图的id。 这些属性的意思很简单,就是英文单词的直译,就不多做介绍了。 运行之后,得如下结果: 4、表格布局(TableLayout) 表格布局: 是一个ViewGroup以表格显示它的子视图(view)元素,即行和列标识一个视图的位置。 其实Android的表格布局跟HTML中的表格布局非常类似,TableRow 就像HTML表格的 用表格布局需要知道以下几点: ∙android: shrinkColumns,对应的方法: setShrinkAllColumns(boolean),作用: 设置表格的列是否收缩(列编号从0开始,下同),多列用逗号隔开(下同),如android: shrinkColumns="0,1,2",即表格的第1、2、3列的内容是收缩的以适合屏幕,不会挤出屏幕。 ∙android: collapseColumns,对应的方法: setColumnCollapsed(int,boolean),作用: 设置表格的列是否隐藏 ∙android: stretchColumns,对应的方法: setStretchAllColumns(boolean),作用: 设置表格的列是否拉伸 看下面的res/layour/main.xml: 01 xml version="1.0" encoding="utf-8"? > 02 android=" 03 android: layout_width="fill_parent" 04 android: layout_height="fill_parent" 05 android: shrinkColumns="0,1,2"> --haveaneyeon! --> 06 --row1--> 07 id="@+id/button1" 08 android: layout_width="wrap_content" 09 android: layout_height="wrap_content" 10 android: text="Hello,IamaButton1" 11 android: layout_column="0" 12 /> 13 id="@+id/button2" 14 android: layout_width="wrap_content" 15 android: layout_height="wrap_content" 16 android: text="Hello,IamaButton2" 17 android: layout_column="1" 18 /> 19 20 --row2--> 21 id="@+id/button3" 22 android: layout_width="wrap_content" 23 android: layout_height="wrap_content" 24 android: text="Hello,IamaButton3" 25 android: layout_column="1" 26 /> 27 id="@+id/button4" 28 android: layout_width="wrap_content" 29 android: layout_height="wrap_content" 30 android: text="Hello,IamaButton4" 31 android: layout_column="1" 32 /> 33 34 35 id="@+id/button5" 36 android: layout_width="wrap_content" 37 android: layout_height="wrap_content" 38 android: text="Hello,IamaButton5" 39 android: layout_column="2" 40 /> 41 42 运行之后可以得出下面的结果: 5、列表视图(ListView) 列表布局: 是一个ViewGroup以列表显示它的子视图(view)元素,列表是可滚动的列表。 列表元素通过ListAdapter自动插入到列表。 ListAdapter: 扩展自Adapter,它是ListView和数据列表之间的桥梁。 ListView可以显示任何包装在ListAdapter中的数据。 该类提供两个公有类型的抽象方法: 1.public abstract boolean areAllItemsEnabled(): 表示ListAdapter中的所有元素是否可激活的? 如果返回真,即所有的元素是可选择的即可点击的。 2.public abstract boolean isEnabled(int position): 判断指定位置的元素是否可激活的? 下面通过一个例子来,创建一个可滚动的列表,并从一个字符串数组读取列表元 如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。 copyright@ 2008-2022 冰点文档网站版权所有 经营许可证编号:鄂ICP备2022015515号-1标记。