creator 精灵绕点做圆周运动

先看一下效果:

具体思路:

根据圆的半径求圆上的点的坐标

来看一下具体实现:

/**
 * @ 图片绕指定圆心进行圆周运动
 */

const {ccclass, property} = cc._decorator;

@ccclass
export default class NewClass extends cc.Component {

    // 汽车
    @property(cc.Sprite)
    sprCar: cc.Sprite = null;

    // 圆心
    @property
    circleCenter: cc.Vec2 = cc.v2(0, 0);

    // 半径
    @property
    circleRadius: number = 0;

    // 车速
    @property
    carSpeed: number = 0;

    // 弧度
    radian: number = 0;

    onLoad () {
        this.schedule(this.circleMove, 0.01);
    }

    circleMove (dt) {
        // 先计算弧度
        this.radian += dt * (this.carSpeed/100);
        let x = this.circleRadius * Math.cos(this.radian) + this.circleCenter.x; 
        let y = this.circleRadius * Math.sin(this.radian) + this.circleCenter.y;
        let angle = 360- 180/Math.PI*this.radian;
        this.sprCar.node.rotation = angle;
        console.log('x = ' + x + '  y = ' + y + '  angle = ' + angle);
        this.sprCar.node.position = cc.v2(x, y);
    }

}

 

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值