Android 布局资源实战：4 种常用类型详解

Android 布局资源实战：4 种常用类型详解

一、LinearLayout（线性布局）

项目运行效果

核心特性

• 控件沿 ** 水平（horizontal）或垂直（vertical）** 单一方向线性排列
• 支持通过 layout_weight 按比例分配剩余空间
• 结构简单、层级清晰，是入门级最常用的布局

关键代码示例

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">
    <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"/>
</LinearLayout>

适用场景

简单表单、登录页、列表项、需要按比例分配控件大小的线性排列界面。

二、FrameLayout（帧布局）

项目运行效果

核心特性

• 所有控件默认叠加摆放，后添加的控件会覆盖在先添加的控件上方
• 默认左上角对齐，可通过 layout_gravity 调整子控件位置
• 布局层级最少、渲染效率最高

关键代码示例

<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>

适用场景

图层叠加效果、Fragment 容器、加载遮罩、单控件展示场景。

三、RelativeLayout（相对布局）

项目运行效果

核心特性

• 控件以父布局或其他控件为参照物进行定位
• 无需多层嵌套即可实现错落排版，有效减少布局层级
• 支持丰富的相对定位属性（如 layout_below、layout_alignParentBottom）

关键代码示例

<?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>

适用场景

控件位置相互依赖的界面（如个人中心、商品详情页）、需要减少布局嵌套的场景。

四、TableLayout（表格布局）

项目运行效果

核心特性

• 以行（TableRow）和列的形式排列控件，类似 HTML 表格
• 支持列合并、列拉伸 / 收缩，适配不同屏幕宽度
• 适合规整的表格型界面布局

关键代码示例

<?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>

适用场景

表单数据展示、日历、计算器等需要规整行列布局的界面。

五、四种布局核心对比

布局类型	排列规则	核心优势	适用场景
LinearLayout	线性（水平 / 垂直）	简单易上手、支持比例分配	简单线性界面、表单
FrameLayout	叠加层叠	层级最少、性能最高	图层叠加、Fragment 容器
RelativeLayout	相对定位	减少嵌套、位置关联灵活	控件相互依赖的复杂界面
TableLayout	表格行列	规整行列、支持列合并	数据表格、计算器、日历

总结

1. LinearLayout 是入门首选，适合线性规整的简单界面；
2. FrameLayout 适合图层叠加和高效渲染场景；
3. RelativeLayout 能减少嵌套，实现复杂相对定位；
4. TableLayout 适合表格型数据展示，行列规整清晰。