Android布局管理 #

一、布局概述 #

布局（Layout）是Android UI的基础，用于定义界面中各个控件的位置和大小关系。Android提供了多种布局管理器来满足不同的界面需求。

1.1 常用布局类型 #

布局 说明
LinearLayout 线性布局，水平或垂直排列
RelativeLayout 相对布局，相对位置排列
ConstraintLayout 约束布局，灵活高效的布局
FrameLayout 帧布局，层叠显示
TableLayout 表格布局，表格形式排列
GridLayout 网格布局，网格形式排列

1.2 布局属性 #

宽高属性 #

xml 
android:layout_width="match_parent"   <!-- 匹配父容器 -->
android:layout_width="wrap_content"   <!-- 包裹内容 -->
android:layout_width="100dp"          <!-- 固定值 -->

内外边距 #

xml 
android:padding="16dp"           <!-- 内边距 -->
android:paddingLeft="8dp"        <!-- 左内边距 -->
android:paddingTop="8dp"         <!-- 上内边距 -->
android:paddingRight="8dp"       <!-- 右内边距 -->
android:paddingBottom="8dp"      <!-- 下内边距 -->

android:layout_margin="16dp"     <!-- 外边距 -->
android:layout_marginLeft="8dp"  <!-- 左外边距 -->
android:layout_marginTop="8dp"   <!-- 上外边距 -->
android:layout_marginRight="8dp" <!-- 右外边距 -->
android:layout_marginBottom="8dp"<!-- 下外边距 -->

二、LinearLayout #

2.1 基本用法 #

LinearLayout按照水平或垂直方向排列子控件。

xml 
<?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="vertical"
    android:gravity="center"
    android:padding="16dp">
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="标题"
        android:textSize="24sp" />
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="内容"
        android:layout_marginTop="8dp" />
    
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="确定"
        android:layout_marginTop="16dp" />
        
</LinearLayout>

2.2 重要属性 #

属性 说明
android:orientation 排列方向：horizontal/vertical
android:gravity 内容对齐方式
android:layout_gravity 子控件在父容器中的对齐方式
android:layout_weight 权重，分配剩余空间
android:weightSum 权重总和

2.3 权重分配 #

xml 
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:weightSum="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="1"
        android:text="按钮3" />
        
</LinearLayout>

2.4 gravity vs layout_gravity #

xml 
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:orientation="vertical"
    android:gravity="center">
    
    <!-- gravity控制LinearLayout内部内容的位置 -->
    
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮"
        android:layout_gravity="right" />
        
    <!-- layout_gravity控制Button在LinearLayout中的位置 -->
    
</LinearLayout>

三、RelativeLayout #

3.1 基本用法 #

RelativeLayout通过相对位置关系排列子控件。

xml 
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp">
    
    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="标题"
        android:layout_centerHorizontal="true"
        android:textSize="24sp" />
    
    <TextView
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="内容"
        android:layout_below="@id/title"
        android:layout_marginTop="16dp" />
    
    <Button
        android:id="@+id/cancel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="取消"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true" />
    
    <Button
        android:id="@+id/confirm"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="确定"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true" />
        
</RelativeLayout>

3.2 相对父容器定位 #

属性 说明
android:layout_alignParentTop 与父容器顶部对齐
android:layout_alignParentBottom 与父容器底部对齐
android:layout_alignParentLeft 与父容器左边对齐
android:layout_alignParentRight 与父容器右边对齐
android:layout_centerHorizontal 水平居中
android:layout_centerVertical 垂直居中
android:layout_centerInParent 完全居中

3.3 相对其他控件定位 #

属性 说明
android:layout_above 在某控件上方
android:layout_below 在某控件下方
android:layout_toLeftOf 在某控件左边
android:layout_toRightOf 在某控件右边
android:layout_alignTop 与某控件顶部对齐
android:layout_alignBottom 与某控件底部对齐
android:layout_alignLeft 与某控件左边对齐
android:layout_alignRight 与某控件右边对齐

四、ConstraintLayout #

ConstraintLayout是Android推荐使用的布局，具有灵活高效的特点。

4.1 基本用法 #

xml 
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp">
    
    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="标题"
        android:textSize="24sp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent" />
    
    <TextView
        android:id="@+id/content"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="内容"
        android:layout_marginTop="16dp"
        app:layout_constraintTop_toBottomOf="@id/title"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent" />
    
    <Button
        android:id="@+id/cancel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="取消"
        android:layout_marginEnd="16dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintRight_toLeftOf="@id/confirm" />
    
    <Button
        android:id="@+id/confirm"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="确定"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintRight_toRightOf="parent" />
        
</androidx.constraintlayout.widget.ConstraintLayout>

4.2 约束属性 #

属性 说明
app:layout_constraintLeft_toLeftOf 左边与目标左边对齐
app:layout_constraintLeft_toRightOf 左边与目标右边对齐
app:layout_constraintRight_toLeftOf 右边与目标左边对齐
app:layout_constraintRight_toRightOf 右边与目标右边对齐
app:layout_constraintTop_toTopOf 顶部与目标顶部对齐
app:layout_constraintTop_toBottomOf 顶部与目标底部对齐
app:layout_constraintBottom_toTopOf 底部与目标顶部对齐
app:layout_constraintBottom_toBottomOf 底部与目标底部对齐

4.3 居中与偏移 #

xml 
<!-- 水平居中 -->
<TextView
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent" />

<!-- 垂直居中 -->
<TextView
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent" />

<!-- 偏移（0-1之间） -->
<TextView
    app:layout_constraintHorizontal_bias="0.3"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent" />

4.4 Chain链 #

xml 
<!-- 水平链 -->
<TextView
    android:id="@+id/tv1"
    app:layout_constraintHorizontal_chainStyle="spread"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toLeftOf="@id/tv2" />

<TextView
    android:id="@+id/tv2"
    app:layout_constraintLeft_toRightOf="@id/tv1"
    app:layout_constraintRight_toLeftOf="@id/tv3" />

<TextView
    android:id="@+id/tv3"
    app:layout_constraintLeft_toRightOf="@id/tv2"
    app:layout_constraintRight_toRightOf="parent" />

链样式：

  • spread：均匀分布（默认）
  • spread_inside：两端贴边，中间均匀分布
  • packed：紧凑排列

4.5 Guidelines辅助线 #

xml 
<androidx.constraintlayout.widget.ConstraintLayout>
    
    <!-- 垂直辅助线 -->
    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.5" />
    
    <!-- 水平辅助线 -->
    <androidx.constraintlayout.widget.Guideline
        android:id="@+id/guideline_h"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_begin="100dp" />
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="@id/guideline" />
        
</androidx.constraintlayout.widget.ConstraintLayout>

五、FrameLayout #

5.1 基本用法 #

FrameLayout将子控件层叠显示，适合显示单个控件或层叠效果。

xml 
<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="200dp">
    
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/background"
        android:scaleType="centerCrop" />
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="标题"
        android:layout_gravity="bottom|center_horizontal"
        android:layout_marginBottom="16dp" />
        
</FrameLayout>

5.2 前景色 #

xml 
<FrameLayout
    android:foreground="#80000000"
    android:foregroundGravity="fill">
</FrameLayout>

六、布局优化 #

6.1 使用merge减少层级 #

xml 
<!-- include的布局使用merge -->
<merge xmlns:android="http://schemas.android.com/apk/res/android">
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮" />
</merge>

6.2 使用include复用布局 #

xml 
<!-- 定义可复用布局 title_bar.xml -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="标题" />
        
</LinearLayout>

<!-- 使用include引入 -->
<include
    layout="@layout/title_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

6.3 使用ViewStub延迟加载 #

xml 
<ViewStub
    android:id="@+id/stub"
    android:layout="@layout/progress_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />
kotlin 
val stub = findViewById<ViewStub>(R.id.stub)
stub.inflate()  // 或 stub.visibility = View.VISIBLE

6.4 使用Lint检查布局 #

Android Studio提供Lint检查，可以检测布局中的问题：

  • 嵌套层级过深
  • 无用的布局
  • 硬编码字符串

七、总结 #

本章详细介绍了Android布局管理：

  1. 布局的基本概念和属性
  2. LinearLayout线性布局
  3. RelativeLayout相对布局
  4. ConstraintLayout约束布局
  5. FrameLayout帧布局
  6. 布局优化技巧

合理使用布局可以提高界面性能和开发效率。

最后更新：2026-03-26