EaseJs 中 regX / regY 的使用方法及动效实现

于 2023-09-28 04:28:14 发布
阅读量123 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： 动效
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/GcdtIteration/article/details/133371821
动效 专栏收录该内容
34 篇文章 ¥59.90 ¥99.00
订阅专栏
EaseJs 中的 regX 和 regY 属性用于指定显示对象的注册点，影响对象的位置、旋转和缩放。通过设置它们的值，可以实现灵活的动画效果，如围绕中心点旋转、缩放和移动。调整这两个属性可以创建不同基准的动画场景。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在 EaseJs 中，regX 和 regY 是用于指定显示对象的注册点（registration point）的属性。注册点是显示对象的坐标系中的一个点，用于确定对象的位置、旋转和缩放等变换操作。regX 和 regY 属性允许我们在对象的中心或其他位置定义注册点，从而实现更灵活的动画效果。

regX 属性定义了对象的水平注册点的位置，而 regY 属性定义了对象的垂直注册点的位置。这两个属性的值可以是任意数字，通常以对象的宽度和高度的一半作为默认值。通过修改 regX 和 regY 的值，我们可以改变对象的注册点位置，从而影响对象的位置和旋转。

下面是一个使用 EaseJs 实现动画效果的示例代码：

// 创建舞台和显示对象
var stage = new createjs.Stage("canvas");
<
了解本专栏 订阅专栏 解锁全文
JavaScript-正则表达式基础讲解
OuYyds的博客
03-31 837
正则对象定义方式 第一种定义 常用 var regx = /^b$/ //声明的就是一个正则对象， ^表示开头 $表示结尾，只匹配一个b 第二种定义 var regx1 = new RegExp('^a$') //声明一个正则对象，只匹配a这个单词 [ ]表示其中的一个元素 var regx2 = /^[abcdefg]$/ //匹配a 或者b 或者c 或者d 或者e 或者f其中的一个字母 { }表示个数，可以规定个数的范围{1,2} 表示1-2个 {1}...
js RegEx 正则取到自已想要值
03-28
NULL 博文链接：https://jiachenmianyu.iteye.com/blog/1242717
Easeljs之regX/regY详解
weixin_34090562的博客
09-18 865
regX/regY详解 在学习使用createjs创建图形中，必然要接触到显示对象各种各样与位置有关的属性值，比如，x,y, regX, regY, localX 等，今天我们详细的说一下regX/regY, 这两个属性在旋转图形中尤为重要，它的作用类似于我们CSS3中transform-origin属性。文末有例子源码链接（可能需要引入...
js正则贪婪模式_正则表达式(regex) 贪婪模式、懒惰模式使用方法
weixin_31318441的博客
01-17 1211
正则表达式贪婪匹配模式，对于初学者，往往也很容易出错。有时候需要匹配一个段代码内容，发现匹配与想要不一致。发现原来，跟贪婪模式有关系。如下，我们看下例子：什么是贪婪模式字符串有: “abdbcd”，我们想匹配…内容，正则表达式如下：1、h3开头与结尾，”待添加” 都作为普通字符2、中间可以出现任意字符，个数可以是0个或者多个，正则表达式可以用：.* ，“.”代表任意字符，默认模式不匹配换行,”*”...
JavaScript：正则对象
LiLi的博客
01-12 1093
正则表达式基础 正则表达式（regular expression）用来按照“给定模式”匹配文本。比如，正则表达式给出一个 Email 地址的模式，然后用它来确定一个字符串是否为 Email 地址。 新建正则表达式有两种方法。一种是使用字面量，以斜杠表示开始和结束 var regex = /xyz/; 另一种是使用RegExp构造函数 var regex = new RegExp('xyz'); 正则执行方法 正则的执行的方法主要有两种，一种是 test() 方法，另一种是 exec() 方法 test(
浅谈JS中正则表达式(RegExp)的使用
Geolage Wu 的博客
08-05 523
细说正则表达式（简写为regex、regexp）的那些坑 ... pattern... flags... 填坑 ... 子表达式（$） RegExp.prototype.exec()... RegExp.prototype.test()... String.prototype.split()... String.prototype.match()... String.prototype.replace()..
js中使用正则表达式(二)操作正则表达式的对象RegExp、String和方法
javaloveiphone的专栏
09-22 1515
操作正则表达式执行匹配工作的对象：RegExp对象和String对象，接下来分别介绍一下两个对象提供正则匹配的方法 1、RegExp对象：可以通过上面两种方式创建正则表达式对象，它有3个方法：test()、exec() 以及 compile()。 (1)、test()：检索字符串中的指定值。返回值是 true 或 false。 例子： var regx=n
js regx验证==== 正则
weixin_30781107的博客
05-04 185
String.prototype.Trim = function(){ return Trim(this);}String.prototype.LTrim = function () { return LTrim(this); }String.prototype.RTrim = function () { return RTrim(this); }function LTrim(str) { ...
JavaScript高级 正则表达式
ximingx
03-10 578
正则表达式简介 定义：正则表达式用于定义一些字符串的规则。 作用：计算机可以根据正则表达式，来检查一个字符串是否符合指定的规则；或者将字符串中符合规则的内容提取出来。 创建正则表达式的对象 方式一：使用构造函数创建正则表达式的对象 语法： var 变量 = new RegExp("正则表达式"); // 注意，参数是字符串 var 变量 = new RegExp("正则表达式", "匹配模式"); // 注意，两个参数都是字符串 备注：RegExp的意思是 Regular expression。使用
regx
u013169177的博客
06-08 1031
1、创建正则对象let re1 = new RegExp("abc");let re2 = /abc/; 2、测试匹配console.log(/abc/.test("abcde"));// → trueconsole.log(/abc/.test("abxde"));// → false 3、字符类\d Any digit character\w An alphanumeric character...
EaseJs 中 regX / regY 的用法
凹凸实验室
11-26 830
作者： 凹凸曼-大力士 前情提要 动效开发中最常用的基本变形动作就是缩放、旋转等，该变形会涉及到中心点的设置。由于我们采用了createJs中的easeJs库进行图形绘制，这个时候我们就会用到regX/regY。下面先看一个小demo: 我们先在页面中画一个100x100的矩形，并放置在canvas中间，代码如下： import React, { useRef, useEffect } from "react"; import { Power0, TweenMax as Tween }.
第七章 正则表达式编程
JavaAlliance
08-08 2205
什么叫知识，能指导我们实践的东西才叫知识。 学习一样东西，如果不能使用，最多只能算作纸上谈兵。正则表达式的学习，也不例外。 掌握了正则表达式的语法后，下一步，也是关键的一步，就是在真实世界中使用它。 那么如何使用正则表达式呢？有哪些关键的点呢？本章就解决这个问题。 内容包括： 正则表达式的四种操作 相关API注意要点 真实案例 1. 正则表达式的四种操作 正则表达式是匹配模式，不管如何使用正则...
js进阶正则表达式15验证身份证号（|符号的使用：var reg=/^\d{17}[\d|X]$|^\d{15}$/）（str的方法substr）...
weixin_33728268的博客
05-27 1561
js进阶正则表达式15验证身份证号（|符号的使用：var reg=/^\d{17}[\d|X]$|^\d{15}$/）（str的方法substr） 一、总结 1、|符号的使用：var reg=/^\d{17}[\d|X]$|^\d{15}$/ //2、|运算符的使用 3、末尾位的选择这里用的中括号而不是小括号 4、因为是选择，这个结束符是两个 2、str的方法substr的使用  var d...
js正则表达式（RegExp）
热门推荐
Bombas的博客
06-25 2万+
正则表达式是啥？正则表达式又叫作“规则表达式”（Regular Expression 即 RegExp），是计算机科学的一个概念。正则表达式有什么用？它常被用来搜索、替换那些符合某个模式的文本。正则表达式是：用来匹配特殊字符或有特殊搭配原则的字符的最佳选择。转义字符“\”例子：在var str = "asdfghj" 中加入一个"字符在正常情况下是无法成立的，但运用正则表达式中的转义字符则"\"可...
JS简单实现抛物线Transition动画效果
屁桃恒的博客
12-05 876
主要是通过event对象获取鼠标当前点击位置 然后css3—》 transition: left 1s linear, top 1s ease-in; 实现抛物线（小球移动时向右和向上的速度不一致 ，一个快一个慢，从而实现抛物线）关于这个文章中css3中的linear和 ease-in** <!DOCTYPE html> <html lang="en" style="width:...
图片的动画 ease.js
weixin_33911824的博客
07-27 150
使用方法 https://www.helloweba.com/view-blog-212.html 关于选取什么类型的动画 http://blog.sina.com.cn/s/blog_70a3539f0102v8az.html 事出仓促，有时间再整理 转载于:https://www.cnblogs.com/llllpzyy/p/7245307.html...
安居客626个城市二手房价数据(2010-2024.12)
07-25
参考《经济地理》中李辉(2019)的做法，团队爬取并整理了安居客在全国626个城市的二手房历史数据，并统计整理了各城市的月度和年度房价数据 本次推出的二手房历史房价挂牌数据，更新至2024年12月，包括626个城市的历史月度房价、年度均值、年度中位数、年末房价，对于购房和研究都有一定的参考价值 安居客626个城市二手房价数据 一、数据介绍 数据名称：中国城市二手房价数据 数据范围：626个城市 时间范围：2010.1-2024.12 样本数量：39994条 数据说明：包含历史月度数据、年度数据 更新时间：2025年1月 二、指标说明 行政区划代码 城市 所属省份 年份 月份 年月 历史房价 二手房均价 房价年均值 房价年中位数 年末房价 三、参考文献 李辉,王良健.房价、房价收入比与流动人口长期居留意愿——来自流动人口的微观证据[J].经济地理,2019,39(06):86-96.
实用算法的分析与程序设计.zip
最新发布
07-25
实用算法的分析与程序设计.zip
LabVIEW 2019结合三菱PLC与SQLite数据库实现多线程交互技术 v3.0
07-25
如何使用LabVIEW 2019与三菱PLC（Programmable Logic Controller）进行通信，并结合SQLite数据库和JKI状态机框架实现多线程交互。文中首先概述了项目的主要组成部分，即LabVIEW作为开发平台，三菱PLC作为控制器，通过OPC UA和MC通讯协议实现实时数据交换。接着深入探讨了技术细节，如OPC UA和MC协议的具体实现方法，以及SQLite数据库的集成和使用。最后，文章讲解了如何利用JKI状态机和数组队列来优化多线程交互，提高系统的效率和可靠性。 适合人群：对工业自动化感兴趣的工程师和技术人员，尤其是熟悉LabVIEW和三菱PLC的从业者。 使用场景及目标：适用于需要高效、可靠的工业控制系统的设计和开发，旨在提升系统的响应速度和稳定性。 其他说明：该项目不仅展示了现代工业控制技术的应用，也为未来的工业自动化发展提供了有价值的参考。
vscode中使用#include <REGX52.H>报红色波浪线
07-12
<think>我们正在解决VS Code中#include <REGX52.H>出现红色波浪线的问题。根据引用[1]，Keil的头文件位置需要告诉VS Code，这样编译器就不会报错了。因此，我们需要在VS Code中配置包含路径，指向Keil安装目录下的头文件位置。 步骤： 1. 首先，找到Keil的安装目录。通常，Keil安装在C:\Keil_v5\（具体路径可能因安装而异）。 2. 在Keil安装目录下，头文件通常位于C51\INC（对于C51单片机）或ARM\INC（对于ARM）等子目录中。由于我们要包含的是REGX52.H，它属于C51系列，所以应该在C51\INC目录下。确认该路径下确实有REGX52.H文件。 3. 在VS Code中，我们需要配置C/C++扩展的包含路径。打开VS Code，按下Ctrl+Shift+P打开命令面板，输入“C/C++: Edit Configurations (UI)”并选择，这将打开C/C++配置界面。 4. 在“包含路径”设置中，添加Keil的头文件路径，例如：C:\Keil_v5\C51\INC。如果有多个路径，用逗号分隔。 5. 保存配置，然后重新打开文件或重新加载VS Code，红色波浪线应该消失。 如果问题仍然存在，可以尝试以下额外步骤： - 确保已经安装了C/C++扩展。 - 检查VS Code的工作区设置和用户设置，确保没有覆盖包含路径。 - 如果使用其他扩展（如EIDE）或自定义构建，可能需要在该扩展的配置中设置路径。 引用[1]提到，Keil调试时自动调用头文件，而VS Code需要手动配置，所以正确配置包含路径是关键。 §§相关问题§§ 1. 如何在VS Code中配置多个包含路径？ 2. 如何确认Keil的头文件安装路径？ 3. VS Code中C/C++扩展的其他常见配置有哪些？</think>### VS Code 使用 `#include <REGX52.H>` 出现红色波浪线的解决方案 该问题是由于 **VS Code 无法自动定位 Keil 的头文件路径** 导致的。以下是详细解决步骤： #### 步骤 1：确认 Keil 头文件位置 1. 打开 Keil 安装目录（默认路径：`C:\Keil_v5\`） 2. 进入单片机型号对应的头文件目录： - 51 系列：`C:\Keil_v5\C51\INC\` - ARM 系列：`C:\Keil_v5\ARM\INC\` 3. 在 `INC` 目录中检查 `REGX52.H` 文件是否存在 #### 步骤 2：配置 VS Code 包含路径 1. 在 VS Code 中打开命令面板（`Ctrl+Shift+P`） 2. 搜索并选择：`C/C++: Edit Configurations (UI)` 3. 在 **Include Path** 中添加 Keil 头文件路径： ```json "includePath": [ "${workspaceFolder}/**", "C:/Keil_v5/C51/INC" // 根据实际路径修改 ] ``` ![包含路径配置示例](https://example.com/path-config.png) #### 步骤 3：检查编译器配置 1. 安装 `C/C++ Extension Pack` 扩展 2. 在 `.vscode/c_cpp_properties.json` 中确认配置： ```json { "configurations": [ { "name": "Win32", "includePath": ["C:/Keil_v5/C51/INC/**"], "defines": ["_DEBUG", "UNICODE"], "compilerPath": "C:/Keil_v5/C51/BIN/C51.EXE" // 指向 Keil 编译器 } ] } ``` #### 步骤 4：验证解决方案 1. 重启 VS Code 2. 在代码中输入： ```c #include <REGX52.H> void main() { P0 = 0xFF; // 测试寄存器访问 } ``` 3. 红色波浪线应消失，且可正常跳转到头文件定义 > ⚠️ **注意**：若使用 EIDE 等插件，需在插件设置中同步添加路径 `C:\Keil_v5\C51\INC`[^1]。 #### 备选方案：硬编码路径（不推荐） ```c #include "C:/Keil_v5/C51/INC/REGX52.H" // 绝对路径 ``` --- ### 常见错误排查 | 现象 | 解决方案 | |------|----------| | 路径正确仍报错 | 删除 `.vscode/ipch` 缓存文件夹后重启 | | 多项目配置冲突 | 在工作区设置中覆盖用户设置 | | ARM 头文件报错 | 改用路径 `C:/Keil_v5/ARM/INC` |
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值