Android零基础入门第25节：最简单最常用的LinearLayout线性布局

良好的布局设计对于UI界面至关重要，在前面也简单介绍过，目前Android中的布局主要有6种，创建的布局文件默认为RelativeLayout相对布局，而在前面的示例学习中，我们只是简单利用了一下LinearLayout线性布局，那么接下来分别对其进行详细学习。

                                              

一、认识LinearLayout

线性布局是Android中较为常用的布局方式，使用LinearLayout标签。线性布局主要有两种形式，一种是水平线性布局，一种是垂直线性布局。需要注意的是Android的线性布局不会换行，当组件一个挨着一个地排列到头之后，剩下的组件将不会被显示出来。

下表显示了LinearLayout支持的常用XML属性及相关方法的说明。

LinearLayout 包含的所有子元素都受 LinearLayout.LayoutParams 控制，因此 LinearLayout包含的子元素可以额外指定如如下属性。

·         android:layout_gravity：指定该子元素在LinearLayout中的对齐方式。

·         android:layout_weight：指定该子元素在LinearLayout中所占的权重。

二、LinearLayout详解

 接下来分别从方向、填充模型、权重、对齐、内边距、外边距几个方面来进一步学习LinearLayout 的使用，当然其中一部分也适用于后续布局文件。

1、方向

通过“android:orientation”属性设置线性布局的方向，将值设置为horizontal表示行，设置为vertical表示列，默认为horizontal。

接下来通过一个简单的示例程序来学习LinearLayout 的使用用法。

同样使用WidgetSample工程，继续使用app/main/res/layout/目录下的activity_main.xml文件，在其中填充如下代码片段：

[代码]xml代码：

?

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"               android:orientation="vertical"               android:layout_width="match_parent"               android:layout_height="match_parent">     <Button         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:text="按钮一"/>     <Button         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:text="按钮二"/>     <Button         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:text="按钮三"/>     <Button         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:text="按钮四"/>     <Button         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:text="按钮五"/> </LinearLayout>

运行程序，可以看到效果。

将上面的布局文件activity_main.xml里面的android:orientation属性值修改为horizontal，重新运行程序，可以看到上图右侧所示界面效果。

2、填充模型

在学习UI界面通用属性和方法时，就接触过android:layout_width和android:layout_height两个属性。就由这两个属性控制LinearLayout 的填充模型。

·         android:layout_width：设置LinearLayout 的宽度。

·         android:layout_height：设置LinearLayout 的高度。

这两个值的属性值也有多种取值方式，同前面一样，此处不做赘述。

3、权重

从前面的水平布局图中看到五个按钮并不是平均占据屏幕宽度，如果需要这五个组件平均占据屏幕宽度，就需要使用到权重，可以通过设置android:layout_weight为相应部件分配空间比例。

将上面的示例程序的布局文件修改一下，如下所示：

[代码]xml代码：

?

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"               android:orientation="horizontal"               android:layout_width="match_parent"               android:layout_height="match_parent">     <Button         android:layout_width="0dp"         android:layout_weight="1"         android:layout_height="wrap_content"         android:text="按钮一"/>     <Button         android:layout_width="0dp"         android:layout_weight="1"         android:layout_height="wrap_content"         android:text="按钮二"/>     <Button         android:layout_width="0dp"         android:layout_weight="1"         android:layout_height="wrap_content"         android:text="按钮三"/>     <Button         android:layout_width="0dp"         android:layout_weight="1"         android:layout_height="wrap_content"         android:text="按钮四"/>     <Button         android:layout_width="0dp"         android:layout_weight="1"         android:layout_height="wrap_content"         android:text="按钮五"/> </LinearLayout>

重新运行程序，可以看到效果。

从上面的程序发现，需要使用layout_weight的视图组件，要根据LinearLayout的orientation属性值将对应的宽度或高度设置为0dp。如果orientation属性值为vertical，layout_weight指宽度，反之为高度。

继续修改布局文件，具体代码如下所示：

[代码]xml代码：

?

001 002 003 004 005 006 007 008 009 010 011 012 013 014 015 016 017 018 019 020 021 022 023 024 025 026 027 028 029 030 031 032 033 034 035 036 037 038 039 040 041 042 043 044 045 046 047 048 049 050 051 052 053 054 055 056 057 058 059 060 061 062 063 064 065 066 067 068 069 070 071 072 073 074 075 076 077 078 079 080 081 082 083 084 085 086 087 088 089 090 091 092 093 094 095 096 097 098 099 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"               android:orientation="vertical"               android:layout_width="match_parent"               android:layout_height="match_parent">     <!-- 第一排平均分配 -->     <LinearLayout         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:orientation="horizontal">         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮一"/>         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮二"/>         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮三"/>         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮四"/>         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮五"/>     </LinearLayout>       <!-- 第二排最后一个默认，其他三个平均分配剩余空间 -->     <LinearLayout         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:orientation="horizontal">         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮一"/>         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮二"/>         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮三"/>         <Button             android:layout_width="wrap_content"             android:layout_height="wrap_content"             android:text="按钮四"/>     </LinearLayout>       <!-- 第三排按照给定权重比例分配整个宽度 -->     <LinearLayout         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:orientation="horizontal">         <Button             android:layout_width="0dp"             android:layout_weight="2"             android:layout_height="wrap_content"             android:text="按钮一"/>         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮二"/>         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮三"/>         <Button             android:layout_width="0dp"             android:layout_weight="2"             android:layout_height="wrap_content"             android:text="按钮四"/>     </LinearLayout>       <!-- 第四排先满足指定宽度的组件，然后剩余空间按照权重分配    -->     <LinearLayout         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:orientation="horizontal">         <Button             android:layout_width="100dp"             android:layout_height="wrap_content"             android:text="按钮一"/>         <Button             android:layout_width="0dp"             android:layout_weight="1"             android:layout_height="wrap_content"             android:text="按钮二"/>         <Button             android:layout_width="0dp"             android:layout_weight="2"             android:layout_height="wrap_content"             android:text="按钮三"/>         <Button             android:layout_width="50dp"             android:layout_height="wrap_content"             android:text="按钮四"/>     </LinearLayout> </LinearLayout>

重新运行程序，可以看到效果。

从上图可以看到，在LinearLayout中首先为没有设置layout_weight属性的组件分配空间，然后根据各个视图组件layout_weight属性的值所占比例来分配剩余空间。

以上练习的是水平方向的权重，在垂直方向同理。需要注意的是：layout_weight只能在LinearLayout线性布局中使用，而且只能在LinearLayout中的直接子元素中使用。

到此，LinearLayout线性布局的方向、填充模型和权重已经学习完成，你都掌握了吗？由于内容较多，下一期继续学习LinearLayout线性布局的对齐。

 

今天就先到这里，如果有问题欢迎留言一起探讨，也欢迎加入Android零基础入门技术讨论微信群，共同成长！

原文链接：http://www.apkbus.com/blog-205190-68521.html