XML布局文件通过标签和属性定义界面的组件结构与排列方式,是Android应用界面开发的基础。合理的布局编写能减少嵌套层级,提升界面渲染性能。

基础线性布局案例
线性布局是最常用的布局类型,通过android:orientation属性控制子组件的排列方向,以下是垂直排列两个按钮的示例:
<?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:padding="16dp">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="第一个按钮"
android:layout_marginBottom="12dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="第二个按钮"/>
</LinearLayout>
约束布局居中案例
约束布局通过约束关系定位组件,能减少布局嵌套,以下是将文本组件居中显示的示例:
<?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">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="居中显示的文本"
android:textSize="18sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
列表项布局案例
列表项布局通常用于RecyclerView或ListView的适配器,以下是包含头像、标题和描述的通用列表项示例:
<?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="wrap_content"
android:orientation="horizontal"
android:padding="12dp">
<ImageView
android:layout_width="48dp"
android:layout_height="48dp"
android:src="@drawable/ic_avatar"
android:layout_marginEnd="12dp"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="列表项标题"
android:textSize="16sp"
android:textStyle="bold"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="列表项描述内容"
android:textSize="14sp"
android:textColor="#666666"
android:layout_marginTop="4dp"/>
</LinearLayout>
</LinearLayout>
底部导航栏布局案例
底部导航栏是应用常见的导航结构,以下是使用线性布局实现底部三个导航项的示例:
<?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="56dp"
android:orientation="horizontal"
android:background="#FFFFFF"
android:elevation="8dp">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:layout_width="24dp"
android:layout_height="24dp"
android:src="@drawable/ic_home"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="首页"
android:textSize="12sp"
android:layout_marginTop="2dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:layout_width="24dp"
android:layout_height="24dp"
android:src="@drawable/ic_category"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="分类"
android:textSize="12sp"
android:layout_marginTop="2dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:layout_width="24dp"
android:layout_height="24dp"
android:src="@drawable/ic_mine"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我的"
android:textSize="12sp"
android:layout_marginTop="2dp"/>
</LinearLayout>
</LinearLayout>
布局编写注意事项
- 尽量减少布局嵌套层级,优先使用约束布局减少不必要的父容器
- 避免使用
layout_weight属性过多,该属性会增加布局测量耗时 - 相同样式的组件可以抽取style复用,减少重复代码
- 布局中使用的尺寸优先使用dp单位,文字使用sp单位,避免硬编码像素值