Android开发指南-用户界面-通用布局对象

goldenswan 发布于2年前 阅读12230次
0 条评论

通用布局对象Common Layout Objects

本章描述了可用于你的应用程序的一些更为通用的布局对象类型。像所有的布局一样,它们是ViewGroup.的子类。

也可以参见Hello Views 教程,有更多关于使用Android视图布局的指南。

框架布局FrameLayout

框架布局FrameLayout 是最简单的布局对象类型。它基本上是一个屏幕上的空白空间,你可以稍后填充一个对象-比如,一个切入切出的图片。所有框架布局的子元素被钉在屏幕左上角;你不能为子视图指定一个不一样的位置。后续的子视图只是简单在之前的视图上方绘制,部分或完全的掩盖它们(除非这个新的对象是透明的)。

线性布局LinearLayout

线性布局LinearLayout 在单一方向上对齐所有的子视图-竖向或者横向,这依赖于你怎么定义方向orientation 属性。所有子视图依次堆积,所以一个竖向列表每行只有一个子视图,不管它们有多宽,而一个横向列表将只有一行高(最高子视图的高度,加上填充)。一个线性布局LinearLayout 会考虑子视图之间的边缘空白margins以及每个子视图的引力属性(靠右,居中,或者靠左)。

线性布局LinearLayout也支持给每个单独的子视图分配一个权重。这个属性分配一个“重要性”数值给一个视图,并允许它扩展来填充父视图的任何剩余空间。子视图可以指定一个整型权重值,然后任何这个视图组中的剩余空间将按照子视图声明的比重来分配给它们。缺省权重是0。比如,如果有三个文本框,其中两个声明权重为1,而另一个未给定数值(0),这第三个没有权重的文本框将不会增长而只是占据其内容所要求的空间。其它两个将均匀分配剩余的空间。如果把第三个控件权重改为2,那意味着它被声明为比其它两个“更为重要”,因此它将占据整个空间的一半,而前面两个均分剩下的空间。

提示:要在屏幕上创建一个均衡尺寸的布局,可创建一个容器视图组对象,其layout_width layout_height 属性设置为fill_parent把子视图的heightwidth 赋值为0 然后根据比例为每个子视图分配相关的weight 值。

下面的两个窗体呈现了一个带有若干元素的线性布局LinearLayout:一个按钮,一些标签和文本框。这些文本框把它们的宽度设置为填充父视图(fill_parent;其他元素设置为包含内容(wrap_content。引力属性为缺省的靠左对齐。这两个窗体的区别是左边的那个没有设置权重,而右边那个窗体中,评论文本框权重被设置为1。如果名字也设置成1,那么名字和评论将一样高。

android linear layout

在一个水平方向的线性布局LinearLayout中,items按照文本底线位置来对齐(第一个元素的第一行-最上边或最左边-被当作参考行)。这样用户在窗体中浏览元素时并不需要上下跳动来阅读相邻元素中的文本。这个特性可以通过在XML布局中设置android:baselineAligned="false"来关闭。

要查看其他示例代码,参见Hello LinearLayout教程。

表布局TableLayout

表布局TableLayout把它的子视图定位到行和列中。表布局容器不显示行,列和单元的边界线。表的列和最多行单元数一样多。一个表可以有空单元,但是单元不能像HTML里面那样跨列。

TableRow 对象是一个TableLayout的子视图(每个TableRow定义了表中的一个单独行)。每行有0或多个单元,可用任何其他视图定义。因此,行单元可能由各个视图对象组成,如ImageViewTextView对象。一个单元也可以是一个ViewGroup对象(比如,你可以嵌入另一个表布局作为一个单元)。

下面的示例布局有两行,各有两个单元。旁边的截图显示了效果,单元边界被显示为虚线(为了增加视觉效果)。

<?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="1">
 
    <TableRow>
 
        <TextView
 
            android:text="@string/table_layout_4_open"
 
            android:padding="3dip" />
 
        <TextView
 
            android:text="@string/table_layout_4_open_shortcut"
 
            android:gravity="right"
 
            android:padding="3dip" />
 
    </TableRow>
 
  
 
    <TableRow>
 
        <TextView
 
            android:text="@string/table_layout_4_save"
 
            android:padding="3dip" />
 
        <TextView
 
            android:text="@string/table_layout_4_save_shortcut"
 
            android:gravity="right"
 
            android:padding="3dip" />
 
    </TableRow>
 
</TableLayout>

列可以被隐藏,带有延伸标记并填充可用屏幕空间,或者可以被标记为可收缩来强制这个列缩小直到表适合屏幕。参见TableLayout reference 文档获取更多信息。



相对布局RelativeLayout

相对布局RelativeLayout允许子视图指定它们和父视图或彼此之间的相对位置(通过ID指定)。因此你可以按正确的顺序对齐两个元素,或者让一个视图在另外一个下面,居于屏幕中间,左边的中间,等等。元素通过给定顺序来绘制,因此如果这第一个元素在屏幕中间,其他以它对齐的元素都会对齐到屏幕中间。同样,因为这个顺序,如果使用XML来指定这个布局,你将引用的元素(为了定位其它视图对象)必须被列在XML文件中,在你通过引用ID从其他视图中引用它之前。

这个下面的例子显示了一个 XML 文件及其界面效果。注意,在属性中引用相对元素(比如, layout_toLeft )时使用了一个相对资源语法来引用 ID @id/id )。
<?xml version="1.0" encoding="utf-8"?>
 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android
 
android:layout_width="fill_parent"
 
android:layout_height="wrap_content"
 
android:background="@drawable/blue"
 
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>

其中一些特性直接由元素支持,另外一些由它的LayoutParams成员变量支持(为所有这个屏幕中的元素子类化RelativeLayout,因为所有元素都是RelativeLayout父对象的子元素)。已定义的相对布局RelativeLayout参数是:widthheightbelowalignToptoLeftpadding[Bottom|Left|Right|Top],以及 margin[Bottom|Left|Right|Top]。注意其中一些参数明确支持相对布局位置-它们的数值必须是你的相对位置元素的ID。比如,为一个TextView分配参数toLeft="my_button" 将把TextView放在视图IDmy_button的左边(这必须写在XML中的TextView前面)。



关于重要视图组的总结Summary of Important View Groups

下面这些对象都用来容纳用户界面元素。一些提供了自己的可见界面格式,而其他一些是不可见的结构,仅仅用来管理子视图的布局。

<table Table" style="width: 100%;border-collapse: collapse;padding: 1cm 1cm 1cm 1cm" border="1" cellpadding="0" cellspacing="0" width="100%">

描述

框架布局FrameLayout

作为一个视图框架来显示一个单独的对象。

画廊Gallery 

一个水平滚动的图像显示。

网格视图GridView 

显示一个滚动网格mn行。

线性布局LinearLayout 

一个把子视图组织进单个水平或竖向行的布局。它创建一个滚动条如果窗口长度超过屏幕长度的话。

列表视图ListView 

显示一个滚动单列列表。

相对布局RelativeLayout 

使你可以指定子对象之间的相对位置(如,AB的左边)或者相对于父对象的位置(如,与父视图顶部对齐)

滚动视图ScrollView 

一个竖向的滚动元素列。

微调器Spinner 

从一组数据中每次显示一个单独的项,在一个单行的文本框里。很像可以横向或竖向滚动的单行列表框。(译注:这个并不是windows平台通常理解的那个用来上下调整数值的小控件Spin Control,虽然名字很相近)

平面视图SurfaceView 

提供一个专门的绘画平面的直接访问。它可以含有子视图层叠在这个平面上,但通常是为了给需要直接画像素的应用程序使用,而不是直接使用部件。

标签栏TabHost 

提供一个标签选择列表,监控用户点击动作并使得应用程序在一个标签被点击时改变屏幕显示。

表布局TableLayout 

一个表布局含有任意数量的行和列,每个单元包含你选择的部件。行的尺寸会自动调整来适应最大的列。单元边界不可见。

翻转视图ViewFlipper 

一个一次只显示一项的列表,在一个单行文本框里。它可以被设置成定期切换items,就像幻灯片那样。

切换视图ViewSwitcher 

和翻转视图一样。


需要 登录 后回复方可回复, 如果你还没有账号你可以 注册 一个帐号。