【翻译】(25)一般布局对象

 

【翻译】(25)一般布局对象

 

see

http://developer.android.com/guide/topics/ui/layout-objects.html

 

原文见

http://developer.android.com/guide/topics/ui/layout-objects.html

 

-------------------------------

 

Common Layout Objects

 

一般布局对象

 

-------------------------------

 

In this document

 

本文目录

 

* FrameLayout

* LinearLayout

* TableLayout

* RelativeLayout

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

 

-------------------------------

 

This section describes some of the more common types of layout objects to use in your applications. Like all layouts, they are subclasses of ViewGroup.

 

本节描述一些在你的应用程序中使用的更一般的布局对象类型。像所有布局那样，它们是ViewGroup的子类。

 

Also see the Hello Views tutorials for some guidance on using more Android View layouts.

 

另见你好View教程以获取使用更多Android视图布局的一些指引。

 

-------------------------------

 

FrameLayout

 

FrameLayout is the simplest type of layout object. It's basically a blank space on your screen that you can later fill with a single object — for example, a picture that you'll swap in and out. All child elements of the FrameLayout are pinned to the top left corner of the screen; you cannot specify a different location for a child view. Subsequent child views will simply be drawn over previous ones, partially or totally obscuring them (unless the newer object is transparent).

 

FrameLayout是最简单的布局对象类型。它基本上在屏幕上是一个空白空间，稍后你可以用一个单一对象填充——例如，你将交互进出的一张图片。FrameLayout的所有子元素被定在屏幕的左上角；你不能指定一个子视图的不同位置。随后的子视图将简单地绘画在前一个的上方，部分地或整体地模糊它们（除非较新的对象是透明的）。

 

-------------------------------

 

LinearLayout

 

LinearLayout aligns all children in a single direction — vertically or horizontally, depending on how you define the orientation attribute. All children are stacked one after the other, so a vertical list will only have one child per row, no matter how wide they are, and a horizontal list will only be one row high (the height of the tallest child, plus padding). A LinearLayout respects margins between children and the gravity (right, center, or left alignment) of each child.

 

LinearLayout以一个单一方向对齐所有子对象——垂直地或水平地，依赖于你如何定义orientation属性。所有子对象被一个接一个地堆叠，所以一个垂直列表每一行将只有一个子对象，不管它们有多宽，而水平列表将只有一行的高度（最高子对象的高度，加上内边距）。一个LinearLayout注重子对象之间的间距以及每个子对象的重力（右，中，或左对齐）。

 

LinearLayout also supports assigning a weight to individual children. This attribute assigns an "importance" value to a view, and allows it to expand to fill any remaining space in the parent view. Child views can specify an integer weight value, and then any remaining space in the view group is assigned to children in the proportion of their declared weight. Default weight is zero. For example, if there are three text boxes and two of them declare a weight of 1, while the other is given no weight (0), the third text box without weight will not grow and will only occupy the area required by its content. The other two will expand equally to fill the space remaining after all three boxes are measured. If the third box is then given a weight of 2 (instead of 0), then it is now declared "more important" than both the others, so it gets half the total remaining space, while the first two share the rest equally.

 

LinearLayout也支持赋予权重给单独的子对象。这个属性赋予一个“重要度”值给一个视图，并且允许它展开以填充在父视图中任意剩余的空间。子视图可以指定一个整型的权重值，然后在视图组中的任意剩余空间以它们声明的权重的比例赋予给子对象。默认权重为零。例如，如果有三个文本框而它们其中有两个声明权重为1，而其它没有赋予权重（0），第三个没有权重的文本框将不会增长并且将只占据它的内容所需的区域。另两个在所有三个框被度量后将同时展开以填充剩余的空间。如果第三个框之后赋予了2的权重（而非0），那么它现在被声明为比其它两个“更重要”，所以它获得全部剩余空间的一半，而前两个同时共享剩余空间。

 

-------------------------------

 

Tip: To create a proportionate size layout on the screen, create a container view group object with the layout_width and layout_height attributes set to fill_parent; assign the children height or width to 0 (zero); then assign relative weight values to each child, depending on what proportion of the screen each should have.

 

提示：为了在屏幕上创建一个比例大小的布局，创建一个容器视图组对象，其layout_width和layout_height设置为fill_parent；赋予子对象的height和width为0（零）；然后赋予相应的weight值到各自的子对象，依赖于每个子对象应该拥有的屏幕比例。

 

-------------------------------

 

The following two forms represent a LinearLayout with a set of elements: a button, some labels and text boxes. The text boxes have their width set to fill_parent; other elements are set to wrap_content. The gravity, by default, is left. The difference between the two versions of the form is that the form on the left has weight values unset (0 by default), while the form on the right has the comments text box weight set to 1. If the Name textbox had also been set to 1, the Name and Comments text boxes would be the same height.

 

以下两个表单表现一个带有一组元素的LinearLayout：一个按钮，一些标签和文本框。文本框把它们的宽度设置为fill_parent；其它元素被设置为wrap_content。默认的重力是left。两种版本的表单的不同之处在于左边的表单拥有复位的权重（默认为0），而右边的表单把评论文本框的权重设置为1。如果Name文本框同时已经被设置为1，那么Name和Comments文本框将是相同的高度。

 

（图略：

左图未填满，右图填满

）

 

Within a horizontal LinearLayout, items are aligned by the position of their text base line (the first line of the first list element — topmost or leftmost — is considered the reference line). This is so that people scanning elements in a form shouldn't have to jump up and down to read element text in neighboring elements. This can be turned off by setting android:baselineAligned="false" in the layout XML.

 

在一个水平LinearLayout中，条目通过它们的文本基线来对齐（第一个列表元素的第一行——最高或最左——被认为是参考线）。因此扫描表单中的元素的人不必跳起和跳下以阅读邻近元素中的元素文本。可以通过设置布局XML中android:baselineAligned="false"来关闭它。

 

To view other sample code, see the Hello LinearLayout tutorial.

 

要查看其它示例代码，请参见你好LinearLayout教程。

 

-------------------------------

 

TableLayout

 

TableLayout positions its children into rows and columns. TableLayout containers do not display border lines for their rows, columns, or cells. The table will have as many columns as the row with the most cells. A table can leave cells empty, but cells cannot span columns, as they can in HTML.

 

TableLayout把它的子对象放进几个行和列。TableLayout容器不显示它们的行，列，或格子的边线。表格将跟行一样有相同多的列，带有最多的格子。一个表格可以让格子为空，但格子不能横跨多列，但它们在HTML中则可以。

 

TableRow objects are the child views of a TableLayout (each TableRow defines a single row in the table). Each row has zero or more cells, each of which is defined by any kind of other View. So, the cells of a row may be composed of a variety of View objects, like ImageView or TextView objects. A cell may also be a ViewGroup object (for example, you can nest another TableLayout as a cell).

 

TableRow对象是TableLayout的子视图（每个TableRow定义表中的单一行）。每行有零个或更多格子，它们中每个用其它类型的View定义。所以，一行的格子可以由各种View对象组成，像ImageView或TextView对象。一个格子也可以是一个ViewGroup对象（例如，你可以嵌套另一个TableLayout作为一个格子）。

 

The following sample layout has two rows and two cells in each. The accompanying screenshot shows the result, with cell borders displayed as dotted lines (added for visual effect).

 

以下示例布局分别拥有两行和两格。伴随的截屏显示结果，格子边线显示为点线（增加以获取可视效果）。

 

（图略：

Views/Layouts/TableLayout/04.Stretchable

打开 Ctrl-O

另存为 Ctrl-Shift-S

）

 

-------------------------------

 

<?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>

 

-------------------------------

 

Columns can be hidden, marked to stretch and fill the available screen space, or can be marked as shrinkable to force the column to shrink until the table fits the screen. See the TableLayout reference documentation for more details.

 

列可以是隐藏的，标记为拉伸和填充可用的屏幕空间，或可以被标记为可收缩以强制列收缩直至表适合屏幕。参见TableLayout的参考文档以获取更多细节。

 

To view sample code, see the Hello TableLayout tutorial.

 

要查看示例代码，请参见你好TableLayout教程

 

-------------------------------

 

RelativeLayout

 

RelativeLayout lets child views specify their position relative to the parent view or to each other (specified by ID). So you can align two elements by right border, or make one below another, centered in the screen, centered left, and so on. Elements are rendered in the order given, so if the first element is centered in the screen, other elements aligning themselves to that element will be aligned relative to screen center. Also, because of this ordering, if using XML to specify this layout, the element that you will reference (in order to position other view objects) must be listed in the XML file before you refer to it from the other views via its reference ID.

 

RelativeLayout让子视图指定它们的位置相对于父视图或相对于各自（用ID指定）。所以你可以通过右边界对齐两个元素，或者让其中一个在另一个的下面，在屏幕中居中，中间偏左，等等。元素以所给的顺序被渲染，所以如果第一个元素在屏幕中居中，其它对齐自己到那个元素的元素将相对于屏幕正中对齐。同样，因为这个顺序，如果使用XML指定这个布局，你将要引用的元素（为了定位其它视图对象）必须在你从其它视图中通过其引用ID引用它之前列举在XML文件。

 

The example below shows an XML file and the resulting screen in the UI. Note that the attributes that refer to relative elements (e.g., layout_toLeft) refer to the ID using the syntax of a relative resource (@id/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>

 

-------------------------------

 

Some of these properties are supported directly by the element, and some are supported by its LayoutParams member (subclass RelativeLayout for all the elements in this screen, because all elements are children of a RelativeLayout parent object). The defined RelativeLayout parameters are: width, height, below, alignTop, toLeft, padding[Bottom|Left|Right|Top], and margin[Bottom|Left|Right|Top]. Note that some of these parameters specifically support relative layout positions — their values must be the ID of the element to which you'd like this view laid relative. For example, assigning the parameter toLeft="my_button" to a TextView would place the TextView to the left of the View with the ID my_button (which must be written in the XML before the TextView).

 

这些属性有一些被元素直接支持，而有一些被它的LayoutParams成员支持（为这个屏幕中所有元素子类化RelativeLayout，因为所有元素都是一个RelativeLayout父对象的子对象）。被定义的RelativeLayout参数有：width，height，below，alignTop，toLeft，padding[Bottom|Left|Right|Top]，以及margin[Bottom|Left|Right|Top]。注意这些参数有一些特别地支持相对布局位置——它们的值必须是你想让这个视图放置所相对的元素的ID。例如，赋予参数toLeft="my_button"给TextView将放置TextView到ID为my_button的View的左边。（它必须书写在XML中的TextView之前）。

 

To view this sample code, see the Hello RelativeLayout tutorial.

 

要查看这个示例代码，请参见你好RelativeLayout教程。

 

-------------------------------

 

Summary of Important View Groups

 

重要视图组的总结

 

These objects all hold child UI elements. Some provide their own form of a visible UI, while others are invisible structures that only manage the layout of their child views.

 

这些对象全都持有子用户界面元素。有一些提供它们自己的可视用户界面的形式，然而其他是不可见结构，只管理它们的子视图的布局。

 

-------------------------------

 

Class Description

 

类 描述

 

* FrameLayout Layout that acts as a view frame to display a single object.

 

* FrameLayout：行为如同一个视图帧的Layout，用于显示单一对象。

 

* Gallery A horizontal scrolling display of images, from a bound list.

 

* Gallery：来自一个被绑定列表的图片的水平滚动显示。

 

* GridView Displays a scrolling grid of m columns and n rows.

 

* GridView：显示一个m列n行的滚动格子。

 

* LinearLayout A layout that organizes its children into a single horizontal or vertical row. It creates a scrollbar if the length of the window exceeds the length of the screen.

 

* LinearLayout：一种布局，它组织它的子对象进一个单一水平或垂直的行。如果窗口的长度超过屏幕的长度，它创建一个滚动条。

 

* ListView Displays a scrolling single column list.

 

* ListView：显示一个滚动的单列列表。

 

* RelativeLayout Enables you to specify the location of child objects relative to each other (child A to the left of child B) or to the parent (aligned to the top of the parent).

 

* RelativeLayout：使你能指定子对象相对于各自（子对象A在子对象B的左边）或相对于父对象（相对于父对象的顶部对齐）的位置。

 

* ScrollView A vertically scrolling column of elements.

 

* ScrollView：一个垂直滚动的元素列。

 

* Spinner Displays a single item at a time from a bound list, inside a one-row textbox. Rather like a one-row listbox that can scroll either horizontally or vertically.

 

* Spinner：在某个时刻从一个被绑定列表中在一个单行文本框内显示单一条目。有点像一个可以水平或垂直滚动的单行列表框。

 

* SurfaceView Provides direct access to a dedicated drawing surface. It can hold child views layered on top of the surface, but is intended for applications that need to draw pixels, rather than using widgets.

 

* SurfaceView：提供对一个专用绘画表面的直接访问。它可以持有放置在表面上的子视图，但为需要绘画像素，而非使用部件的应用程序而设计。

 

* TabHost Provides a tab selection list that monitors clicks and enables the application to change the screen whenever a tab is clicked.

 

* TabHost：提供一个标签页选择列表，它监视点击并且使应用程序每当标签页被点击时改变屏幕。

 

* TableLayout A tabular layout with an arbitrary number of rows and columns, each cell holding the widget of your choice. The rows resize to fit the largest column. The cell borders are not visible.

 

* TableLayout：一个表格布局，带有一个任意数量的行和列，每格持有你选择的部件。行会改变大小以适合最大的列。格子边线是不可见的。

 

* ViewFlipper A list that displays one item at a time, inside a one-row textbox. It can be set to swap items at timed intervals, like a slide show.

 

* ViewFlipper：一个列表，在一个单行文本框中一次显示一个条目。它可以在定时的间隔时间上设置为交换条目，像一个幻灯片演示。

 

* ViewSwitcher Same as ViewFlipper.

 

* ViewSwitcher：同ViewFlipper。

 

-------------------------------

 

Except as noted, this content is licensed under Apache 2.0. For details and restrictions, see the Content License.

 

除特别说明外，本文在Apache 2.0下许可。细节和限制请参考内容许可证。

 

Android 4.0 r1 - 16 Dec 2011 21:54

 

-------------------------------

 

Portions of this page are modifications based on work created and shared by the Android Open Source Project and used according to terms described in the Creative Commons 2.5 Attribution License.

 

（此页部分内容基于Android开源项目，以及使用根据创作公共2.5来源许可证描述的条款进行修改）