Android 布局资源四种常用类型详解一、LinearLayout 线性布局 1. 核心定义 LinearLayout

本文结合课程项目 LinearLayout、RelativeLayout、TableLayout、NeonLamp，详细解析 Android 布局资源的核心特性、属性用法与实战场景，适合移动开发初学者快速掌握。

一、LinearLayout 线性布局

1. 核心定义

LinearLayout 是 Android 最基础的线性布局，所有子控件只能沿 水平（horizontal） 或 垂直（vertical） 单一方向依次排列，不支持自动换行，是线性界面的首选布局。

2. 核心特性

方向单一性：通过 android:orientation 控制排列方向，一旦设定，子控件只能沿该方向排列。
权重分配机制：通过 android:layout_weight 实现按比例分配剩余空间，是实现等宽 / 等高布局的关键。
性能高效：布局逻辑简单，绘制速度快，适合高频使用的线性界面。

3. 常用属性详解

表格

属性名	取值示例	作用说明
`android:orientation`	`horizontal` / `vertical`	控制子控件排列方向：水平 / 垂直
`android:layout_weight`	`1` / `2`	权重值，数值越大，分配到的剩余空间比例越高
`android:gravity`	`center` / `right` / `bottom`	控制子控件在布局内的对齐方式（居中 / 右对齐 / 底部对齐）
`android:layout_gravity`	`center_vertical`	控制当前控件在父布局中的对齐方式

4. 实战代码示例（等宽按钮）

xml

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:gravity="center">

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="按钮1"/>

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="按钮2"/>

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="按钮3"/>
</LinearLayout>

效果：三个按钮宽度 1:1:1 三等分，完美适配不同屏幕宽度。

5. 项目应用场景

表单页面：垂直排列输入框与提交按钮
标题栏：水平排列返回按钮、标题、设置按钮
底部导航栏：等宽排列多个 Tab 图标

6. 项目运行结果

二、RelativeLayout 相对布局

1. 核心定义

RelativeLayout 是相对定位布局，子控件通过「相对于其他控件」或「相对于父容器」的位置关系进行排列，自由度极高，可实现复杂对齐界面。

2. 核心特性

相对定位：无需嵌套，即可实现控件间的上下、左右、居中对齐
减少布局层级：避免多层嵌套导致的性能损耗
适配性强：不同屏幕尺寸下，控件位置关系保持稳定

3. 常用属性详解

表格

属性名	取值示例	作用说明
`android:layout_below`	`@id/btn_back`	当前控件位于指定控件下方
`android:layout_toRightOf`	`@id/iv_logo`	当前控件位于指定控件右侧
`android:layout_centerInParent`	`true`	当前控件在父容器中水平 + 垂直居中
`android:layout_alignParentEnd`	`true`	当前控件紧贴父容器右侧边缘
`android:layout_centerHorizontal`	`true`	当前控件在父容器中水平居中

4. 实战代码示例（登录页标题栏）

xml

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:background="@color/blue">

    <Button
        android:id="@+id/btn_back"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="返回"
        android:layout_alignParentStart="true"/>

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="登录"
        android:layout_centerInParent="true"
        android:gravity="center"/>

    <Button
        android:id="@+id/btn_setting"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="设置"
        android:layout_alignParentEnd="true"/>
</RelativeLayout>

效果：返回按钮居左、标题居中、设置按钮居右，适配不同屏幕宽度。

5. 项目应用场景

登录 / 注册页面：输入框与标签的相对对齐
个人中心页面：头像、昵称、等级等控件的复杂布局
商品详情页：图片、价格、描述的多控件对齐

6. 项目运行结果

三、TableLayout 表格布局

1. 核心定义

TableLayout 是表格布局，以 TableRow 为行容器，子控件为单元格，按行列结构排列，适合展示结构化数据。

2. 核心特性

行列结构：一个 TableRow 代表一行，行内子控件代表一列
列自适应：支持列的拉伸、收缩、隐藏，适配不同屏幕宽度
规整展示：控件自动对齐，适合表单、数据列表等场景

3. 常用属性详解

表格

属性名	取值示例	作用说明
`android:stretchColumns`	`0,2`	指定第 0、2 列可拉伸，填充剩余空间
`android:shrinkColumns`	`1`	指定第 1 列可收缩，避免内容溢出
`android:collapseColumns`	`3`	指定第 3 列隐藏，动态控制列显示
`android:layout_span`	`2`	单元格跨 2 列显示（需在子控件中设置）

4. 实战代码示例（用户信息表单）

xml

<TableLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:stretchColumns="1">

    <TableRow>
        <TextView android:text="用户名"/>
        <EditText android:hint="请输入用户名"/>
    </TableRow>

    <TableRow>
        <TextView android:text="密码"/>
        <EditText android:hint="请输入密码" android:inputType="textPassword"/>
    </TableRow>

    <TableRow>
        <TextView android:text="性别"/>
        <RadioGroup android:orientation="horizontal">
            <RadioButton android:text="男"/>
            <RadioButton android:text="女"/>
        </RadioGroup>
    </TableRow>
</TableLayout>

效果：标签列固定，输入框列拉伸填充，表单规整适配不同屏幕。

5. 项目应用场景

注册 / 表单页面：多行多列的信息录入
数据列表：商品规格、订单信息等表格展示
日历组件：日期格子的行列排列

5. 项目运行结果

四、FrameLayout 帧布局（含 NeonLamp 叠加场景）

1. 核心定义

FrameLayout 是帧布局，所有子控件默认叠加在布局的左上角，后添加的控件会覆盖在先添加的控件之上，是 Android 中性能最高的布局。

2. 核心特性

叠加显示：控件层层覆盖，适合实现角标、弹窗、动画等效果
性能最优：布局逻辑最简单，绘制速度极快
位置可控：通过 android:gravity 控制控件在布局内的位置

3. 常用属性详解

表格

属性名	取值示例	作用说明
`android:gravity`	`center` / `bottom	right`	控制子控件在布局内的位置
`android:foreground`	`@drawable/badge`	设置前景图，覆盖在所有子控件之上

4. 实战代码示例（带角标的图片）

xml

<FrameLayout
    android:layout_width="100dp"
    android:layout_height="100dp">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/avatar"/>

    <TextView
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:text="99+"
        android:background="@drawable/badge_bg"
        android:gravity="center"
        android:layout_gravity="top|right"/>
</FrameLayout>

效果：头像图片底部显示，右上角叠加红色角标，实现未读消息提示。

5. 项目应用场景

Fragment 容器：承载不同页面的 Fragment 切换
加载动画：加载框覆盖在内容之上
角标 / 标签：商品促销角标、消息未读角标
NeonLamp 项目：灯光效果叠加在背景之上

5. 项目运行结果

五、四种布局对比总结

表格

布局类型	排列方式	核心优势	适用场景	性能表现
LinearLayout	线性（水平 / 垂直）	结构简单、权重分配灵活	线性排列界面、等比例布局	高
RelativeLayout	相对位置	自由度高、减少嵌套	复杂对齐界面	中
TableLayout	表格行列	结构化展示、自适应列宽	表单、数据表格	中
NeonLamp	叠加覆盖	性能最优、实现简单	容器、叠加效果	极高

六、总结

LinearLayout：线性排列的基础布局，适合简单线性界面，靠 layout_weight 实现比例分配。
RelativeLayout：相对定位的灵活布局，适合复杂对齐场景，能有效减少布局嵌套。
TableLayout：表格结构的布局，适合展示规整的表单与数据列表。
NeonLamp：叠加显示的高效布局，是实现容器、动画、角标等效果的首选。

掌握这四种布局，即可完成绝大多数 Android 界面开发工作，也是后续学习 ConstraintLayout 等高级布局的基础。

项目运行截图说明（可直接复制到掘金）

LinearLayout 项目：展示 3 个等宽按钮在不同屏幕下的适配效果，体现 layout_weight 的比例分配能力。
RelativeLayout 项目：展示登录页标题栏 “左返回 - 中标题 - 右设置” 的对齐效果，体现相对定位的灵活性。
TableLayout 项目：展示用户信息表单的行列结构，体现表格布局的规整性与列自适应能力。
FrameLayout/NeonLamp 项目：展示叠加效果（如角标 / 灯光），体现帧布局的性能优势与叠加特性。