鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Row容器组件

2024-02-29 06:04

本文主要是介绍鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Row容器组件,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Row容器组件

一、操作环境

操作系统:  Windows 10 专业版、IDE:DevEco Studio 3.1、SDK:HarmonyOS 3.1+

二、Row组件

沿水平方向布局容器。

子组件

可以包含子组件。

接口

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

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

参数

参数名

参数类型

必填

参数描述

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卡片中使用。

三、示例

代码
// xxx.ets
@Entry
@Component
struct RowExample {build() {Column({ space: 5 }) {// 设置子组件水平方向的间距为5Text('space').width('90%')Row({ space: 5 }) {Row().width('30%').height(50).backgroundColor(0xAFEEEE)Row().width('30%').height(50).backgroundColor(0x00FFFF)}.width('90%').height(107).border({ width: 1 })// 设置子元素垂直方向对齐方式Text('alignItems(Bottom)').width('90%')Row() {Row().width('30%').height(50).backgroundColor(0xAFEEEE)Row().width('30%').height(50).backgroundColor(0x00FFFF)}.width('90%').alignItems(VerticalAlign.Bottom).height('15%').border({ width: 1 })Text('alignItems(Center)').width('90%')Row() {Row().width('30%').height(50).backgroundColor(0xAFEEEE)Row().width('30%').height(50).backgroundColor(0x00FFFF)}.width('90%').alignItems(VerticalAlign.Center).height('15%').border({ width: 1 })// 设置子元素水平方向对齐方式Text('justifyContent(End)').width('90%')Row() {Row().width('30%').height(50).backgroundColor(0xAFEEEE)Row().width('30%').height(50).backgroundColor(0x00FFFF)}.width('90%').border({ width: 1 }).justifyContent(FlexAlign.End)Text('justifyContent(Center)').width('90%')Row() {Row().width('30%').height(50).backgroundColor(0xAFEEEE)Row().width('30%').height(50).backgroundColor(0x00FFFF)}.width('90%').border({ width: 1 }).justifyContent(FlexAlign.Center)}.width('100%')}
}
图例

你有时间常去我家看看我在这里谢谢你啦...

我家地址:亚丁号

最后送大家一首诗:

山高路远坑深,
大军纵横驰奔,

谁敢横刀立马?
惟有点赞加关注大军。

这篇关于鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Row容器组件的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


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

相关文章

IntelliJ IDEA2025创建SpringBoot项目的实现步骤

《IntelliJIDEA2025创建SpringBoot项目的实现步骤》本文主要介绍了IntelliJIDEA2025创建SpringBoot项目的实现步骤,文中通过示例代码介绍的非常详细,对大家... 目录一、创建 Spring Boot 项目1. 新建项目2. 基础配置3. 选择依赖4. 生成项目5.

SpringBoot结合Docker进行容器化处理指南

《SpringBoot结合Docker进行容器化处理指南》在当今快速发展的软件工程领域,SpringBoot和Docker已经成为现代Java开发者的必备工具,本文将深入讲解如何将一个SpringBo... 目录前言一、为什么选择 Spring Bootjavascript + docker1. 快速部署与

Spring IoC 容器的使用详解(最新整理)

《SpringIoC容器的使用详解(最新整理)》文章介绍了Spring框架中的应用分层思想与IoC容器原理,通过分层解耦业务逻辑、数据访问等模块,IoC容器利用@Component注解管理Bean... 目录1. 应用分层2. IoC 的介绍3. IoC 容器的使用3.1. bean 的存储3.2. 方法注

深度解析Java项目中包和包之间的联系

《深度解析Java项目中包和包之间的联系》文章浏览阅读850次,点赞13次,收藏8次。本文详细介绍了Java分层架构中的几个关键包:DTO、Controller、Service和Mapper。_jav... 目录前言一、各大包1.DTO1.1、DTO的核心用途1.2. DTO与实体类(Entity)的区别1

MySQL 中 ROW_NUMBER() 函数最佳实践

《MySQL中ROW_NUMBER()函数最佳实践》MySQL中ROW_NUMBER()函数,作为窗口函数为每行分配唯一连续序号,区别于RANK()和DENSE_RANK(),特别适合分页、去重... 目录mysql 中 ROW_NUMBER() 函数详解一、基础语法二、核心特点三、典型应用场景1. 数据分

Spring 框架之Springfox使用详解

《Spring框架之Springfox使用详解》Springfox是Spring框架的API文档工具,集成Swagger规范,自动生成文档并支持多语言/版本,模块化设计便于扩展,但存在版本兼容性、性... 目录核心功能工作原理模块化设计使用示例注意事项优缺点优点缺点总结适用场景建议总结Springfox 是

c++中的set容器介绍及操作大全

《c++中的set容器介绍及操作大全》:本文主要介绍c++中的set容器介绍及操作大全,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录​​一、核心特性​​️ ​​二、基本操作​​​​1. 初始化与赋值​​​​2. 增删查操作​​​​3. 遍历方

如何在Spring Boot项目中集成MQTT协议

《如何在SpringBoot项目中集成MQTT协议》本文介绍在SpringBoot中集成MQTT的步骤,包括安装Broker、添加EclipsePaho依赖、配置连接参数、实现消息发布订阅、测试接口... 目录1. 准备工作2. 引入依赖3. 配置MQTT连接4. 创建MQTT配置类5. 实现消息发布与订阅

springboot项目打jar制作成镜像并指定配置文件位置方式

《springboot项目打jar制作成镜像并指定配置文件位置方式》:本文主要介绍springboot项目打jar制作成镜像并指定配置文件位置方式,具有很好的参考价值,希望对大家有所帮助,如有错误... 目录一、上传jar到服务器二、编写dockerfile三、新建对应配置文件所存放的数据卷目录四、将配置文

怎么用idea创建一个SpringBoot项目

《怎么用idea创建一个SpringBoot项目》本文介绍了在IDEA中创建SpringBoot项目的步骤,包括环境准备(JDK1.8+、Maven3.2.5+)、使用SpringInitializr... 目录如何在idea中创建一个SpringBoot项目环境准备1.1打开IDEA,点击New新建一个项