#HarmonyOS:Column--Row布局

Column&Row组件的使用

  • Column表示沿垂直方向布局的容器。

  • Row表示沿水平方向布局的容器。

布局子元素在交叉轴上的对齐方式

Column容器内子元素在水平方向上的排列

HorizontalAlign.Start:子元素在水平方向左对齐。

HorizontalAlign.Center:子元素在水平方向居中对齐。

HorizontalAlign.End:子元素在水平方向右对齐。

Row容器内子元素在垂直方向上的排列

VerticalAlign.Top:子元素在垂直方向顶部对齐

VerticalAlign.Center:子元素在垂直方向居中对齐。

VerticalAlign.Bottom:子元素在垂直方向底部对齐。

布局子元素在主轴上的排列方式

在布局容器内,可以通过justifyContent属性设置子元素在容器主轴上的排列方式。可以从主轴起始位置开始排布,也可以从主轴结束位置开始排布,或者均匀分割主轴的空间。

justifyContent(FlexAlign.Start):元素在主轴方向首端对齐,第一个元素与行首对齐,同时后续的元素与前一个对齐。

justifyContent(FlexAlign.Center):元素在主轴方向中心对齐,第一个元素与行首的距离与最后一个元素与行尾距离相同

justifyContent(FlexAlign.End):元素在主轴方向尾部对齐,最后一个元素与行尾对齐,其他元素与后一个对齐

justifyContent(FlexAlign.Spacebetween):主轴方向均匀分配元素,相邻元素之间距离相同。第一个元素与行首对齐,最后一个元素与行尾对齐。

justifyContent(FlexAlign.SpaceAround):主轴方向均匀分配元素,相邻元素之间距离相同。第一个元素到行首的距离和最后一个元素到行尾的距离是相邻元素之间距离的一半。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/234032.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

推荐12款好用的在线平面设计工具,让设计更简单

平面设计是图形表达和信息展示的重要手段,在游戏场景和角色造型、插画、广告制作等艺术设计领域有着重要的应用,如海报设计、包装设计等。 平面设计强调视觉传达,一般以图像、图形和文字等视觉元素为主要手段,通过排版、配色、构…

SpringBoot、Java AOP实现方式

SpringBoot、Java AOP实现方式 搭建项目环境 我这里直接使用Maven创建项目之后再pom.xml中导入包 Spring版本 如果你的版本有最新的,最简单的办法就是,将版本都换成统一的,因为发布时候都是每个版本统一发布的,如果出现不兼容的…

大模型讲座

盘古NLP大模型典型场景 千亿大模型训练难点和解决方案 训练状态不稳定(经常训练中断等) 解决1:对loss和梯度等多维状态实时监测。对数据、学习率、参数精度、模型梯度进行针对性调整和断点恢复。 调整学习率的代码如下。调整参数、梯度类似…

kali安装HTTrack报错Unable to locate package httrack

kali安装后,直接安装Httrack导致报错 Unable to locate package httrack (这里因为解决了,无法重现,则使用错误的包httrackttttt) 原因:安装kali后第一次使用系统,则应该运行update命令 sudo …

基于ssm省出口基地公共信息服务平台论文

摘 要 现代经济快节奏发展以及不断完善升级的信息化技术,让传统数据信息的管理升级为软件存储,归纳,集中处理数据信息的管理方式。本n省出口基地公共信息服务平台就是在这样的大环境下诞生,其可以帮助管理者在短时间内处理完毕庞…

算法训练营Day19

#Java #二叉树 #双指针 开源学习资料 Feeling and experiences: 二叉搜索树的最小绝对差:力扣题目链接 给你一个二叉搜索树的根节点 root ,返回 树中任意两不同节点值之间的最小差值 。 差值是一个正数,其数值等于两值之差的…

eNSP小实验--实现全网互通

目录 一、建立以下拓扑图,并实现全网互通 二、分析 1、接入层交换机SW4、SW5划分vlan 2、汇聚层交换机SW2,SW3配置ip作为vlan网关,与SW1直连 3、核心交换机SW1配置ip 与汇聚层交换机和R1直连 4、SW1,SW2,SW3,R1配置静态路由,使得vlan10,…

算法学习——回溯算法

回溯算法 理论基础回溯法的效率回溯法解决的问题回溯法模板 组合思路回溯法三部曲 代码 组合(优化)组合总和III思路代码 电话号码的字母组合思路回溯法来解决n个for循环的问题回溯三部曲代码 组合总和思路代码 组合总和II思路代码 理论基础 什么是回溯法…

教师职业规划

教师是一份充满责任和使命感的职业,也是一个具有广泛影响力的职业。作为一名教师,不仅要传授知识,更要培养学生的品德和能力,为他们的未来发展奠定基础。因此,进行职业规划对于教师来说是非常重要的。 首先&#xff0…

VUE篇之可拖动裁剪框

涉及知识点: offsetLeft, offsetTop, offsetWidth, offsetHeight;offsetX, offsetY;clientX,clientY css:clip-path 学习直通车:HTMLElement.offsetLeft - Web API 接口参考 | MDN MouseEvent.offsetX - Web API 接…

利用原始套接字解决mac地址错误问题【南瑞SysKeeper-2000】

一:案例描述 一键可视顺控图像智能项目在网络部署过程中,对网络限制隔离安全性要求很高,用到正向隔离装置(南瑞SysKeeper-2000型号)。 图一 正向装置示意图 现场发现问题:直连网线情况下,我方…

德人合科技 | 公司电脑文件加密系统

公司电脑文件加密系统是一种可以对电脑文件进行加密的保护机制。它使用驱动层透明加密技术,能够在用户无感知的情况下对文件进行加密,从源头上保障数据安全和使用安全。 PC端访问地址: www.drhchina.com 此类系统主要有以下几个特点和功能&a…

Web前端-JavaScript(js循环)

1.循环 1.1 for循环 语法结构 for(初始化变量; 条件表达式; 操作表达式 ){//循环体 }名称作用初始化变量通常被用于初始化一个计数器,该表达式可以使用 var 关键字声明新的变量,这个变量帮我们来记录次数。条件表达式用于确定每一次循环是否能被执行。…

Git账户密码http方式的配置

Git账户密码http方式的配置 入门 git在提交时每次都需要输入密码和账号信息,可以将账号和密码进行持久化存储, 当git push的时候输入一次用户名和密码就会被记录, 不需要每次输入,提高效率,进行一下配置&#xff1…

深入学习《大学计算机》系列之第1章 1.4节——从二进制起源窥见的奥秘

一.欢迎来到我的酒馆 第1章 1.4节,从二进制起源窥见的奥秘。 目录 一.欢迎来到我的酒馆二.二进制的起源1.关于莱布尼茨2.莱布尼茨和牛顿的恩怨情仇 二.二进制的起源 本节内容属于知识拓展,通过讲解几个小故事,向大家介绍二进制的起源。 1.关…

基于低代码的文档管理系统:实现高效协作与控制

在企业和组织中,文档管理是一项至关重要的任务。文档包括各种类型的信息,如合同、报告、会议记录、产品规格等,它们都需要被妥善保管并确保随时可供查阅。 传统的文档管理方法往往效率低下,且容易出错。随着技术的发展&#xff0…

亚信安慧AntDB数据库引领大数据新纪元,星河案例彰显卓越表现

亚信科技及其附属公司亚信安慧在第六届大数据“星河”案例评选中,凭借其卓越的数据库技术实力,再次站在了行业的聚光灯下。这次的显著成果不仅是对亚信科技技术能力的肯定,更是对其在数据库领域持续创新和领先地位的认可。 图:亚信…

3D小球跑酷

目录 一、前言 二、开发环境 三、场景搭建 1. 创建项目 2. 创建场景内物体 2.1 创建跑道 2.2 创建玩家 2.3 创建障碍物 2.4 改变跑道和障碍物的颜色 2.4.1 创建材质 2.4.2 给跑道和障碍物更换材质 四、功能脚本实现 1. 创建玩家脚本 2. 相机跟随 3. 胜负的判定 3…

单光子如何“玩转”单原子?| 量子简史

在量子力学诞生约100年后的今天,物理学家仍在不断了解光与物质之间的相互作用。 上世纪初,量子力学发展的驱动力之一是人们需要了解为什么原子只能发出特定波长的光。不久之后,量子力学被应用于分子,然后是固体。从另一个方向来看…

Springboot数据加密篇

一、密码加密 1.1Hash算法(MD5/SHA-512等) 哈希算法,又称摘要算法(Digest),是一种将任意长度的输入通过散列函数变换成固定长度的输出的单向密码体制。这种映射的规则就是哈希算法,而通过原始数据映射之后得到的二进制…