CocosCreator让角色移动起来

ゞ浴缸里的玫瑰 2024-04-17 18:54 29阅读 0赞

1.  布局如下：  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3lhbmdzaHVhaW9ubGluZQ_size_16_color_FFFFFF_t_70]
2.  编写移动脚本

cc.Class({ 
        extends: cc.Component,
        properties: { 
            isAdd: { }//坐标是加还是减
        },
        // LIFE-CYCLE CALLBACKS:
        onLoad() { 
            //鼠标拖动移动
            this.node.on(cc.Node.EventType.TOUCH_MOVE, function (event) { 
                this.opacity = 100;
                var delta = event.touch.getDelta();
                this.x += delta.x;
                this.y += delta.y;
            }, this.node);
            //选中变透明
            this.node.on(cc.Node.EventType.TOUCH_END, function () { 
                this.opacity = 255;
            }, this.node);
        },
        update(dt) { 
            // 根据当前速度更新主角的位置
            if (this.node.x >= 0) { 
                this.isAdd = false;
            } else if (this.node.y <= -150) { 
                this.isAdd = true;
            }
            if (this.isAdd) { 
                this.node.x += 20 * dt;
                this.node.y += 20 * dt;
            } else { 
                this.node.x -= 20 * dt;
                this.node.y -= 20 * dt;
            }
        },
    });

1.  选择主角组件，如图的方式添加脚本  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3lhbmdzaHVhaW9ubGluZQ_size_16_color_FFFFFF_t_70 1]
2.  运行项目如图：  
    ![在这里插入图片描述][2019083011225489.gif]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3lhbmdzaHVhaW9ubGluZQ_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/0856cbbf3b0b4914bd93666beb3c2170.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3lhbmdzaHVhaW9ubGluZQ_size_16_color_FFFFFF_t_70 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/f431097ce1eb478dacc7f91c32413a5f.png
[2019083011225489.gif]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/91ee8c556cbf4a3581ecc85bc1998ed7.gif