Android学习（四）——Android布局模式

标签：

    除了上面我们谈过的控件外，其实还有非常多其他的。我们谈的基本都是非常基础的，因此其他的控件还需要学习者在后面制作中进行学习。除了这些组件外，我们还需要有一些东西把这些组件包含在内，这东西就是我们所说的布局。

    Android中有四种基本的布局模式（Layout）：LinearLayout, RelativeLayout, TableLayout, FrameLayout

 ———————————————————华丽丽的分割线——————————————————————

1. LinearLayout

    首先，我们先来看LinearLayout。这个布局在Android的APP中非常常用。这种类型就像我们生活中排队类似（假设被个人都是一个组件）。因此在排队时，我们可以横着排，也可以竖着排。接下来我们来分析一下LinearLayout中的属性。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    >

</LinearLayout>

    LinearLayout中有非常多的属性，我经常用的主要有android:layout_height，android:layout_width以及android:orientation。其中最后一个属性我们上面没有看到过。

    android:orientation说明的是LinearLayout这个布局的方向问题。也就是我们是要各个组件横着排队还是竖着排队。在这个属性中，其提供了两种选择：vertical和horizontal，其对应着往哪个方向排队。

    除了以上这些在布局中设置的属性外，我们还可以在线性布局中的各个空间中设置控件在这个布局中的位置，设置这个属性的属性名为android:layout_gravity。top,bottom,center_vertical等等，具体需要什么位置，在选项中自己进行选择。

2. RelativeLayout

    这个布局叫做相对布局。在这个布局中我们使用相对位置的属性控制组件在布局中的相对位置以及组件与组件相对位置。首先我们先看一下组件相对于布局的位置。

组件相对于布局的相对位置：

    其中的属性有android:alignParentLeft, android:alignParentRight, android:alignParentTop, android:alignParentBottom, android:centerInParent这些属性设置组件相对于这个布局的相对位置。

    在具体的使用中，比如 android:alignParentRight="true"，组件就会贴近父类的右边缘。这里的属性可以联合使用。

控件的相对位置属性：

    其中包括android:toRightOf, android:layout_above, android:toLeftOf ,android:layout_below等等属性来控制相对于一控件的定位。与相对于布局的相对位置相似，这些属性也能联合使用，具体的设置如下所示：

    比如：android:layout_below="@id/button2"

使用android:layout_alignLeft表示让一个控件的左边缘与另一个控件的左边缘对齐，同理的属性还有android:layout_alignRight等等。

3. FrameLayout

    frame有框架的意思，那我们就称它为框架布局吧。在《第一行代码》中提到，这种类型的布局用的并不是很多的。其主要功能就是将一些组件进行覆盖，后面添加的组件在前面组件的上面。在之后我们在制作分片（fragment）的时候会进一步用到，这里只是简要的说明下。

4. TableLayout

    表格类型的布局。这种类型就像表格一样，你需要将一个个组件放到表格的空格之中。我找了找，好像对于单个表格中的空格我们无法对其设置大小。对于每一列具有统一的大小。接下来我们看看布局文件中是如何书写的：

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TableRow>
        <TextView
            android:layout_height="match_parent"
            android:text="Account:"/>
        <EditText
            android:id="@+id/account"
            android:layout_height="wrap_content"
            android:hint="Input"/>
    </TableRow>
    <TableRow>
        <TextView
            android:layout_height="match_parent"
            android:text="Password:"/>
        <EditText
            android:id="@+id/password"
            android:layout_height="wrap_content"
            android:inputType="textPassword"/>
    </TableRow>
    <TableRow>
        <Button 
            android:id="@+id/login"
            android:layout_height="wrap_content"
            android:layout_span="2"
            android:text="Login"/>
    </TableRow>
</TableLayout>

    首先我们创建表格布局，接着我们需要在表格布局中添加元素。我们第一个要添加的就是行元素，即<TableRow>，这里添加的任何组件都会出现在同一行之中。每一个组件占据一列。在这个布局中，每添加一个TableRow元素即是表示在表格中添加一行。TableRow并不不指定宽度。

    因为不指定宽度，任何组件都是适合组件大小，这样会出现一个问题，那就是无法出现满屏，这样会非常影响APP的美观，因此在TableLayout中有一个属性可以指定将某一列进行拉伸，即android:stretchColumn="1"，这个属性的意思是如果屏幕中没有满屏，则将第二个控件拉长。

p.s. 在布局中，我们可以调控每个控件在布局中的偏移位置：

    android:layout_marginXXX这个属性控制一个控件上下左右方向上的偏移距离，详细的

    android:layout_marginLeft对于具体方向上的偏移。

5. 自定义布局

    除了上面介绍的四种布局外，还有很多的自定义布局。比如我们在布局之中添加子布局。因此我们先写好子布局，然后在父布局中进行引用：

    <include layout="@layout/external_layout"/>

    我们在自定义布局中我们需要添加一些按钮等需要反馈的组件，我们不可能就让它们傻傻地放在布局上面不做反应吧。下面部分我们将对具体的布局进行自定设置。我们按照书中的例子对线性布局进行设置。

    创建一个类型，继承自一些基础的4个布局的一种。

public class TitleLayout extends LinearLayout implements View.OnClickListener{
    public TitleLayout(Context context, AttributeSet attrs) {
        super(context,attrs);
        LayoutInflater.from(context).inflate(R.layout.external_layout,this);
        Button titleBack = (Button) findViewById(R.id.title_back);
        Button titleEdit = (Button) findViewById(R.id.title_edit);
        titleBack.setOnClickListener(this);
        titleEdit.setOnClickListener(this);
    }
    @Override
    public void onClick(View v){
        switch(v.getId()) {
            case R.id.title_back:
                ((Activity)getContext()).finish();
                break;
            case R.id.title_edit:
                Toast.makeText(getContext(),"You click Edit button",Toast.LENGTH_SHORT).show();
                break;
            default:

        }
    }
}

    在编写完自定义的布局之后，我们还需要对其进行将其添加到父布局之中，APP才能进行显示，具体的操作如下所示：

  <com.carels.chapterthree.TitleLayout
        android:layout_height="wrap_content"
        android:layout_width="match_parent"/>

    差不多布局就是这么多了，能设计出好的布局的人都是天才啊。我们需要的是从别人好的设计中汲取灵感，设计出自己的好看的布局。

Android学习（四）——Android布局模式

标签：

原文地址：http://www.cnblogs.com/carels/p/5674278.html