---

一、动画

1. 需要新增加动画的地方有三处：1）新生成数字块时；2）数字块合并时；3）显示排行榜时。可参考cc.tween官方文档。
2. 新生成数字块时。修改game.js的addBlock()方法。

    addBlock() {...if (locations.length == 0) {...} else {...cc.tween(block).to(ANIMATION_DURATION, { scale: 0.75 }).to(ANIMATION_DURATION, { scale: 1 }, { easing: 'backOut' }).start();...}},

3. 数字块合并时。修改moveDirection(direction)方法。

    moveDirection(direction) {...let move = (x, y, callback) => {...if (condition || this.data[x][y] == 0) {...} else if (this.data[destX][destY] == 0) {// Move...} else if (this.data[destX][destY] == this.data[x][y]) {// Mergecc.tween(this.blocks[destX][destY]).to(ANIMATION_DURATION, { scale: 1.25 }).to(ANIMATION_DURATION, { scale: 1 }, { easing: 'backOut' }).start();...} else {...}};...},

4. 显示排行榜时。修改showRanks()方法。

    showRanks() {...cc.tween(this.rankBox).to(ANIMATION_DURATION, { scale: 1.05 }).to(ANIMATION_DURATION, { scale: 1 }, { easing: 'backOut' }).start();},

5. 实际预览后，发现效果不佳会产生卡顿的感觉，修改将这三个动画封装为一个函数showAnimation(object)，并修改MOVE_DURATION的值。

const MOVE_DURATION = 0.02;...showAnimation(object) {cc.tween(object).to(0.06, { scale: 1.1 }).to(0.06, { scale: 1 }).start();},

6. 在微信开发者工具中预览可得。

---

二、音效

1. 下载点击音效，拷贝至assets\sound目录下，在restartButton下新建一个clickSound节点，添加AudioSource组件，将click.mp3拖至Clip栏。

2. 在restartButton中将Button组件中的Click Event改为1，cc.Node选择clickSound节点，组件为cc.AudioSource，方法为play。

3. 其他按钮同理，但实际预览过程中，返回按钮并不能听到声音。原因是声音事件还没有触发，相关box的active为false了，因此修改AudioSource相关代码。
4. 在properties中添加clickSound，并与Canvas绑定，在按钮触发的相关方法中调用play()方法即可。

    properties: {...clickSound: cc.AudioSource,},...restart() {...this.clickSound.play();},

---