Cocos 进度条物体跟随效果

news2024/11/17 7:31:09

话不多说上代码,记录一下初学cocos解决的问题,实用小功能。 


import { _decorator, Button, Component, Node, ProgressBarComponent, Sprite, UITransform, Vec3 } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('game_scene1')
export class game_scene1 extends Component {
    @property({ type: Button })
    back: Button = null;    //返回按钮
    @property({ type: Sprite })
    loading: Sprite = null;    //进度条
    @property({ type: Node })
    pen: Node = null;  //毛笔移动

    onLoad() {
        this.back.node.on(Button.EventType.CLICK, this.backMain, this);

    }

    start() {
        
    }

    update(deltaTime: number) {
        this.LoadingMove(deltaTime);
        this.PenMove();
    }
    

    backMain() {
        //返回主页面
        console.log("返回主页");
        //this.LoadingMove(0.1);  //刷新进度条
    }
    //进度条填充
    LoadingMove(filltime: number) {
        this.loading.fillRange += filltime;
    }

    //笔的位置更新
    PenMove() {
        // 获取进度条的宽度
        let size = this.loading.getComponent(UITransform).contentSize;

        // 计算物体的目标位置
        const targetX = size.width * this.loading.fillRange;
        //targetX是你要跟随的图片节点的位置偏移量
        const targetPosition = new Vec3(targetX-190, this.pen.position.y, this.pen.position.z);

        // 更新物体的位置
        this.pen.setPosition(targetPosition);
    }

}

图片效果:毛笔一直随着进度条进行位移

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

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

相关文章

容联七陌携手岚时科技,解决医美机构回访3大痛点

近日,岚时科技研发中心联合容联七陌发布了全新的智能呼叫中心系统,5大功能模块解决了医美机构回访过程中的3大难题:客户资产保全困难、客户回访技术被卡脖子、回访人员(客服、咨询)效率管理困难。 “智能呼叫中心”通过…

ZKP8.1 Polynomial-IOP and Polynomial Commitment Schemes

ZKP学习笔记 ZK-Learning MOOC课程笔记 Lecture 8: FRI-based Polynomial Commitments and Fiat-Shamir (Justin Thaler) 8.1 Polynomial-IOP and Polynomial Commitment Schemes Recall: build an efficient SNARK Recall: Polynomial-IOP P’s first message in the pro…

Freeswitch代码

1.引入依赖 Freeswitch依赖版本 <dependency><groupId>org.freeswitch.esl.client</groupId><artifactId>esl-client</artifactId><version>0.10.1</version> </dependency> 2.代码 import org.freeswitch.esl.client.inbound…

分享导致vcruntime140_1.dll丢失的原因,以及vcruntime140_1.dll的解决办法

电脑中缺失vcruntime140_1.dll文件的问题&#xff0c;是常有的问题&#xff0c;不仅仅是vcruntime140_1.dll文件&#xff0c;还会有很多的其他的dll文件都会出现这样的问题。今天就和大家聊聊vcruntime140_1.dll文件丢失的情况&#xff0c;和什么原因导致的丢失vcruntime140_1.…

【波形图】在波形图上显示相对时间并将原点设置为零

默认情况下&#xff0c;波形图有一个定义的窗口来显示 X 轴。当X值达到该窗口的上限时&#xff0c;图表开始滚动以显示最新值的窗口。为了防止这种情况&#xff0c;请通过右键单击图表并选择X Scale Autoscale X将 X 轴设置为自动缩放。此操作还将增加窗口的大小以显示从 0 到…

基于SSM的智慧作业试题管理系统(有报告)。Javaee项目。

演示视频&#xff1a; 基于SSM的智慧作业试题管理系统&#xff08;有报告&#xff09;。Javaee项目。 项目介绍&#xff1a; 采用M&#xff08;model&#xff09;V&#xff08;view&#xff09;C&#xff08;controller&#xff09;三层体系结构&#xff0c;通过Spring Sprin…

样式问题解决

1.深度样式选择器 1.vue2中 原生css >>> .el-card__header saas\scss ::v-deep .el-card__header less /deep/ .el-card__header 2.vue3中 :deep() { //styles } ::deep() { //styles } 2.修改element.style样式

【uniapp】解决在H5谷歌浏览器下 u-input 标签 设置只读后,click事件不生效

【问题描述】 谷歌浏览器更新后&#xff0c;h5模式下原本的input外层view中的click事件不触发了?? 但是更换浏览器后就可以&#xff0c;打包app也是正常可以触发的&#xff0c;本来是没打算兼容h5&#xff0c;既然遇到了就记录一下~ 【解决办法】 使u–input里写上readonly&…

python随机生成指定长度的字符串

需求&#xff1a;随机生成一个指定长度的字符串&#xff08;数字和小写字母&#xff09; 涉及到的python知识点 &#xff08;1&#xff09;python模块包&#xff1a;random random.choice(sequence)&#xff1a;从指定的序列中获取一个随机元素 random.choice(sequence)从序…

GoLong的学习之路(二十一)进阶,语法之并发(go最重要的特点)(协程的主要用法)

并发编程在当前软件领域是一个非常重要的概念&#xff0c;随着CPU等硬件的发展&#xff0c;我们无一例外的想让我们的程序运行的快一点、再快一点。Go语言在语言层面天生支持并发&#xff0c;充分利用现代CPU的多核优势&#xff0c;这也是Go语言能够大范围流行的一个很重要的原…

AI 视频 | 文本生视频工具又迎来重大更新,Runway Gen-2 到底有多强?Gen-2 怎么用(保姆级教程)

一、引言 不久前刚介绍了一个号称地表最强的文本生视频的工具 Moonvalley&#xff1a;免费的 AI 视频生成工具 Moonvalley 厉害了&#xff01;Moonvalley 怎么用&#xff08;保姆级教程&#xff09; 紧接着在 11 月 2 日&#xff0c;Runway 重磅发布了第 2 代文本到视频和图像…

unity打AB包,AssetBundle预制体与图集(三)

警告&#xff1a; spriteatlasmanager.atlasrequested wasn’t listened to while 条件一&#xff1a;图片打图集里面去了 条件二&#xff1a;然后图集打成AB包了 条件三&#xff1a;UI预制体也打到AB包里面去了 步骤一&#xff1a;先加载了图集 步骤二&#xff1a;再加载UI预…

测试面试题集锦(四)| Linux 与 Python 编程篇(附答案)

本系列文章总结归纳了一些软件测试工程师常见的面试题&#xff0c;主要来源于个人面试遇到的、网络搜集&#xff08;完善&#xff09;、工作日常讨论等&#xff0c;分为以下十个部分&#xff0c;供大家参考。如有错误的地方&#xff0c;欢迎指正。有更多的面试题或面试中遇到的…

四川思维跳动商务信息咨询有限公司可靠吗?

随着抖音等短视频平台的兴起&#xff0c;越来越多的商家开始利用这些平台进行带货。四川思维跳动商务信息咨询有限公司也提供抖音带货服务&#xff0c;那么&#xff0c;他们的服务可靠吗&#xff1f;本文将为你揭开真相&#xff0c;让你安心选择&#xff01; 一、公司简介 四川…

分布式任务调度(04)--自研

1 背景 兼容技术团队自研的RPC框架&#xff0c;技术团队不需要修改代码&#xff0c;RPC注解方法可以托管在任务调度系统中&#xff0c;直接当做一个任务来执行。 研读XXL-JOB&#xff0c;同时从阿里云分布式任务调度 SchedulerX 吸取。 SchedulerX 1.0 架构图 Schedulerx-co…

MCU常见通信总线串讲(二)—— RS232和RS485

&#x1f64c;秋名山码民的主页 &#x1f602;oi退役选手&#xff0c;Java、大数据、单片机、IoT均有所涉猎&#xff0c;热爱技术&#xff0c;技术无罪 &#x1f389;欢迎关注&#x1f50e;点赞&#x1f44d;收藏⭐️留言&#x1f4dd; 获取源码&#xff0c;添加WX 目录 前言一…

Word文档中书签使用注意事项

在协同编辑文档时&#xff0c;书签被广泛应用在各种场景中&#xff0c;当我们在编辑时有时候会搞不懂我们的哪些操作会导致书签更换段落或是删除&#xff0c;比如同样的某些操作在修订场景下书签就不会消失&#xff0c;但非修订状态就会消失。在这篇文章中我们就介绍一下我们的…

数据中心的防雷接地

在数据中心建设中&#xff0c;防雷接地是非常重要的一项工作&#xff0c;能有效地保护数据中心设备和系统免受雷击的影响。下面是一些关于数据中心防雷接地的常见做法&#xff1a; 接地系统设计&#xff1a;在数据中心的设计阶段&#xff0c;应考虑到接地系统的布置和规划。为了…

Halcon如何使用SaperaLT库连接dalsa相机

halcon安装好的时候&#xff0c;没有带SaperaLT的采集库&#xff0c;需要额外在Halcon官网下载此库。 以下是halcon官网下载此库的链接。官网需要注册才可以下载。 https://www.mvtec.com/downloads/interfaces?tx_mvtecproduct_extensiondownloadlist%5Bfilter%5D%5B0%5Dma…

时空智友企业信息管理系统任意文件读取漏洞复现

简介 时空智友企业信息管理系统是一个用于企业流程管理和控制的软件系统。它旨在帮助企业实现流程的规范化、自动化和优化&#xff0c;从而提高工作效率、降低成本并提升管理水平。 时空智友企业信息管理系统存在任意文件读取漏洞&#xff0c;攻击者可以在未授权的情况下读取…