Android 四大常用布局详解（附项目运行效果）

_xxx3
0 阅读6分钟

作为 Android 开发的入门核心，布局（Layout）决定了界面中控件的排列方式。下面结合 4 个跑通的项目，详细拆解LinearLayout、RelativeLayout、TableLayout，以及第二个项目用到的自定义 / 嵌套布局（以 NeonLamp 为例） ，帮你彻底搞懂它们的用法和区别。

一、LinearLayout（线性布局）

1. 项目运行效果

image.png

2. 核心特性

LinearLayout 是 Android 最基础的布局，核心特点是让子控件按「水平」或「垂直」方向线性排列，不会重叠，适合简单的线性界面（如顶部导航栏、列表项）。

  • 关键属性：

    • android:orientation：指定排列方向，horizontal（水平）、vertical（垂直）
    • android:layout_weight：按比例分配剩余空间，实现自适应布局
    • android:gravity：控制子控件在布局内的对齐方式

  • 项目代码逻辑：该项目在activity_main.xml中使用水平方向的 LinearLayout，将 3 个按钮横向排列，是线性布局最典型的用法。

<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="2"
    android:text="按钮3" />

3. 优缺点

优点：简单易用、性能高、逻辑清晰，适合线性排列的场景

缺点：只能单向排列，复杂界面需要多层嵌套，会降低渲染性能

二、RelativeLayout（相对布局）

1. 项目运行效果

image.png

2. 核心特性

RelativeLayout 的核心是让子控件以「父布局」或「其他子控件」为参照物进行定位，可以灵活控制控件的相对位置，适合复杂的非规则布局。

  • 关键属性：

    • 相对于父布局：layout_alignParentTop（靠上）、layout_alignParentLeft（靠左）、layout_centerInParent（居中）
    • 相对于其他控件：layout_toRightOf（在某控件右侧）、layout_below（在某控件下方）、layout_alignTop（与某控件顶部对齐）

  • 项目代码逻辑：该项目将 3 个按钮分别定位在屏幕左下角、中间、右上角，完全通过相对位置实现，无需嵌套布局。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    style="@style/AppTheme"
    android:id="@+id/mainRelativelayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="1dp"

    >
    <Button
        android:id="@+id/btn_one"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮1"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="20dp"/>
    <Button
        android:id="@+id/btn_two"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮2"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="260dp"/>

    <Button
        android:id="@+id/btn_three"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@id/btn_two"
        android:layout_marginLeft="-5dp"
        android:layout_marginBottom="151dp"
        android:layout_toRightOf="@id/btn_two"
        android:text="按钮3" />
</RelativeLayout>

3. 优缺点

优点：灵活度高、减少布局嵌套、适配不同屏幕尺寸

缺点：属性多、逻辑复杂，控件过多时易出现依赖冲突，性能弱于 LinearLayout

三、TableLayout（表格布局）

1. 项目运行效果

image.png

2. 核心特性

TableLayout 以 ** 表格（行 + 列）** 的形式排列子控件，自动将布局划分为多列，适合需要规整网格的场景（如设置页、表单）。

  • 关键属性：

    • android:stretchColumns：指定可拉伸的列，填充剩余空间
    • android:shrinkColumns：指定可收缩的列，防止内容溢出
    • TableRow：表格行容器，每个TableRow代表一行，内部控件按顺序占列

  • 项目代码逻辑：该项目通过TableRow实现了不规则表格：第一行 2 个按钮，第二行 2 个按钮，第三行 1 个按钮，通过stretchColumns让列自适应宽度。

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:stretchColumns="2" >
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="0"
            android:text="按钮1" />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:text="按钮2" />
    </TableRow>
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="1"
            android:text="按钮3" />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="2"
            android:text="按钮4" />
    </TableRow>
    <TableRow>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_column="2"
            android:text="按钮5" />
    </TableRow>
</TableLayout>

3. 优缺点

优点：天然支持表格结构、规整易维护，适合表单类界面

缺点：灵活性差，无法实现复杂的非规则布局，列宽控制有限

四、自定义 / 嵌套布局（以 NeonLamp 项目为例）

1. 项目运行效果

image.png

2. 核心特性

NeonLamp 项目的核心是多层嵌套布局 + 自定义绘制，本质是用基础布局组合出复杂效果，这里用了FrameLayout（帧布局）作为根布局，叠加多层自定义 View 实现霓虹方块效果。

  • FrameLayout 核心特点：所有子控件默认堆叠在屏幕左上角，后添加的控件会覆盖先添加的，适合图层叠加、轮播图、自定义绘制等场景。

  • 项目代码逻辑：根布局用 FrameLayout，多层自定义 View 依次叠加，从大到小（红→绿→蓝→红→黑），形成嵌套方块的霓虹效果。

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <Button
        android:id="@+id/btn_one"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_gravity="center"
        android:background="#ff0000" />
    <Button
        android:id="@+id/btn_two"
        android:layout_width="220dp"
        android:layout_height="220dp"
        android:layout_gravity="center"
        android:background="#00ff00" />
    <Button
        android:id="@+id/btn_three"
        android:layout_width="140dp"
        android:layout_height="140dp"
        android:layout_gravity="center"
        android:background="#0000ff" />
    <Button
        android:id="@+id/btn_four"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_gravity="center"
        android:background="#ff1243" />
    <Button
        android:id="@+id/btn_five"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:layout_gravity="center"
        android:background="#324678" />
</FrameLayout>

3. 优缺点

优点：灵活度拉满，可实现任意复杂的界面和动画效果

缺点：需要自定义 View，开发成本高，多层嵌套会影响性能

五、四大布局核心对比表

布局类型核心排列逻辑适用场景性能灵活度
LinearLayout水平 / 垂直线性排列简单线性界面（导航栏、列表项）高低
RelativeLayout相对父控件 / 子控件定位复杂非规则布局中高
TableLayout表格行 + 列排列表单、设置页等规整网格中中
FrameLayout（嵌套 / 自定义）图层堆叠自定义绘制、轮播图、复杂动画低（嵌套多）极高

六、新手开发建议

  1. 优先用 LinearLayout：简单界面首选，性能最优，减少嵌套
  2. 复杂界面用 ConstraintLayout：现在 Android 官方推荐的布局，替代 RelativeLayout，性能更好、灵活度更高（本作业为传统四大布局，实际开发推荐 ConstraintLayout）
  3. 表格场景用 TableLayout：表单类界面直接用，无需自己计算列宽
  4. 图层叠加用 FrameLayout：自定义 View、轮播图等场景使用，避免多层嵌套
avatar
文章
阅读
粉丝