首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Cocos Creator | 开红包小游戏实现翻开效果,有代码!

Cocos Creator | 开红包小游戏实现翻开效果,有代码!

作者头像
一枚小工
发布2020-03-02 14:27:25
1K0
发布2020-03-02 14:27:25
举报
文章被收录于专栏:Cocos Creator开发Cocos Creator开发

游戏预览

游戏玩法

▌游戏开始后,点击开抢,屏幕中会出现9个未开启的红包,点击任一红包,翻开随机金额的红包,直到翻开所有红包,游戏结束,可以照此继续下去。

游戏介绍

▌游戏主要分 2 部分,游戏主逻辑 ( Game ) 和红包预制逻辑 ( Card ),游戏逻辑主要控制红包布局和点击后的逻辑处理 ( 包括红包动画的播放 ),红包预支逻辑主要控制红包的随机金额出现后,更换不同的纹理,逻辑并不复杂。

游戏逻辑

▌游戏逻辑主要是播放动画和控制红包的布局,分开两部分讲。

1. 翻开动画

借助 scaleTo 和 skewTo 模拟翻开效果。一开始红包是背面,x 轴方向先缩放到 0 ,然后红包翻开到正面,再把 x 轴缩放到 1,在变化的同时,为了有一点翻开的 3D 效果,沿着 y 轴倾斜,角度不大,就倾斜 5 度即可,可以根据自己的需要调整。

2. 布局控制

从上到下,从左到右,分 3 行 3 列,摆放红包,每次游戏结束以后,清除之前的红包,重新布局一次。

红包预制

▌红包预制,添加 2 个精灵作为红包的正面和背面,未翻开时,显示背面,翻开以后显示正面,点击红包,记录可能出现的金额纹理,封装一个根据金额更换纹理的接口,在翻开红包以后,动态更新红包纹理。

游戏结束判断

▌这个可以根据需要修改,demo 内的是每次翻开动画结束以后,翻开红包数 +1,当翻开的总红包个数为9的时候,重新显示9个未翻开的红包,进行下次游戏,红包预制需要监听触摸事件,翻开过的红包,不能处理点击事件。

效果体验

▌点击【阅读原文】,体验效果。

获取代码

▌关注公众号,发送消息【翻红包】,获取游戏代码

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2019-12-20,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 一枚小工 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档