cocos2d-js 按钮本点击时,按钮缩放功能

前端之家收集整理的这篇文章主要介绍了cocos2d-js 按钮本点击时,按钮缩放功能前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

今天策划在需求上说想在原本的按钮点击基础上,加上一个按钮被点击时触发按钮缩放的表现。

第一时间想到的是:

var scaleSp = new cc.Sprite(res.gameLobby_startGameBtn_png);
scaleSp.setScale(0.9);

var startBtn = new cc.MenuItemSprite(new cc.Sprite(res.gameLobby_startGameBtn_png),scaleSp,function () {
   
},this);
 
但直接利用上面代码后会发现,缩放后的按钮是以左下角进行缩放的,
后跟入源码后发现原来精灵被加入的时候锚点都被设置成cc.p(0,0)了
 

在网上找到了一个解决方案, 直接对ccMenuItem.js 中的 代码进行修改

setSelectedImage: function (selectedImage) {
    if (this._selectedImage === selectedImage)
        return;

    if (selectedImage) {
        this.addChild(selectedImage,0,cc.SELECTED_TAG);
        selectedImage.anchorX = 0;
        selectedImage.anchorY = 0;

        var point = selectedImage.getPosition();
        var size = selectedImage.getContentSize();
        selectedImage.setPosition(cc.p(point.x - (selectedImage.getScaleX() - 1)/ 2 * size.width,point.y - (selectedImage.getScaleY() - 1) / 2 * size.height));
    }

    if (this._selectedImage) {
        this.removeChild(this._selectedImage,true);
    }

    this._selectedImage = selectedImage;
    this._updateImagesVisibility();
},

这种做法如果打包app的话 貌似需要修改c++的代码,为了避免不必要的麻烦

var normalImage = startBtn.getNormalImage();
normalImage.setAnchorPoint(cc.p(0.5,0.5));

var selectedImage = .getSelectedImage();
selectedImage.setAnchorPoint(cc.p(0.5,0.5));

我们在创建完按钮之后将图片取出重新修改锚点。

猜你在找的Cocos2d-x相关文章