Cocos3.2版本拖动屏幕坐标控制Cube旋转

这篇博客介绍了如何在Cocos3.2游戏中,通过监听鼠标事件来实现立方体(Cube)的旋转。在`RotateCtrl`组件中,当鼠标按下时启动旋转,通过计算鼠标移动的delta值和旋转轴,更新立方体的四元数旋转。此外,提到了Unity中的类似实现,通过`Input.GetAxis`获取鼠标移动并旋转物体。

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

//脚本直接挂在Cube上即可

@ccclass('RotateCtrl')

export class RotateCtrl extends Component {

private isClickOn: boolean = false;

start() {

systemEvent.on(SystemEventType.MOUSE_DOWN, this.Down, this);

systemEvent.on(SystemEventType.MOUSE_MOVE, this.Move, this);

systemEvent.on(SystemEventType.MOUSE_UP, this.Up, this);

}

Move(EventTouch: EventMouse) {

if (!this.isClickOn) return;

let delta = EventTouch.getDelta();

let q_tmp = new Quat();

let v_tmp = new Vec3(-delta.y, delta.x, 0);

v_tmp.normalize();

let out_Q = Quat.rotateAround(q_tmp, this.node.rotation, v_tmp, delta.length() * 0.005);

this.node.setRotation(out_Q.x, out_Q.y, out_Q.z, out_Q.w);

}

Down(EventTouch: EventMouse) {

this.isClickOn = true;

}

Up() {

this.isClickOn = fals

Cocos Creator模拟砸金蛋3d旋转效果 | 附代码egg.zip // Learn TypeScript: // - [Chinese] https://docs.cocos.com/creator/manual/zh/scripting/typescript.html // - [English] http://www.cocos2d-x.org/docs/creator/manual/en/scripting/typescript.html // Learn Attribute: // - [Chinese] https://docs.cocos.com/creator/manual/zh/scripting/reference/attributes.html // - [English] http://www.cocos2d-x.org/docs/creator/manual/en/scripting/reference/attributes.html // Learn life-cycle callbacks: // - [Chinese] https://docs.cocos.com/creator/manual/zh/scripting/life-cycle-callbacks.html // - [English] http://www.cocos2d-x.org/docs/creator/manual/en/scripting/life-cycle-callbacks.html const {ccclass, property} = cc._decorator; @ccclass export default class Game extends cc.Component { @property Count: number = 5; @property(cc.Prefab) prefab: cc.Prefab = null; @property(cc.Node) nodeParent: cc.Node = null; private mEggs: cc.Node[] = []; // LIFE-CYCLE CALLBACKS: // onLoad () {} start () { } // update (dt) {} onClick(event, data){ switch(data){ case &#39;add&#39;:{ this.addEggs(); break; } case &#39;move&#39;:{ this.moveEggs(); break; } case &#39;stop&#39;:{ this.stopMoveEggs(); break; } } } addEggs(){ if(this.Count <= 0){ return; } this.mEggs = []; const N = 360 / this.Count; for(let i = 0; i < this.Count; i++){ let egg = cc.instantiate(this.prefab); let js = egg.getComponent(&#39;Egg&#39;); js.setRadian(i * N * Math.PI / 180); js.updatePos(); egg.parent = this.nodeParent; this.mEggs.push(egg); } } moveEggs(){ for(let i = 0; i < this.mEggs.length; i++){ this.mEggs[i].getComponent(&#39;Egg&#39;).setMove(true); } } stopMoveEggs(){ for(let i = 0; i < this.mEggs.length; i++){ this.mEggs[i].getComponent(&#39;Egg&#39;).setMove(false); } } }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Star_MengMeng

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值