1.2 UI设计之基本布局

在1.1中学习了多种控件，用于丰富界面。但是如何将这些控件按照一定的顺序来排列？这里就运用到了今天学习的四种基本布局。布局简而言之，就是容纳控件的一个容器，不同的布局拥有不同的排布规律，按照这些规律摆放控件，形成界面。

1. 线性布局（LinearLayout）

线性布局，顾名思义，就是内部的控件按照线性规律（水平方向，垂直方向）排布。

android:orientation="vertical"-----垂直方向

android:orientation="horizontal"-----水平方向

垂直方向，即控件放置顺序，以从上到下顺序排布。

水平方向，即控件放置顺序，以从左到右顺序排布。

默认状态下，以horizontal--水平方向为准。

值得注意的是，当vertical垂直方向排布时，控件的layout_height不能为match_parent，这样的话一个控件就将整个垂直方向占据。同理，当为horizontal水平方向排布时，控件的layout_width不能为match_parent，否则将占据整个水平方向。

相关属性：

（1）android:layout_gravity与android:gravity的区别

android:layout_gravity是该控件在整个布局中的对齐方式，可选值一般为top,center,bottom等，注意的是，当排列方式为vertical时，对齐方式只在水平方向上生效，反之亦然。

android:gravity用于指定文字在控件中的对齐方式。

（2）android:layout_weight

个人理解，将weight理解为权重的意思。

使用weight属性时，规范写法是，将layout_width定义为0dp，layout_height依然定义为wrap_content。

然后就是weight的使用了。

以水平排列为例，在该布局中添加两个控件。

<Edittext
    android:id="@+id/input_message"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:hint="请输入"
/>

<Button
    android:id="@+id/send"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:text="send"
/>

在这里，两个控件将按1:1的宽度，水平排列。

weight计算方法为，将所有weight指定值加一起，某控件所占比例即为（该控件weight值/总值）。

2. 相对布局（RelativeLayout）

相对布局，顾名思义，即该种布局中的控件，主要以相对位置进行排列。因此，在相对布局中，属性较多。

（1）相对父布局（parent）定位

android:layout_alignParentLeft="true"------相对于屏幕左边

android:layout_alignParentRight="true"------相对于屏幕右边

android:layout_alignParentTop="true"------相对于屏幕上边

android:layout_alignParentBottom="true"------相对于屏幕下边

android:layout_centerInParent="true"------相对于屏幕中间

（2）相对控件定位

android:layout_above="@id/button3"----在id为button3的控件上方

android:layout_below="@id/button3"----在id为button3的控件下方

android:layout_toLeftOf="@id/button3"----在id为button3的控件左方

android:layout_toRightOf="@id/button3"----在id为button3的控件右方

3. 帧布局（FrameLayout）

该种布局应用场景很少，且并无方便的定位方式，所有的控件都将默认放置于左上角。

若要指定控件的对齐方式，与线性布局中的一样，可以通过layout_gravity属性来定位位置。

该种布局在碎片化管理中应用较多。

4. 百分比布局

在前面三种布局中，可以发现，只有线性布局可以通过weight实现按照比例大小放置，其余两种均不可以。因此，基于此原因，android引入了一种新的布局方式解决此问题。

百分比只为FrameLayout和RelativeLayout进行功能扩展，具体使用方式如下。

（1）在项目的build.gradle中添加百分比库的依赖

dependcies {
    compile fileTree(dir:'libs',include:['*.jar'])
    compile 'com.android.support:appcompat-v7.24.2.1'
    compile 'com.android.support:percent:24.2.1'
    testCompile 'junit:junit:4.12'
}

在修改之后，再次同步，将新库引入到项目中。

（2）按比例进行分布

android:layout_widthPercent='50%'----控件宽占据布局的50%

android:layout_heightPercent='50%'----控件高占据布局的50%