Cocos Creator 学习记录
官网地址:https://www.cocos.com/
1、修改帧率(FPS)
1 | cc.game.setFrameRate(30) |
2、键盘按下触发操作
1 | 这里主要记录的是cc.macro.KEY、systemEvent、SystemEvent.EventType |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 | /** *cc.macro.KEY 对应键盘值 *systemEvent 相关文档地址 *https://docs.cocos.com/creator/api/zh/classes/SystemEvent.html *SystemEvent.EventType 有三个属性 * KEY_DOWN String 当按下按键时触发的事件 * KEY_UP String 当松开按键时触发的事件 * DEVICEMOTION String 重力感应 **/ onLoad () { cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this .onkeypress, this ) }, onkeypress(e){ if (e.keyCode == cc.macro.KEY.left) { this .direction = cc.v2(-1, 0) } else if (e.keyCode == cc.macro.KEY.right) { this .direction = cc.v2(1, 0) } else if (e.keyCode == cc.macro.KEY.up) { this .direction = cc.v2(0, 1) } else if (e.keyCode == cc.macro.KEY.down) { this .direction = cc.v2(0, -1) } else if (e.keyCode == cc.macro.KEY.space) { this .direction = null } }, update (dt) { if ( this .direction == null ) return ; let pos = cc.find( 'Canvas/xx' ).getPosition() pos.x += this .speed * this .direction.x pos.y += this .speed * this .direction.y cc.find( 'Canvas/xx' ).setPosition( pos ) }, |
3、查询节点
1 2 3 4 5 6 7 | this .node.children; this .node.getChildByName( "Cannon 01" ); 如果子节点的层次较深,你还可以使用 cc.find,cc.find 将根据传入的路径进行逐级查找: cc.find( 'Canvas/xx' ) |
4、tween 动画效果
1 2 3 4 5 6 7 8 9 10 11 12 | // 个人理解 cc.tween(node).to(持续时间, 执行的对象, 执行的速度) /** * to: 对属性进行绝对值计算,最终的结果是设置的属性值 * by: 对属性的相对值计算,最终的运行结果是设置的属性值加上开始运行是节点的属性值 * start() 表示这个动画运行 **/ //案例 cc.tween(node) .to(1, {scale: 2, position: cc.v3(100, 100, 100)}) .call(() => { console.log( 'This is a callback' ); }) .by(1, {scale: 3, position: cc.v3(200, 200, 200)}, {easing: 'sineOutIn' }) .start(cc.find( 'Canvas/cocos' )); |
5、获取文本(label)内容
1 2 3 | this .label = this .getComponent(cc.Label); this .text = this .label.string; // 获取文本 this .label.string = '' ; // 清空文本 |
6、加载资源(cc.resources.load())
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | 示例: onClicked(){ let self = this ; cc.resources.load( 'icon/汽车' , cc.SpriteFrame, function (err, assets){ self.node.getComponent(cc.Sprite).spriteFrame = <cc.SpriteFrame> assets; // <cc.SpriteFrame> 类型转化 }); } cc.resources.load( path, type, onComplete) 第一个参数: path 表示要加载的路径 例如: icon/汽车 指的是 assets/resources/icon/汽车 * 待加载的资源必须放在 resource 目录下 * 路径不能加后缀 第二个参数: type 指定资源对象类型,可以省略 例如 cc.SpriteFrame, cc.AudioClip 第三个参数: onComplete 指定回调方法,当资源加载完毕调用 function ( err, assets ){} 若 err == null ,表示资源加载成功,assets即为加载得到的资源对象 若 err != null , 表示资源加载失败,err即为出错的原因 |
7、引入其他js文件获取内容:require('event')
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | let EventJs = require( 'event' ) properties: { direction: null , speed: 0.001, EventJs: { default : null , type: cc.node } }, onLoad () { // console.log('导入jseventJs', EventJs) let event = new EventJs() console.log( 'is EventJs' , event) }, |
8、动态创建节点
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | properties: { bulletIcon: { default : null , type:cc.SpriteFrame, } }, onLoad () { this .node.on( 'touchstart' , this .onTouchStart, this ) }, onTouchStart (e) { this .fire(); }, fire() { if ( this .bulletIcon == null ) { cc.log( '请设置bulletIcon图片' ); return ; } // 动态创建一个node,添加sprite组件 let bullet = new cc.Node(); let sprite = bullet.addComponent(cc.Sprite) sprite.spriteFrame = this .bullectIcon; bullet.parent = this .node; // 作为子节点 bullect.setPosition(cc.v3(0, 50, 0)); // 设置初始位置 } |
9、public、private 和 protected 区别
1 2 3 4 5 | TypeScript 可以使用三种访问修饰符(Access Modifiers),分别是 public、 private 和 protected 。 public 修饰的属性或方法是公有的,可以在任何地方被访问到,默认所有的属性和方法都是 public 的<br> private 修饰的属性或方法是私有的,不能在声明它的类的外部访问<br> protected 修饰的属性或方法是受保护的,它和 private 类似,区别是它在子类中也是允许被访问的 |
10、利用坐标计算其夹角
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | 通过高中数学我们可以知道, A到B的向量 = B点 - A点。 那我们只需要将目标对象的位置 - 自己的位置,即可得到方向向量。 方向向量转换为角度,需要认清一个隐含变量,就是这个角度的基准是 X 轴正方向。 使用向量来表示就是 (1,0)。 cc.Vec2提供了两个函数 cc.Vec2.angle和cc.Vec2.signAngle, 后者相比前者来说,后者产生的角度是有符号的,而前者会永远为正。 我们使用cc.Vec2.signAngle来将方向向量转换为弧度。 骨骼点的坐标 let leftKneePoint = BodyPointData.Instance().leftKneePoint // 左膝盖 let rightKneePoint = BodyPointData.Instance().rightKneePoint let leftButtockPoint = BodyPointData.Instance().leftButtockPoint // 左臀 let rightButtockPoint = BodyPointData.Instance().rightButtockPoint // 现在知道左臀,右臀,左膝盖,右膝盖的坐标。计算出两腿之间的夹角 // cc.v2() 得到两条腿的向量坐标 let leftLegVector = cc.v2( leftButtockPoint.x - leftKneePoint.x, leftButtockPoint.y - leftKneePoint.y ) let rightLegVector = cc.v2( rightButtockPoint.x - rightKneePoint.x, rightButtockPoint.y - rightKneePoint.y ) // signAngle 得到夹角弧度 let Radian = leftLegVector.signAngle(rightLegVector) // 得到具体的度数(转换为数字) let Rate = cc.misc.radiansToDegrees(Radian) |
、、、
努力到无能为力,拼搏到感动自己。
欢迎大家在下方多多评论。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通