鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之线性布局容器Column组件

鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之线性布局容器Column组件

一、操作环境

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

二、Column组件

沿垂直方向布局的容器。

子组件

可以包含子组件。

接口

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

参数

参数名

参数类型

必填

默认值

参数描述

space

string|number

0

纵向布局元素间距。

属性

名称

参数类型

默认值

描述

alignItems

HorizontalAlign

HorizontalAlign.Center

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

justifyContent8+

FlexAlign

FlexAlign.Start

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

三、示例

代码
// xxx.ets
@Entry
@Component
struct ColumnExample {build() {Column() {Text('space').fontSize(9).fontColor(0xCCCCCC).width('90%')Column({ space: 5 }) {Column().width('100%').height(30).backgroundColor("#FF1493")Column().width('100%').height(30).backgroundColor(0x00FFFF)}.width('90%').height(100).border({ width: 1 })Text('alignItems(Start)').fontSize(9).fontColor(0xCCCCCC).width('90%')Column() {Column().width('50%').height(30).backgroundColor("#FF1493")Column().width('50%').height(30).backgroundColor(0x00FFFF)}.alignItems(HorizontalAlign.Start).width('90%').border({ width: 1 })Text('alignItems(End)').fontSize(9).fontColor(0xCCCCCC).width('90%')Column() {Column().width('50%').height(30).backgroundColor("#FF1493")Column().width('50%').height(30).backgroundColor(0x00FFFF)}.alignItems(HorizontalAlign.End).width('90%').border({ width: 1 })Text('justifyContent(Center)').fontSize(9).fontColor(0xCCCCCC).width('90%')Column() {Column().width('30%').height(30).backgroundColor("#FF1493")Column().width('30%').height(30).backgroundColor(0x00FFFF)}.height('15%').border({ width: 1 }).justifyContent(FlexAlign.Center)Text('justifyContent(End)').fontSize(9).fontColor(0xCCCCCC).width('90%')Column() {Column().width('30%').height(30).backgroundColor("#FF1493")Column().width('30%').height(30).backgroundColor(0x00FFFF)}.height('15%').border({ width: 1 }).justifyContent(FlexAlign.End)}.width('100%').padding({ top: 5 })}
}

图片

好了就写到这吧!

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

我家地址:亚丁号

最后送大家一首诗:

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

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

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

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

相关文章

完美解决Github 2fa二次验证问题

完美解决Github 2fa二次验证问题 原文阅读 https://onedayxyy.cn/docs/github-2fa 前言 你的 Github 账户可能被封禁! 教你应对 Github 最新的 2FA 二次验证! 无地区限制, 无额外设备的全网最完美方案 1、2FA 的定义 双因素身份验证 (2FA) 是一种身份和访管理安全方法&…

栈和队列基本实现

1、栈 1.1栈的概念及结构 栈时一种特殊的线性表,只允许在固定的一端进行插入和删除元素操作。进行数据插入和删除操作的一端称为栈顶,另一端称为栈底。栈中的数据元素遵守后进先出LIFO(Last In First Out)的原则。 1.2栈的基本实…

物流实时数仓:数仓搭建(DWS)一

系列文章目录 物流实时数仓:采集通道搭建 物流实时数仓:数仓搭建 物流实时数仓:数仓搭建(DIM) 物流实时数仓:数仓搭建(DWD)一 物流实时数仓:数仓搭建(DWD&am…

遥测终端机——连接智能世界的桥梁

在当今的智能化时代,数据的重要性日益凸显。各个行业都需要对数据进行实时监测、处理和分析,以提升生产效率、优化运营管理。遥测终端机作为连接智能世界的桥梁,正逐渐成为各行业的必备设备。 遥测终端机是一种集数据采集、存储、传输和管理于…

《微信小程序开发从入门到实战》学习七十一

6.6 网络API 6.6.5 WebSocket API 使用WebSocket API可使小程序与服务器建立长连接。小程序端和服务端长时间内可主动向对端发送一些数据 需要先调用wx.connectSocket创建一个连接,返回一个SocketTask对象,然后WebSocket方式通信。 SocketTask对象可…

小红书12月内容趋势分析

为洞察小红书平台的内容创作趋势及品牌营销策略,新红推出12月月度榜单,从创作者、品牌、热搜词多方面入手,解析月榜数据,为从业者提供参考。 以下为12月部分榜单解析,想要查看更多行业榜单,创作优质内容&am…

mask = (x > 0).unsqueeze(1).repeat(1, x.size(1), 1).unsqueeze(1)

bert源码里出现这一句代码:mask (x > 0).unsqueeze(1).repeat(1, x.size(1), 1).unsqueeze(1) 某大语言模型解释: mask (x > 0).unsqueeze(1).repeat(1, x.size(1), 1).unsqueeze(1) 的目的是创建一个用于屏蔽(masking)…

vue3+Cesium 添加地面测控站台

效果 cesiumRadar.js import * as Cesium from cesium; export function addentities(viewer, res, index) {viewer.entities.add({id: index,position: Cesium.Cartesian3.fromDegrees(res[0], res[1]),wall: {positions: new Cesium.CallbackProperty(() > {return Cesiu…

kubernetes(K8s)的使用和常用命令

K8S kubernetes,由于k和s之间有8个字符,所以简称k8s,是一个全新的基于容器技术的分布式架构领先方案,是谷歌严格保密十几年的秘密武器----Borg系统的一个开源版本,于2015年7月发布第一个正式版本,它的本质…

kotlin ——集合使用

文章目录 一、集合的使用1、不可变集合2、可变集合3、Map集合 二、集合的排序1、随机排序2、从小到大3、从大到小4、条件排序 一、集合的使用 1、不可变集合 val listString listOf<String>("one","two","one")println(listString)输出&a…

【电商项目实战】实现订单超时支付取消

&#x1f389;&#x1f389;欢迎来到我的CSDN主页&#xff01;&#x1f389;&#x1f389; &#x1f3c5;我是Java方文山&#xff0c;一个在CSDN分享笔记的博主。&#x1f4da;&#x1f4da; &#x1f31f;推荐给大家我的专栏《电商项目实战》。&#x1f3af;&#x1f3af; &am…

大创项目推荐 深度学习卷积神经网络垃圾分类系统 - 深度学习 神经网络 图像识别 垃圾分类 算法 小程序

文章目录 0 简介1 背景意义2 数据集3 数据探索4 数据增广(数据集补充)5 垃圾图像分类5.1 迁移学习5.1.1 什么是迁移学习&#xff1f;5.1.2 为什么要迁移学习&#xff1f; 5.2 模型选择5.3 训练环境5.3.1 硬件配置5.3.2 软件配置 5.4 训练过程5.5 模型分类效果(PC端) 6 构建垃圾…

网络通信(9)-C#TCP服务端实例

本文使用Socket在C#语言环境下完成TCP服务端的实例。 实例完成的功能: 服务器能够连接多个客户端显示在列表中,实现实时刷新。 服务器接收客户端的字符串数据。 选中列表中的客户端发送字符串数据。 在VS中创建C# Winform项目,编辑界面,如下: UI文件 namespace MyTc…

多元线性回归案例--客户价值模型

文章目录 step 1&#xff1a;读取数据step 2&#xff1a;搭建模型step 3&#xff1a;构造回归方程step 4&#xff1a;评估模型 利用多元线性回归模型可以根据多个因素来预测客户价值&#xff0c;当模型搭建完成后&#xff0c;便可对不同价值的客户采用不同的业务策略。 这里以信…

css flx最后一个元素不用空,flex不自动变长压缩

flex-grow: 0; flex-shrink: 0; flex-basis: 33.33%;

RuoYi-Cloud-Plus使用minio进行文件上传图片后无法预览解决_修改minio配置minio桶权限---SpringCloud工作笔记198

在文件管理的位置,发现刚刚上传的图片文件,会显示 预览图片失败 后来经过多方查看,发现是minio的配置的问题 可以从这里: 可以看到首先登录RuoYi-Cloud-Plus系统然后,打开文件管理页面可以看到,当上传了图片文件以后 显示文件展示中,文件预览失败,那么这个时候,去修改minio的配…

python识别验证码+灰度图片base64转换图片

一、为后面识别验证码准备 1、base64转换为图片&#xff0c;保存本地、并且置灰 上文中的base64,后面的就是包含Base64编码的PNG图像的字符串复制下来 import base64 from PIL import Image import io# 这里是你的Base64编码的字符串 base64_data "iVBORw0KGgoAAAANSUhE…

鸿鹄电子招投标系统:源码级别解析电子招投标的精髓

招投标管理系统是一个集门户管理、立项管理、采购项目管理、采购公告管理、考核管理、报表管理、评审管理、企业管理、采购管理和系统管理于一体的综合性应用平台。它适用于招标代理、政府采购、企业采购和工程交易等业务的企业&#xff0c;旨在提高项目管理的效率和质量。该系…

大数据HCIE成神之路之特征工程——特征选择

特征选择 1.1 特征选择 - Filter方法1.1.1 实验任务1.1.1.1 实验背景1.1.1.2 实验目标1.1.1.3 实验数据解析1.1.1.4 实验思路 1.1.2 实验操作步骤 1.2 特征选择 - Wrapper方法1.2.1 实验任务1.2.1.1 实验背景1.2.1.2 实验目标1.2.1.3 实验数据解析1.2.1.4 实验思路 1.2.2 实验操…

【Spring】19 AOP介绍及实例详解

文章目录 1. 定义1&#xff09;什么意思呢&#xff1f;2&#xff09;如何解决呢&#xff1f; 2. 基本概念1&#xff09;切面&#xff08;Aspect&#xff09;2&#xff09;切点&#xff08;Pointcut&#xff09;3&#xff09;通知&#xff08;Advice&#xff09;4&#xff09;连…