鸿蒙开发之ArkUI 界面篇 二十 position绝对定位及层级zIndex

position控制组件的位置,可以实现层叠效果,Android中的FramLayout,通常用在左上角有些图标之类,绝对定位后的组件不占用自身原有位置,每个子组件都有这个属性,只是不用这个属性的时候不起作用,.zIndex()属性要和position一起使用的时候才有效,完全是Android中的FramLayout效果,要实现如下效果:

核心代码是:

 .position({
          x:120,
          y:150
        })
        .zIndex(1)

总结: .position 让组件移动到哪里就可以移动到哪里,但是单独的这个并没有层叠效果,要有层叠效果得position和zIndex一起使用

完整代码如下:

@Entry
@Component
struct Index {build() {Column(){Text('学习选择1').fontSize(30).fontWeight(777).padding(15).width('100%')Text('学习选择2').fontSize(30).fontWeight(777).padding(15).width('100%').backgroundColor(Color.Orange).position({x:120,y:150}).zIndex(1)Text('学习选择3').fontSize(30).fontWeight(777).padding(15).width('100%')Text('学习选择4').fontSize(30).fontWeight(777).padding(15).width('100%')Text('学习选择5').fontSize(30).fontWeight(777).padding(15).width('100%')}
}
}

需要资源的留言

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

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

相关文章

微服务——分布式事务

目录 分布式事务 1.1分布式事务的特性 1.2分布式事务应用背景 ​编辑 1.3.认识Seata 1.4部署TC服务 1.4.1.准备数据库表 1.4.2.准备配置文件 1.4.3.Docker部署 1.5.微服务集成Seata 1.5.1.引入依赖 1.5.2.改造配置 1.5.3.添加数据库表 ​编辑1.6.XA模式 1.6.1.两…

Zabbix 7.2入门实战

基于Docker安装 自定义Docker网络 docker network create --subnet 172.20.0.0/16 --ip-range 172.20.240.0/20 zabbix-net 拉取镜像 # 拉取Zabbix官方Docker镜像 docker pull zabbix/zabbix-server-mysql docker pull zabbix/zabbix-web-nginx-mysql docker pull zabbix/z…

聊聊Mysql的MVCC

1 什么是MVCC? MVCC,是Multiversion Concurrency Control的缩写,翻译过来是多版本并发控制,和数据库锁一样,他也是一种并发控制的解决方案。 我们知道,在数据库中,对数据的操作主要有2种&#…

【React】setState 是怎么记住上一个状态值的?

在 React 中,setState 通过 React 内部的状态管理机制来记住上一个状态值。即使每次组件重新渲染时,函数组件会被重新执行,React 仍能通过其内部的状态管理系统保持和追踪组件的状态变化。下面详细解释其工作原理: 1. setState 的…

虾皮Shopee Android面试题及参考答案

HTTP 状态码有哪些? HTTP 状态码是用以表示网页服务器超文本传输协议响应状态的 3 位数字代码。主要分为五大类: 1xx 信息性状态码:表示服务器正在处理请求,这些状态码是临时的响应,主要用于告诉客户端请求已经被接收,正在处理中。例如,100 Continue 表示客户端应当继续…

【数据结构 | PTA】表

文章目录 7-1 重排链表7-2 链表去重7-3 两个有序链表序列的合并7-4 两个有序链表序列的交集 7-1 重排链表 输入格式: 每个输入包含1个测试用例。每个测试用例第1行给出第1个结点的地址和结点总个数,即正整数N (≤105)。结点的地址是5位非负整数&#xff…

Java API接口开发规范

文章目录 一、命名规范1.1 接口命名1.2 变量命名 二、接收参数规范2.1 请求体(Body)2.2 查询参数(Query Parameters) 三、参数检验四、接收方式规范五、异常类处理六、统一返回格式的定义七、API接口的幂等性(Idempote…

K8s持久化存储PV和PVC(通俗易懂)

一、PV和PVC的引入 Volume 提供了非常好的数据持久化方案,不过在可管理性上还有不足。 拿前面 AWS EBS 的例子来说,要使用 Volume,Pod 必须事先知道如下信息: 当前 Volume 来自 AWS EBS。EBS Volume 已经提前创建,并且知道确切的 volume-id。Pod 通常是由应用的开发人员…

【MYSQL】MYSQL约束-----非空约束(not null)和唯一约束(unique)

1、概念 MYSQL非空约束(not null),指字段的值不能为空。对于使用了非空约束的字段,如果用户在添加数据时没有指定值,数据库就会报错。 注意:非空约束一张表中可以有多个。 2、语法 方式1:在创建表时指定&#xff08…

Linux安装配置Jupyter Lab并开机自启

文章目录 1、安装配置jupyter lab首先需要使用pip3安装:生成配置文件和密码: 2、设置开机自启首先通过which jupyter查询到可执行文件路径:设置自启服务: 1、安装配置jupyter lab 首先需要使用pip3安装: pip3 instal…

每日一练:最长等差数列

1027. 最长等差数列 - 力扣&#xff08;LeetCode&#xff09; 题目要求&#xff1a; 给你一个整数数组 nums&#xff0c;返回 nums 中最长等差子序列的长度。 回想一下&#xff0c;nums 的子序列是一个列表 nums[i1], nums[i2], ..., nums[ik] &#xff0c;且 0 < i1 <…

C# 实现UI界面输出日志

在开发桌面应用程序时&#xff0c;将日志输出到UI界面是一种常见的需求&#xff0c;尤其是在调试和错误跟踪时。C#提供了多种方式来实现这一功能&#xff0c;包括使用TextBox、RichTextBox、ListBox等控件。本文将介绍如何使用RichTextBox控件在WinForms应用程序中实现日志输出…

【vue】i18n的页面和侧边栏的使用

第一步&#xff1a;创建文件夹lang、文件夹下创建index.js、en.js、zh.js index.js import Vue from "vue";// 引入自己的语言包 import chinese from "./zh"; // 中文 import english from "./en"; // 英文// element ui 国际化 import Eleme…

细说机器学习和深度学习

背景 平常业务开发中每天都要接触到机器学习和深度学习的概念&#xff0c;在听了很多大佬的普及后&#xff0c;发现甚是有趣。于是小编想着着手开始学习这部分的内容。 那废话不多说&#xff0c;就从最基础的机器学习和神经网络开始~ 一、机器学习基础 1、机器学习是什么&a…

前端开发中的高级技巧与最佳实践

在前端开发的广阔领域中,不断探索和掌握新的技巧与实践方法是提升开发水平和项目质量的关键。本文将深入探讨一些前端开发中的高级技巧,希望能为广大前端开发者提供有价值的参考和启示。 一、高效的组件化开发 组件化是前端开发中的核心概念之一。通过将页面拆分成独立的、…

2024 uniapp入门教程 01:含有vue3基础 我的第一个uniapp页面

uni-app官网uni-app,uniCloud,serverless,快速体验,看视频&#xff0c;10分钟了解uni-app,为什么要选择uni-app&#xff1f;,功能框架图,一套代码&#xff0c;运行到多个平台https://uniapp.dcloud.net.cn/ 准备工作&#xff1a;HBuilder X 软件 HBuilder X 官网下载&#xf…

职场上的人情世故,你知多少?这五点一定要了解

职场是一个由人组成的复杂社交网络&#xff0c;人情世故在其中起着至关重要的作用。良好的人际关系可以帮助我们更好地融入团队&#xff0c;提升工作效率&#xff0c;甚至影响职业发展。在职场中&#xff0c;我们需要了解一些关键要素&#xff0c;以更好地处理人际关系&#xf…

云原神的实现

个人学习笔记&#xff0c;持续更新…… 云原神的实现技术 云原神是一款由中国游戏公司miHoYo开发的开放世界动作角色扮演游戏。其实现涉及多种技术和平台&#xff1a; 引擎技术&#xff1a; 云原神基于Unity引擎构建&#xff0c;该引擎提供高度的图形性能、物理模拟和光照系统…

泛微流程隐藏按钮

隐藏右键菜单的按钮 控制台输入 mobx.toJS(WfForm.getGlobalStore().rightMenu.rightMenus) 获取相对应 type在js中进行隐藏 ecodeSDK.overwritePropsFnQueueMapSet(WeaRightMenu,{ //复写组件名隐藏菜单fn:(newProps)>{ //newProps代表组件参数newProps.datas newProps.…

css三角形:css画箭头向下的三角形

.arrow { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-style: solid; border-width: 8px 5px 0 5px; /* 上、左、下、右 */ bord…