CocosCreator入门之《摘星星》-完全学习记录（四）-END

完整版：https://quqi.gblhgk.com/s/184718/ykolFXd1LYL9mzQE

最后就是加得分特效，让画面更生动。

先上预览：

关于如何制作得分特效预制，以及如何制作动画和在动画编辑器中绑定响应函数，前辈已给出详尽教学——我再赘述也不及的：

https://blog.csdn.net/la_vie_est_belle/article/details/102652568

关于插件推荐，再重复推荐一次论坛大神@Next的作品：https://blog.csdn.net/la_vie_est_belle/article/details/102652568

这是正常项目的实时节点显示，可以看到star一直是那一个，socreFX出现又消失：

当有些地方出错时（比如动画编辑器最后一帧忘记或者写错回调函数）：

插曲：

最后贴上思路和代码：

　　这里仅仅是添加得分特效模块需要新增的代码，不能够直接运行：

　　

// ScoreAnim.js

cc.Class({
  extends: cc.Component,

  init(scoreFX) {
    this.scoreFX = scoreFX;
  },

  hide() {
    this.scoreFX.despawn();
  }
});

// ScoreFX.js

cc.Class({
  extends: cc.Component,

  properties: {
      anim: {
        default: null,
        type: cc.Animation
      }
  },

  init (game) {
    this.game = game;
    let scoreAnim = this.anim.getComponent('ScoreAnim');
    scoreAnim.init(this);
  },

  despawn() {
    this.game.despawnScoreFX(this.node);
  },

  play() {
    this.anim.play('score_pop');
  }
});

// Game.js

cc.Class({
  extends: cc.Component,

  properties: {
    scoreFXPrefab: {
      default: null,
      type: cc.Prefab
    },
  },

  onLoad () {
    this.scoreFxPool = new cc.NodePool('ScoreFX');
  },

  
  gainScore(pos) {
    let fx = this.spawnScoreFX();
    this.node.addChild(fx);
    fx.setPosition(pos);

    let scoreFX = fx.getComponent('ScoreFX');
    scoreFX.init(this);
    scoreFX.play();
  },

  spawnScoreFX() {
    let fx = this.scoreFxPool.get();

    if (!fx) {
      fx = cc.instantiate(this.scoreFXPrefab);
    }
  
    return fx;
  },

  despawnScoreFX(scoreFx) {
    this.scoreFxPool.put(scoreFx);
  }
});

以上，祝学习愉快。