鸿蒙开发之ArkUI 界面篇 二十二 层叠布局 Stack

news2024/11/24 15:40:29

Stack语法格式如下,其实鸿蒙的容器组件的语法都是一样的,只是实现效果和和容器组件的名字不一样而已。

与绝对定位相比,实现更简单些,绝地定位更灵活,如果需要调整子组件的对其方式,需要这样添

加:

优先能用层叠还是就使用层叠,实战效果如下:

代码如下:

@Entry
@Component
struct Index {
  build() {
    Column(){
      Stack({
        alignContent:Alignment.Center
      }){
        Text('第一个组件').fontSize(18).backgroundColor(Color.Red)
          .width(350)
          .height(350)
        Text('第二个组件').fontSize(18).backgroundColor(Color.White)
          .width(300)
          .height(300)
        Text('第三个组件').fontSize(18).backgroundColor(Color.Orange)
          .width(250)
          .height(250)
        Text('第四个组件').fontSize(18).backgroundColor(Color.Yellow)
          .width(150)
          .height(150)
        Text('第五个组件').fontSize(18).backgroundColor(Color.Brown)
          .width(100)
          .height(100)

      }.width(350)
      .height(350)
      .backgroundColor(Color.Orange)

  }.width('100%')
    .height('100%')
    .backgroundColor(Color.Pink)
}
}

把alignContent:Alignment.Center改为alignContent:Alignment.Start,效果如下图

总结:stack层叠布局能快速的实现层叠效果,默认中心开花方式,都是可以调整的,

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

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

相关文章

如何使用 WSL 在 Windows 上安装 Linux

如何使用 WSL 在 Windows 上安装 Linux 文章目录 如何使用 WSL 在 Windows 上安装 Linux前言安装WSL命令修改DNS网络右键打开网络和internet设置更改适配器选项属性 前言 在Windows计算机上同时访问Windows和Linux系统的功能,有利于大家学习Linux系统。 版本要求Wi…

Rethinking the Localization in Weakly Supervised ObjectLocalization

论文名称:Rethinking the Localization in Weakly Supervised Object Localization 论文地址:Rethinking the Localization in Weakly Supervised Object Localization (arxiv.org) 1.背景 最近,将WSOL分成两部分(与类无关的对象定位和对象…

Ansible 工具从入门到使用

1. Ansible概述 Ansible是一个基于Python开发的配置管理和应用部署工具,现在也在自动化管理领域大放异彩。它融合了众多老牌运维工具的优点,Pubbet和Saltstack能实现的功能,Ansible基本上都可以实现。 Ansible能批量配置、部署、管理上千台主…

恶意软件基础知识——恶意软件命名

计算机病毒(Computer Virus)指编制或者在计算机程序中插入的破坏计算机功能或者破坏数据,影响计算机使用并且能够自我复制的一组计算机指令或者程序代码。 ——《中华人民共和国计算机信息系统安全保护条例》 恶意软件的定义 恶意软件是一个用来描述恶意应用程序…

SQL进阶技巧:如何优化NULL值引发的数据倾斜问题?

目录 0 场景描述 1 问题分析 1.1 问题剖析 1.2 解决方案 2 小结 0 场景描述 实际业务中有些大量的null值或者一些无意义的数据参与到计算作业中,表中有大量的null值,如果表之间进行join操作,就会有shuffle产生,这样所有的null值都会被分配到一个reduce中,必然产生数…

动态代理有用吗?一文了解靠谱的动态代理有哪些标准

在当今互联网时代中,从网络安全、隐私保护、市场调研和互联网营销到软件测试、缓存管理和数据库连接,用户为了更好地完成此类工作,往往会使用动态代理,那么进一步了解动态代理、明确动态代理的使用场景和选择标准则是十分有必要的…

MatrixVT: Efficient Multi-Camera to BEV Transformation for 3D Perception

本文提出了一种高效的多摄像头到鸟瞰图 (BEV) 视图转换方法,用于 3D 感知,称为 MatrixVT。现有的视图转换器要么转换效率低下,要么依赖于特定于设备的操作符,阻碍了 BEV 模型的广泛应用。相比之下,我们的方法仅使用卷积…

QT-空窗口主窗口对话框

1. QMainWindow QMainWindow 用来创建主窗口 主窗口包含: 标题栏(Window title)、菜单栏(MenuBar)、工具栏(ToolBar)、状态栏(StatusBar)、停靠部件(DockWid…

你真的了解ChatGPT吗?深度解读Chat GPT背后的数据风险

随着人工智能技术的快速发展,像ChatGPT这样的语言模型已经成为了我们生活和工作的得力助手。从撰写文章、回答问题到辅助编程,ChatGPT正逐渐改变着人们与科技互动的方式。然而,随着AI的广泛应用,数据安全也成为了不可忽视的重要议…

Maven 父子模块的 pom.xml 文件编写

今天在写课内的实验作业的时候&#xff0c;三个内容要使用的依赖是一样的&#xff0c;于是想使用父子模块来玩玩。 父模块 pom.xml 书写 打包方式 <packaging>pom</packaging> 聚合子模块 <!-- 聚合子模块 --> <modules><module>../one</…

双十一即将来临,希喂、有哈、安德迈宠物空气净化器攻略赶快收好

国庆长假结束&#xff0c;也就告别了今年最后一个法定节假日。不过&#xff0c;随之而来的就是购物狂欢节双十一&#xff01;想想还有点小激动&#xff0c;这是我工作以来第一个双十一。以前在大学靠生活费根本买不了什么&#xff0c;现在工作了有点小钱&#xff0c;准备大买特…

全网都在找的Python生成器竟然在这里!简单几步,让你的代码更简洁、更高效!

博客主页&#xff1a;长风清留扬-CSDN博客系列专栏&#xff1a;Python基础专栏每天更新大数据相关方面的技术&#xff0c;分享自己的实战工作经验和学习总结&#xff0c;尽量帮助大家解决更多问题和学习更多新知识&#xff0c;欢迎评论区分享自己的看法感谢大家点赞&#x1f44…

【漏洞复现】网动统一通信平台/网动统一通信平台ActiveUC存在任意文件下载

》》》产品描述《《《 网动统一通信平台是采用统一的通信界面&#xff0c;将VoIP电话系统、电子邮件等多种沟通方式融合的企业IT平台。 》》》漏洞描述《《《 网动统一通信平台是采用统一的通信界面&#xff0c;将VoIP电话系统、电子邮件等多种沟通方式融合的企业IT平台。网动统…

OXO:一款针对Orchestration框架的安全扫描引擎

关于OXO OXO是一款针对Orchestration框架的安全扫描引擎&#xff0c;该工具可以帮助广大研究人员检测Orchestration安全问题&#xff0c;并执行网络侦查、 枚举和指纹识别等操作。 值得一提的是&#xff0c;OXO还提供了数十种其他的协同工具&#xff0c;包括网络扫描代理&…

js拼接html代码在线工具

具体请前往&#xff1a;在线Html转Js--将Html代码转成javascript动态拼接代码并保持原有格式

【基础篇】一个键值数据库包含什么?

背景 今天&#xff0c;在构造这个简单的键值数据库时&#xff0c;我们只需要关注整体架构和核心模块。这就相当于医学上在正式解剖人体之前&#xff0c;会先解剖一只小白鼠。我们通过剖析这个最简单的键值数据库&#xff0c;来迅速抓住学习和调优 Redis 的关键。 我们把这个简…

python中字符串操作

1、遍历字符串&#xff1a; pystr"HelloPython!" for i in pystr:print(i) 结果&#xff1a; 2、字符串索引 pystr"HelloPython!" print(pystr[0],pystr[-1]) 结果&#xff1a; 3、字符串切片 pystr"HelloPython!" # 切片[start:stop:step] p…

父组件向子组件传值props

父组件 <template><child :list"list" /><h4>{{ title }}</h4> </template> <script> // 引用子组件 import child from ./child.vue export default {data() {return {title: APP根组件,list: [a1, a2, a3]}},// 组件注册compo…

2024电动车新国标是什么标准

9月19日&#xff0c;工业和信息化部会同多部门&#xff0c;对最新修订的《电动自行车安全技术规范》进行公开征求意见&#xff0c;将持续1个月。与现行标准相比&#xff0c;这次的“新国标”做了哪些方面的改进和提升&#xff1f;事关你出行自由顺畅的“小电驴”&#xff0c;快…

【C语言】猜数字小游戏

&#x1f602;个人主页: 起名字真南 &#x1f923;个人专栏:【数据结构初阶】 【C语言】 【C】 目录 1 随机数的生成1.1 rand1.2 srand1.3 time1.4 设置随机数范围 2 猜数字游戏实现 前言&#xff1a;我们学习完前面的循环以后可以写一个猜数字小游戏 1 随机数的生成 想要完成…