我想要实现一个点击卡牌后,卡牌会被翻到背面,显示卡背信息的这样一个特效。(前面的介绍字有点多,下面附有代码截图,大佬们嫌字多可以直接看代码)
我的大致思路是这样的:
先有一个卡牌prefab,此处假设他叫 card 。 card 中包含“cardPic”(卡面),“card_bk”(卡背)两个子节点。其中“card_bk”节点显示优先级比“cardPic”高,不透明度为0
1.给这个 card 设置一个点击事件,点击后触发翻牌方法
2.触发翻牌后,先将该 card 的scaleX值按照给定的翻牌速度flipSpeed逐帧递减至0.01。
3. 此时 card 变为很细的一条线,然后在此状态将card_bk的不透明度调至255,这样card_bk就会因为优先级覆盖cardPic
4.然后再将 card 的scaleX值按照flipSpeed逐帧还原回1
这样就完成了一个简单的翻牌特效
然后针对如何实现“逐帧增减 card 的scaleX值”,因为我水平不足,就想了一个比较“笨”的办法,就是:
1.设置一个开关“scaleX变化”的值flipFlag,flipFlag默认为0,当flipFlag为1时,在update()中使scaleX值增加;flipFlag为-1时,update中scaleX值减少。
2.当点击卡牌后,将flipFlag置-1,此时update()中开始使scaleX减少,当减少到下限0.01时,不再下降,并将flipFlag弹回为0。
3.flipFlag弹回0时,说明卡牌的scaleX已经成功减少到0.01,此时改变card_bk的不透明度。改变不透明度后,将flipFlag设为1,将scaleX的值回升,回升完毕后,再将flipFlag弹回0。修改完成!
但是在实际编写代码的时候,遇到了一些问题,这里直接给出我编写的代码:
如上代码所述,我在实际运行代码的时候,点击卡牌没有反应,查看了浏览器的错误报告也没有显示任何错误。所以想向大佬们求助一下是我的思路哪个地方出问题了呢?
另外,有没有更好地实现这个功能的方法呢?



