学习笔记|AS入门（三） 布局篇

在咱们以前的学习过程当中，老是须要和.xml布局文件接触，那布局究竟是什么呢？布局是指页面内容该如何排布，好比控件和父容器的位置关系以及控件与控件之间的位置关系是怎样的。其实除了最多见的LinearLayout 线性布局、RelativeLayout 绝对布局，AS还给咱们提供了其余几种，在Android 4.0以后，AS如今有七种布局，本篇将依次介绍，最后简单介绍安卓布局几点原则。目录见下：

• LinearLayout 线性布局
• RelativeLayout 相对布局
• FrameLayout 帧布局
• AbsoluteLayout绝对布局
• TableLayout 表格布局
• GridLayout 网格布局
• ConstraintLayout 约束布局
• 几点布局原则

在介绍以前，先要知道布局文件是如何建立的：

注意命名都要小写~

1.LinearLayout线性布局

线性布局是指子控件以水平或垂直方式排列。先看这样的一个线性布局：

从图中能够直观的看出，这个线性布局中的三个button是垂直排列的的，决定子控件的排布方向的属性就是android:orientation，它有两个选项，vertical表示垂直排列，horizontal表示水平排列，注意这个属性是在这整个LinearLayout标签之下的，是全局属性。

另外，布局和布局之间是能够嵌套的，好比下图中展现的线性布局中又嵌套一个线性布局，外线性布局的orientation使得内线性布局和三个button以vertical方式排布，内线性布局的orientation使得它本身的三个button以horizonal方式排布。

再介绍一组很重要的属性：

android:gravity（表示这个容器里全部子类控件的统一排布方式，有如下几个经常使用个选值，center水平和垂直方向均居中、center_vertical垂直居中、center_horizontal水平居中、right最右、left最左、bottom最下，可用符号 | 实现多级连用，如android:gravity=“bottom|right"）

android:layout_gravity（表示这个子控件相对于父容器的位置。可选值和gravity相同，也可多级联用。固然这些选值使得子控件是在它父容器里可得到的空间里进行的，若是这个控件周围还有别的控件可能会影响子控件的位置）

这两个属性很容易混淆，直观来看它们的差异是针对的对象不一样。gravity是对它全部直接的子类的一个统一排布，子类的子类位置须要子类去统一排布，好比一个学校要上课间操，学校要求全部的学生以班级为单位都到操场的东南角活动，至于这个班级里全部学生是否是在班级活动区域的东南角学校管不着，班级要求全班同窗那才能够。那若是这个班某个同窗是体委，不和你们都去东南角活动，而是在西南角管理班级呢？这时要对体委用layout_gravity属性，layout_gravity针对的对象是使用这个属性的控件，控制这个控件相对于直接父容器的位置。那么下面这四行代码以后的button1位置是否是就很好理解了？

最后再介绍一个局部属性 android:layout_weight，是指子类控件占当前父容器的比例，好比下图显示的button4占两份，button5和button6各占一份，那么它们的高之比就是2：1：1，但注意成立的条件是它们的高选值是wrap_content，若是是match_parent，那就成反比了。

2.RelativeLayout相对布局

相对布局是子控件以控件之间的相对位置或子类控件相对于父容器的位置排列。因此每一个子控件能够经过两种参考系来决定本身的位置。

一种是相对于父容器，相关的属性有：

android:layout_alignParentBottom（在父容器最下，true或false）、

android:layout_alignParentTop（在父容器最上） 、

android:layout_alignParentLeft（在父容器最左） 、

android:layout_alignParentRight（在父容器最右）、

android:layout_marginTop(和父容器上端的距离，单位dp）、

android:layout_marginBottom(和父容器下端的距离）、

android:layout_marginLeft(和父容器左端的距离）、

android:layout_marginRight(和父容器右端的距离）、

android:layout_margin（和父容器四周的距离）、

android:layout_centerVertical（在父类的垂直居中，true或false）、

android:layout_centerHorizontal（在父类的水平居中）、

android:layout_centerInParent（在父类的水平垂直居中）。

一种是相对于其余控件，相关的属性有：

android:layout_below（位于某控件下方，以id标记）、

android:layout_above（位于某控件上方）、

android:layout_toLeftOf（位于某控件左方）、

android:layout_toRightOf（位于某控件右方）、

android:layout_alignBottom（与某控件底部对齐，以id标记）、

android:layout_alignTop（与某控件顶部对齐） 、

android:layout_alignLeft（与某控件左边缘对齐） 、

android:layout_alignRight（与某控件右边缘对齐）、

android:layout_alignBaseline（与某控件的文本内容在一条直线上）

注意相对布局里没有layout_weight属性，上面展现的第一种相对于父容器的属性就就足够。

如今考考本身，有没有理解了下面这两个button的位置关系了呢？

3.FrameLayout帧布局

帧布局是全部子控件均放在左上角且后面元素直接覆盖在前面元素之上。两个经常使用属性：android:foreground（设置改帧布局容器的前景图像，前景图像是永远处于帧布局最上面的图像，就是不会被覆盖的图片） android:foregroundGravity（设置前景图像显示的位置）。为更直观，下图里展现的TextView都填充了颜色，能够看出textView4在最上面。

可是帧布局的这个性质有什么特别的用处呢？当给每一个TextView都设置layout_gravity="center"以后，设想用一些方法使它们闪现不一样颜色，是否是像个霓虹灯呢？感兴趣的能够好好研究帧布局具体内容~

4.AbsoluteLayout绝对布局

绝对布局是子控件经过它x，y位置来决定其位置。即android:layout_x和android:layout_y属性。可是绝对布局不常见，用x和y决定的控件在不一样大小的适配屏幕上的位置直观上会变化，在一个屏幕上的右下角并不表明在另外一个屏幕上也是右下角，适应能力差，因此AS也告诉咱们不建议使用。

5.TableLayout表格布局

表格布局是以行列的形式管理子控件，每一行是一个TableRow对象或者View对象。注意列是从0计数，第一列记为0。

先来看看几个经常使用的全局属性：

android:stretchColumns（让第几列填补一行中多余的空白，若是多列一块儿填补，用逗号分开，如android:stretchColumns=“2，3”表示地三列和第四列一块儿填补空白，若是是所有列均分空白，值为*）

android:shrinkColumns（若是一行中列太多或者某列文本内容太长，会致使某列被挤出屏幕，这个属性帮助某列收缩防止被挤）

android:collapseColumns（隐藏某列） 经常使用的局部属性有：

android:layout_column（让该子类控件显示在第几列）

android:layout_span（让该子类控件占据几列）

下图是一个简易计算器的布局，第一行是以TextView对象为一行，后面三行是以TableRow对象为一行，而后用android:stretchColumns="*"就能很方便实现每行button都均匀的填补空白，使界面更美观，若是用线性布局实现这一点就要麻烦一点了。

6.GridLayout网格布局

网格布局是在Android 4.0之后引入的一个新的布局，和表格布局有点相似，但比表格布局功能更强大一些。这有一篇 网格布局GridLayout的那些事儿 对网格布局有较详细的讲解，还有对表格布局的补充，能够看成扩展阅读。

7.ConstraintLayout 约束布局

AS2.2以后新增的约束布局，和以前出现的集中布局不一样的是，它很是适合使用可视化的方式来编写界面，但并不太适合使用XML的方式来进行编写。一样的，这一部分推荐你们阅读最全面的ConstraintLayout教程。

8.布局原则：

（1）尽可能多使用线性布局和相对布局，不用绝对布局。

（2）在布局层次同样下，线性布局比相对布局的性能要高。

（3）使用include标签增长UI的复用效率：可把重复使用的控件抽取出来放在一个xml文件里，并在须要它的xml文件里经过include标签引用。这样作也保证了UI布局的规整和易维护性。下图是一个简单的示例。

（4）使用ViewStub标签减小布局的嵌套层次，它和include同样能够用来引入一个外部布局，但不一样的是，ViewStub引入的布局不占用位置，在解析layout布局是节省了CPU和内存。可用inflate方法使之在布局中显示出来。下图是一个简单的示例。

（5）使用merge标签下降UI布局的嵌套层次：适用于布局根节点是FrameLayout且不设置background和padding等额外属性；当某个布局做为子布局被其余布局include的时候可用merge看成该布局的顶节点。

布局篇就到这里，感谢你们的观看~

>下篇预告:组件篇之Activity