news 2026/4/10 22:12:23

compose verticalAlignment ,horizontalAlignment,contentAlignment和Arrangement区别

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
compose verticalAlignment ,horizontalAlignment,contentAlignment和Arrangement区别

1. Alignment 是一个通用概念,但具体形式不同

容器类型属性名称作用范围是否可单个覆盖
RowverticalAlignment所有子元素的垂直对齐❌ 不可
ColumnhorizontalAlignment所有子元素的水平对齐❌ 不可
BoxcontentAlignment默认影响所有❌ 不可
BoxModifier.align()可单个覆盖✅ 可以

Modifier.align()是单独覆盖,Modifier.align()中使用的是 Arrangement

2. 正确的分类描述

Row 容器:
  • 主轴(水平)horizontalArrangement- 控制所有子元素的水平分布
  • 交叉轴(垂直)verticalAlignment- 控制所有子元素的垂直对齐(全局设置)
Column 容器:
  • 主轴(垂直)verticalArrangement- 控制所有子元素的垂直分布
  • 交叉轴(水平)horizontalAlignment- 控制所有子元素的水平对齐(全局设置)
Box 容器:
  • 整体对齐contentAlignment- 设置所有子元素的默认位置
  • 单个对齐Modifier.align()- 控制单个子元素的位置(可覆盖 contentAlignment)

3. 关键澄清:Alignment这个术语的三种用法

这是最易混淆的地方:

  1. Alignment接口/类:基础的坐标定位系统
  2. horizontalAlignment/verticalAlignment:Row/Column 的属性,全局影响所有子元素
  3. Modifier.align(alignment: Alignment):BoxScope 的扩展函数,针对单个元素
// 示例:这三个"Alignment"是不同的东西Row(verticalAlignment=Alignment.CenterVertically// 这是 Row 的属性,全局设置){// 这里不能使用 Modifier.align()}Box{// 这里可以使用 Modifier.align()Box(modifier=Modifier.align(Alignment.Center)// 这是 BoxScope 的扩展函数)}

总结

  • Arrangement:在 Row/Column 中,控制主轴方向所有子元素的分布
  • horizontalAlignment / verticalAlignment:在 Row/Column 中,控制交叉轴方向所有子元素的对齐(全局)
  • Box 的特殊机制:Box 使用contentAlignment(全局默认)和Modifier.align()(单个覆盖)
  • 重要区别:Row/Column 的 Alignment 是容器属性,影响所有子元素;Box 的Modifier.align()元素修饰符,可单独设置
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/3/20 8:38:34

斑点检测与条码识别

《斑点检测》斑点适用场景:对象在尺寸、形状和/或方向上差异很大(训练模型很难或者不可能)对象有背景中找不到的截然不同的灰度对象没有重叠或者接触斑点运行原理:Blob是先根据用户设定好的灰阶范围对图像进行分割,然后对目标进行…

作者头像 李华
网站建设 2026/4/1 22:34:59

一套非常专业且完整的智能梯控系统设计方案,涵盖了跨品牌电梯群控、VIP专属乘梯、机器人乘梯接口、高峰运力优化等核心模块。从技术架构到硬件选型、施工流程都考虑得相当周密,具备了实际落地的可操作性

前言:多奥的方案抓住了智能梯控的本质:在不影响电梯原有安全逻辑的前提下,通过外围接入方式实现智能调度和权限管控。这正是行业当前的主流技术路线。 一、方案核心优势分析 1. 技术架构的先进性 你的架构设计采用了中央控制单元(…

作者头像 李华
网站建设 2026/3/30 16:44:24

程序员必学:AI智能体开发中90%竟然是软件工程?【深度收藏】

本文揭示了AI智能体落地的残酷现实:90%工作是软件工程,仅10%涉及AI。通过冰山模型分析,水面上的10%是用户可见的AI能力(自然语言交互、内容生成),而水面下的90%则是支撑智能体运行的软件工程(前端交互、记忆管理、权限控制、工具调…

作者头像 李华
网站建设 2026/4/3 4:31:49

程序员效率翻倍:使用MCP协议构建你的私有知识库智能体

文章目录 一、先搞懂:MCP协议到底是个啥?二、核心准备:3步搭好开发环境三、实战开发:用MCP搭私有知识库智能体1. 第一步:写MCP服务器(让知识库“可被调用”)2. 第二步:写智能体客户端…

作者头像 李华
网站建设 2026/4/10 0:04:00

C++学习路线

有时间可以看一看这两个视频,都是完整的企业级的c开发 【现代C详解(98,11,14,17)】 https://www.bilibili.com/video/BV1Ea411u7qH/?share_sourcecopy_web&vd_sourcead69e43810b50c6f36db9d3d27fe06cb 【linux系统编程】 https://www.bi…

作者头像 李华