1.準(zhǔn)備素材（正、背面牌各一張）

2.cocos creator創(chuàng)建一個(gè)Sprite（width:200,height:120），SpriteFrame默認(rèn)是背面牌

3.創(chuàng)建一個(gè)animate動(dòng)畫，名為fanpai：

image1.png

（1）圖中poker2為牌的Sprite，選中后，點(diǎn)擊【add property】添加width；

（2）圖中時(shí)間軸，分別在0:00、0:10、0:20設(shè)置Sprite的width為200、40、200，也就是說在動(dòng)畫一開始到0.1秒width縮小到40，然后又增長到200，這樣就多了一個(gè)視覺上翻牌的感覺。

4.接下來是換牌，正面換為背面牌

var anim = this.poker2.node.getComponent(cc.Animation);

anim.play('fanpai');//播放名為fanpai動(dòng)畫

  this.schedule(function(){

  var SF = this.poker2.getComponent(cc.Sprite);

  SF.spriteFrame = this.frontBgSF;//frontBgSF 是正面牌的SpriteFrame

},0.1,0);//0.1秒后把poker2的SpriteFrame換成正面牌

過程：0秒的時(shí)候是背面牌，0.1秒的時(shí)候width縮小到40，此時(shí)牌為背面牌，0.2秒的時(shí)候width增加到200，此時(shí)牌為正面牌，因此視覺上實(shí)現(xiàn)了翻轉(zhuǎn)的感覺。實(shí)際效果可以根據(jù)Sprite的大小自己調(diào)。

5.如果是多張牌要依次翻開，可以設(shè)置好schedule的間隔時(shí)間，依次執(zhí)行各Sprite的動(dòng)畫。

此方法也是簡單實(shí)現(xiàn)視覺上自動(dòng)翻牌的效果，歡迎指正和討論。