【鸿蒙开发】系统组件Row

Row组件

Row沿水平方向布局容器

接口:

Row(value?:{space?: number | string })

参数:

参数名

参数类型

必填

参数描述

space

string | number

横向布局元素间距。

从API version 9开始,space为负数或者justifyContent设置为FlexAlign.SpaceBetween、FlexAlign.SpaceAround、FlexAlign.SpaceEvenly时不生效。

默认值:0,单位vp

说明:

可选值为大于等于0的数字,或者可以转换为数字的字符串。

属性:

名称

参数类型

描述

alignItems

VerticalAlign

设置子组件在垂直方向上的对齐格式。

默认值:VerticalAlign.Center

从API version 9开始,该接口支持在ArkTS卡片中使用。

justifyContent8+

FlexAlign

设置子组件在水平方向上的对齐格式。

默认值:FlexAlign.Start

从API version 9开始,该接口支持在ArkTS卡片中使用。

UI结构示例,1行里包含3行

@Entry
@Component
struct APage {build() {Row() {Row() {Text("左部").width('100%').fontColor(Color.White).textAlign(TextAlign.Center)}.backgroundColor(Color.Red).width(100).height(100)Row() {Text("中间").width('100%').fontColor(Color.White).textAlign(TextAlign.Center)}.backgroundColor(Color.Blue).width(100).height(100)Row() {Text("右部").width('100%').fontColor(Color.White).textAlign(TextAlign.Center)}.backgroundColor(Color.Pink).width(100).height(100)}.width('100%').height('100%')}
}

水平方向对齐

FlexAlign.Start

@Entry
@Component
struct APage {build() {Row() {}.width('100%').height('100%').justifyContent(FlexAlign.Start)}
}

FlexAlign.Center

@Entry
@Component
struct APage {build() {Row() {}.width('100%').height('100%').justifyContent(FlexAlign.Center)}
}

FlexAlign.End

@Entry
@Component
struct APage {build() {Row() {}.width('100%').height('100%').justifyContent(FlexAlign.End)}
}

FlexAlign.SpaceBetween

@Entry
@Component
struct APage {build() {Row() {}.width('100%').height('100%').justifyContent(FlexAlign.SpaceBetween)}
}

FlexAlign.SpaceAround

@Entry
@Component
struct APage {build() {Row() {}.width('100%').height('100%').justifyContent(FlexAlign.SpaceAround)}
}

FlexAlign.SpaceEvenly

@Entry
@Component
struct APage {build() {Row() {}.width('100%').height('100%').justifyContent(FlexAlign.SpaceEvenly)}
}

垂直方向对齐

VerticalAlign.Top

@Entry
@Component
struct APage {build() {Row() {}.width('100%').height('100%').alignItems(VerticalAlign.Top)}
}

VerticalAlign.Center

@Entry
@Component
struct APage {build() {Row() {}.width('100%').height('100%').alignItems(VerticalAlign.Center)}
}

VerticalAlign.Bottom

@Entry
@Component
struct APage {build() {Row() {}.width('100%').height('100%').alignItems(VerticalAlign.Bottom)}
}

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

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

相关文章

用vue.js写案例——ToDoList待办事项 (步骤和全码解析)

目录 一.准备工作 二.编写各个组件的页面结构 三.实现初始任务列表的渲染 四.新增任务 五.删除任务 六.展示未完成条数 七.切换状态-筛选数据 八.待办事项(全)代码 一.准备工作 在开发“ToDoList”案例之前,需要先完成一些准备工作&a…

电力变压器数据集介绍和预处理

1 电力变压器数据集介绍 1.1 数据背景 在这个Github仓库中,作者提供了几个可以用于长序列时间序列问题的数据集。所有数据集都经过了预处理,并存储为.csv文件。数据集的范围从2016/07到2018/07。 ETT-small: 含有2个电力变压器(来自2个站点…

React - 你使用过高阶组件吗

难度级别:初级及以上 提问概率:55% 高阶组件并不能单纯的说它是一个函数,或是一个组件,在React中,函数也可以做为一种组件。而高阶组件就是将一个组件做为入参,被传入一个函数或者组件中,经过一定的加工处理,最终再返回一个组件的组合…

使用卷积神经网络(CNN)识别验证码

验证码(CAPTCHA)是一种常见的用于区分人类和机器的技术,它要求用户完成一些简单的任务或者输入一些字符以验证其身份。本文将介绍如何使用卷积神经网络(CNN)来识别常见的字符验证码,并提供详细的代码示例。…

公网环境下如何端口映射?

公网端口映射是一种网络技术,它允许将本地网络中的设备暴露在公共互联网上,以便能够从任何地方访问这些设备。通过公网端口映射,用户可以通过互联网直接访问和控制局域网中的设备,而无需在本地网络中进行复杂的配置。 公网端口映射…

动态规划基础思想

本页面主要介绍了动态规划的基本思想,以及动态规划中状态及状态转移方程的设计思路,帮助各位初学者对动态规划有一个初步的了解。 本部分的其他页面,将介绍各种类型问题中动态规划模型的建立方法,以及一些动态规划的优化技巧。 引入 [IOI1994] 数字三角形](https://www.…

AUTOSAR配置工具开发教程 - 开篇

简介 本系列的教程,主要讲述如何自己开发一套简单的AUTOSAR ECU配置工具。适用于有C# WPF基础的人员。 简易介绍见:如何打造AUTOSAR工具_autosar_mod_ecuconfigurationparameters-CSDN博客 实现版本 AUTOSAR 4.0.3AUTOSAR 4.2.2AUTOSAR 4.4.0 效果 …

GD32零基础教程第一节(开发环境搭建及工程模板介绍)

文章目录 前言一、MDK keil5安装二、设备支持包安装三、CH340串口驱动安装四、STLINIK驱动安装五、工程风格介绍总结 前言 本篇文章正式带大家开始学习GD32F407VET6国产单片机的学习,国产单片机性能强,而且价格也便宜,下面就开始带大家来介绍…

Unity 主线程和其他线程之间的数据访问

在Unity中,主线程和其他线程之间的数据访问需要小心处理,因为在多线程环境下,不当的数据访问可能导致竞争条件和数据不一致性。 在Unity中,主线程通常用于处理用户输入、更新游戏逻辑和渲染。其他线程通常用于执行耗时的计算、加…

如何保障人工智能系统开发的安全?

原文地址:https://venturebeat.com/ai/how-to-secure-ai-system-development/ 数据科学家、人工智能工程师和网络安全专家如果在开发过程中未能确保人工智能系统的安全性,可能会使组织面临巨大的经济损失和声誉风险。那么,他们应采取哪些措施…

LeetCode-移除元素

题目 给你一个数组 nums 和一个值 val,你需要 原地 移除所有数值等于 val 的元素,并返回移除后数组的新长度。 不要使用额外的数组空间,你必须仅使用 O(1) 额外空间并 原地 修改输入数组。 元素的顺序可以改变。你不需要考虑数组中超出新长…

【SQL】数据操作语言(DML):学习插入、更新和删除数据

数据查询语言(DQL)用于从数据库中检索数据,主要通过SELECT语句来实现。SELECT语句允许用户指定要检索的数据列、表以及任何筛选条件。以下是对DQL的详细介绍以及多个示例: SELECT语句基础结构: sql SELECT column1,…

如何使用群晖Synology Drive结合cpolar内网穿透实现同步Obsidian笔记文件

文章目录 一、简介软件特色演示: 二、使用免费群晖虚拟机搭建群晖Synology Drive服务,实现局域网同步1 安装并设置Synology Drive套件2 局域网内同步文件测试 三、内网穿透群晖Synology Drive,实现异地多端同步Windows 安装 Cpolar步骤&#…

PostgreSQL Systemctl启动设置

root用户 cd /usr/lib/systemd/system vi postgresql.service #增加下面内容,并根据实际内容修改 [Unit] DescriptionPostgreSQL database server Afternetwork.target [Service] Typeforking Userpostgres Grouppostgres OOMScoreAdjust-1000 EnvironmentPG_OOM_A…

软件设计师-基础知识科目-数据结构3

三、 数据结构: 时间复杂度: 背复杂度对应的代码。Tips:时间复杂度估算看最内层循环,如若没有循环和递归则为O(1)。 空间复杂度: 需要单独空间存储数据时使用。考点:非递归的空间…

go语言学习--2.函数

目录 1.函数分类 2.函数的声明和定义 3.函数传参 4.函数返回值 5.递归调用 为完成某一功能的程序指令(语句)的集合,称为函数。 1.函数分类 在Go语言中,函数是第一类对象,我们可以将函数保持到变量中。函数主要有具名和匿名之分&#x…

少儿编程 2024年3月电子学会图形化编程等级考试Scratch二级真题解析(判断题)

2024年3月scratch编程等级考试二级真题 判断题(共10题,每题2分,共20分) 26、下列积木块运行结果为false 答案:错 考点分析:考查积木综合使用,重点考查逻辑或积木的使用,或运算是只…

游戏公司面试题系列-CocosCreator实现虚拟摇杆控制角色移动中心旋转自转小球割草旋转逻辑

游戏公司面试题系列-CocosCreator实现虚拟摇杆控制角色移动&中心旋转自转小球&割草旋转逻辑<&#xff01;&#xff01;&#xff01;文章末尾有完整代码下载链接地址&#xff01;&#xff01;&#xff01;> Hello大家好&#xff01;今天我们来用最新的CocosCreat…

python|drop的应用

drop 删除列B 删除索引为1的行 删除列为‘A’&#xff0c;‘C’的列&#xff0c;axis表示方向 删除时保留原始 DataFrame&#xff08;使用 inplaceFalse&#xff09; 删除时直接修改原始 DataFrame&#xff08;使用 inplaceTrue&#xff09;

java数据结构与算法刷题-----LeetCode628. 三个数的最大乘积

java数据结构与算法刷题目录&#xff08;剑指Offer、LeetCode、ACM&#xff09;-----主目录-----持续更新(进不去说明我没写完)&#xff1a;https://blog.csdn.net/grd_java/article/details/123063846 文章目录 排序选择线性搜索最值 排序 解题思路&#xff1a;时间复杂度O( …