当前位置: 首页 > ai >正文

Android开发-常用布局

一、LinearLayout:线性排列

LinearLayout 是最简单、最直观的布局,它将子视图按单一方向(水平或垂直)线性排列

1. 核心属性

  • android:orientation:排列方向。
    • vertical:垂直排列(从上到下)。
    • horizontal:水平排列(从左到右)。

2. 代码示例

<!-- 垂直线性布局:标题、图片、描述依次排列 -->
<LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:orientation="vertical"android:padding="16dp"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="文章标题"android:textSize="20sp"android:textStyle="bold" /><ImageViewandroid:layout_width="match_parent"android:layout_height="200dp"android:src="@drawable/article_image"android:scaleType="centerCrop" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:text="这里是文章的简短描述..."android:textSize="14sp" /></LinearLayout>

3. 权重(layout_weight)的妙用

android:layout_weight 属性允许子视图根据权重分配父容器的剩余空间

<!-- 水平布局:两个按钮平分宽度 -->
<LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:orientation="horizontal"><Buttonandroid:layout_width="0dp" <!-- 关键:设为0dp -->android:layout_height="wrap_content"android:layout_weight="1" <!-- 权重为1 -->android:text="取消" /><Buttonandroid:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1" <!-- 权重为1 -->android:text="确定" /></LinearLayout>

优点:简单易懂,适合线性排列的场景。
⚠️ 缺点:嵌套层级过深会影响性能;实现复杂相对定位较困难。

二、RelativeLayout:相对定位

RelativeLayout 允许子视图通过相对于父容器或其他兄弟视图的位置来确定自身位置,非常灵活。

1. 核心定位属性(以 android:layout_ 开头)

属性说明
layout_toLeftOf / layout_toRightOf位于某视图的左侧/右侧
layout_above / layout_below位于某视图的上方/下方
layout_alignLeft / layout_alignRight与某视图左/右对齐
layout_alignTop / layout_alignBottom与某视图顶部/底部对齐
layout_centerInParent在父容器中居中
layout_centerHorizontal / layout_centerVertical水平/垂直居中

2. 代码示例

<RelativeLayoutandroid:layout_width="match_parent"android:layout_height="200dp"android:background="#F0F0F0"><ImageViewandroid:id="@+id/icon"android:layout_width="60dp"android:layout_height="60dp"android:layout_centerVertical="true"android:layout_marginStart="16dp"android:src="@drawable/user_icon" /><TextViewandroid:id="@+id/title"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_toEndOf="@id/icon" <!-- 位于 icon 右侧 -->android:layout_alignTop="@id/icon" <!-- 与 icon 顶部对齐 -->android:layout_marginStart="16dp"android:text="用户名"android:textSize="18sp" /><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_toEndOf="@id/icon"android:layout_below="@id/title" <!-- 位于 title 下方 -->android:layout_marginStart="16dp"android:text="在线状态"android:textSize="14sp"android:textColor="#666666" /><Buttonandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentEnd="true" <!-- 对齐父容器右边缘 -->android:layout_centerVertical="true"android:layout_marginEnd="16dp"android:text="关注" /></RelativeLayout>

优点:定位灵活,减少嵌套。
⚠️ 缺点:在旧版本 Android 上性能略差于 LinearLayout;属性较多,易出错。

三、ConstraintLayout:现代布局之王(强烈推荐)

ConstraintLayout 是 Google 推荐的现代化、高性能布局。它结合了 RelativeLayout 的灵活性和扁平化的视图结构,是复杂 UI 的首选。

1. 核心概念:约束(Constraints)

  • 每个子视图必须至少有一个水平约束一个垂直约束
  • 约束可以连接到父容器的边缘或其他视图的边缘。
  • 支持链(Chains)、屏障(Barriers)、引导线(Guidelines)等高级功能。

2. 代码示例(XML 手写)

<androidx.constraintlayout.widget.ConstraintLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:padding="16dp"><ImageViewandroid:id="@+id/avatar"android:layout_width="50dp"android:layout_height="50dp"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent"app:srcCompat="@drawable/avatar" /><TextViewandroid:id="@+id/name"android:layout_width="0dp" <!-- 宽度为0,由约束决定 -->android:layout_height="wrap_content"android:text="张三"android:textSize="16sp"app:layout_constraintStart_toEndOf="@id/avatar"app:layout_constraintEnd_toStartOf="@+id/timestamp"app:layout_constraintTop_toTopOf="@id/avatar" /><TextViewandroid:id="@+id/timestamp"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="2分钟前"android:textSize="12sp"android:textColor="#888888"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintTop_toTopOf="@id/avatar" /><TextViewandroid:layout_width="0dp"android:layout_height="wrap_content"android:text="这是一条动态消息内容..."android:textSize="14sp"app:layout_constraintStart_toStartOf="@id/name"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintTop_toBottomOf="@id/name"app:layout_constraintBottom_toBottomOf="@id/avatar" /></androidx.constraintlayout.widget.ConstraintLayout>

优点

  • 扁平化结构:避免深层嵌套,性能优异。
  • 高度灵活:轻松实现复杂布局。
  • 强大的工具支持:Android Studio 的 Layout Editor 提供拖拽和自动约束功能。
  • 响应式设计:易于适配不同屏幕尺寸。

⚠️ 缺点:XML 代码可能较复杂,初学有一定门槛。

四、FrameLayout:层叠布局

FrameLayout 是最简单的布局容器之一,它将所有子视图堆叠在左上角,后面的视图会覆盖前面的视图。

1. 典型用途

  • 显示单个视图(如 ImageView)。
  • 实现Fragment的容器。
  • 创建遮罩层悬浮按钮(常与 CoordinatorLayout 配合)。

2. 代码示例

<FrameLayoutandroid:layout_width="match_parent"android:layout_height="200dp"><!-- 背景图片 --><ImageViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:src="@drawable/background"android:scaleType="centerCrop" /><!-- 叠加的标题 --><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:text="欢迎光临"android:textColor="#FFFFFF"android:textSize="24sp"android:textStyle="bold" /><!-- 右下角的悬浮按钮 --><ImageButtonandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="end|bottom"android:layout_margin="16dp"android:src="@drawable/ic_add"android:background="?attr/selectableItemBackgroundBorderless" /></FrameLayout>

优点:简单高效,适合层叠效果。
⚠️ 缺点:定位能力弱,不适合复杂排列。

五、ScrollView:滚动容器

ScrollView 是一个只能包含一个直接子视图的特殊 FrameLayout,它允许其内容在垂直方向上滚动。

1. 使用场景

当内容高度超过屏幕时,确保所有内容都可访问。

2. 代码示例

<ScrollViewandroid:layout_width="match_parent"android:layout_height="match_parent"><!-- ScrollView 只能有一个直接子View/ViewGroup --><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:orientation="vertical"android:padding="16dp"><TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="内容1..." /><TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="内容2..." /><!-- 更多内容... --><TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="内容N..." /></LinearLayout></ScrollView>

⚠️ 重要

  • ScrollView 只支持垂直滚动。需要水平滚动用 HorizontalScrollView
  • 内容过多时性能可能下降,考虑使用 RecyclerView

六、布局选型指南

场景推荐布局
简单线性排列(列表项、表单)LinearLayout
需要相对定位(复杂卡片)ConstraintLayout (首选) 或 RelativeLayout
现代、复杂、高性能 UI✅ ConstraintLayout
层叠效果(背景+文字、Fragment 容器)FrameLayout
内容过长需要滚动ScrollView / HorizontalScrollView
列表或网格(大量数据)RecyclerView (非布局容器,但常替代 ScrollView 内的 LinearLayout)

🔥 黄金法则优先选择 ConstraintLayout。它能胜任绝大多数场景,并且性能优越。

七、结语

感谢您的阅读!如果你有任何疑问或想要分享的经验,请在评论区留言交流!

http://www.xdnf.cn/news/20354.html

相关文章:

  • Environments
  • Python跳过可迭代对象前部元素完全指南:从基础到高并发系统实战
  • Rust 登堂 之 Drop 释放资源(十一)
  • 延迟 队列
  • MySQL索引和B+Tree的关系
  • 家长沉迷游戏刷剧对儿童学习体验的影响:儿童教育心理学视角分析
  • 如何在Python中使用正则表达式替换特定格式的文本?
  • 软考中级习题与解答——第三章_操作系统(1)
  • Jenkins与Kubernetes集成部署流水线
  • 【数据结构基础习题】-1- 数据结构基本操作
  • 大模型架构演进全景:从Transformer到下一代智能系统的技术路径(MoE、Mamba/SSM、混合架构)
  • Python操作MySQL的两种姿势:原生SQL与ORM框架SQLAlchemy详解
  • CesiumJS详解:打造专业级Web 3D地球仪与地图的JavaScript库
  • 计算机视觉(十一):边缘检测Canny
  • 【Java基础|第三十六篇】JDK1.8中的新特性
  • Nginx主配置文件
  • STM32 JLINK下载失败解决方案
  • 1.12 Memory Profiler Package - Summary
  • CentOS7 Hive2.3.8 安装图文教程
  • 四、神经网络的学习(中)
  • 安卓学习 之 图片控件和图片按钮
  • 2025年金融专业人士职业认证发展路径分析
  • 实现自己的AI视频监控系统-第四章-基于langchain的AI大模型与智能体应用1
  • 18.4 查看订单
  • 动态维护有效区间:滑动窗口
  • 大数据毕业设计选题推荐-基于大数据的贵州茅台股票数据分析系统-Spark-Hadoop-Bigdata
  • 【01】针对开源收银系统icepos (宝塔面板) 详细安装教程详细参考-优雅草卓伊凡
  • 大数据毕业设计选题推荐-基于大数据的国家基站整点数据分析系统-Hadoop-Spark-数据可视化-BigData
  • 【Android】View 的基础知识
  • 企业级低代码平台的条件函数系统设计:从复杂到极简的架构演进