我被美女包围了Cocos源码?

点击上方亿元程序员+关注和★星标

引言

大家好,我是亿元程序员,一位有着8年游戏行业经验的主程。

近期,国产真人恋爱影视游戏**《完蛋!我被美女包围了》连续多日 荣登Steam国区畅销榜首**。这款游戏力压 了一众热门免费游戏,如《PUBG》、《CS2》和《Apex》,稳居国区畅销榜首

体验 一下游戏,但是花钱是不可能花钱 的,于是我用Cocos 做了一个Demo 实现真人互动影像游戏

本文源码和源工程在文末获取,小伙伴们自行前往。仅供学习与交流,请勿用作其他用途。

1.准备素材

1.首先我们录制一下游戏中分蛋糕的名场面。

2.然后把游戏录屏拆分成几个小片段。

其中包括:

1.将蛋糕拿起来片段。

2.选择人物片段。

3.分别递给3个人物蛋糕的片段。

下面我们先看看实现原理

2.实现原理

1.组件

要想用Cocos实现真人互动影像游戏 ,我们可以利用Cocos的cc.VideoPlayer组件。然后通过在上面添加点击事件 去做一些逻辑响应

2.遇到问题

无论我们怎么调整节点位置,发现cc.VideoPlayer组件都是在界面的最上层,包括修改节点的zIndex。这样没办法在视频上方添加UI或者一些局部点击事件。

3.解决办法

首先 要勾选cc.VideoPlayer组件中的StayOnBottom,这个设置是保证cc.VideoPlayer组件置于最底部。

然后 Cocos2.X版本需要在Cocos安装目录中搜索boot.js,找到resources\static\preview-templates目录下的boot.js文件。

打开boot.js文件并且在cc.game.run之前添加cc.macro.ENABLE_TRANSPARENT_CANVAS = true;开启支持全透明。

Cocos3.X版本可以直接在项目设置-MarcoConfigurations中勾选ENABLE_TRANSPARENT_CANVAS

最后修改主摄像机Main CameraBackgroundColor的透明度为0。

这样就可以实现在cc.VideoPlayer组件之上添加UI或者局部点击事件了。

2.编写代码

创建一个VideoGame组件继承cc.VideoPlayer。同时创建一个cc.VideoClip[]数据用于获取视频片段。

1.核心属性包括:

1.resourceType:视频来源:REMOTE 表示远程视频 URLLOCAL 表示本地视频地址。

2.remoteURL:远程视频的 URLresourceType选择REMOTE时生效。

3.clip:本地视频剪辑,resourceType选择LOCAL时生效。

4.videoPlayerEvent:视频播放回调函数,该回调函数会在特定情况被触发,比如播放中,暂时,停止和完成播放。

5.其他的一些属性大家可以自行查阅。

2.核心方法包括:

1.play():如果视频被暂停播放了,调用这个接口可以继续播放。如果视频被停止播放了,调用这个接口可以从头开始播放。

2.isPlaying():判断当前视频是否处于播放状态 。

3.stop():如果一个视频正在播放,调用这个接口可以立马停止播放。

4.其他的一些方法大家可以自行查阅。

3.编辑UI

1.创建节点

首先我们先创建个VideoGame节点,然后添加一个子节点videoBtnNode和它的三个子节点video1video2video3

其中VideoGame节点用于添加cc.VideoPlayer组件,三个子节点video1video2video3用于点击选择人物。

2.添加组件

首先给VideoGame节点添加编写好的VideoGame组件。勾选StayOnBottom,添加选择videoPlayerEvent事件,添加VideoClips视频片段。

给参与点击的三个子节点video1video2video3添加BlockInputEvents用于拦截事件,防止向下传递。

3.效果演示

点击开始播放拿蛋糕画面。

然后切换到人物选择画面。

给蛋糕郑梓妍。

给蛋糕肖鹿。

给蛋糕李云思。

结语

本文仅供娱乐参考学习,生活虽苦,但是也要时常整活。

在哪里 可以看到如此清晰的思路,快跟上我的节奏!关注我 ,和我一起了解 游戏行业最新动态,学习游戏开发技巧。

我是"亿元程序员",一位有着8年游戏行业经验的主程。在游戏开发中,希望能给到您帮助, 也希望通过您能帮助到大家。

AD:笔者线上的小游戏《贪吃蛇掌机经典》《填色之旅》《重力迷宫球》大家可以自行点击搜索体验。

实不相瞒,想要个在看 !请把该文章分享给你觉得有需要的其他小伙伴。谢谢!

推荐专栏:

和8年游戏主程一起学习设计模式

8年主程手把手打造Cocos独立游戏开发框架

从零开始开发贪吃蛇小游戏到上线系列

游戏开发的技巧、心得、资讯

本文源码和源工程 可通过阅读原文获取

点击下方绿色按钮+关注

相关推荐
持久的棒棒君2 小时前
npm安装electron下载太慢,导致报错
前端·electron·npm
crary,记忆4 小时前
Angular微前端架构:Module Federation + ngx-build-plus (Webpack)
前端·webpack·angular·angular.js
漂流瓶jz5 小时前
让数据"流动"起来!Node.js实现流式渲染/流式传输与背后的HTTP原理
前端·javascript·node.js
SamHou05 小时前
手把手 CSS 盒子模型——从零开始的奶奶级 Web 开发教程2
前端·css·web
我不吃饼干5 小时前
从 Vue3 源码中了解你所不知道的 never
前端·typescript
开航母的李大5 小时前
【中间件】Web服务、消息队列、缓存与微服务治理:Nginx、Kafka、Redis、Nacos 详解
前端·redis·nginx·缓存·微服务·kafka
Bruk.Liu5 小时前
《Minio 分片上传实现(基于Spring Boot)》
前端·spring boot·minio
鱼樱前端6 小时前
Vue3+d3-cloud+d3-scale+d3-scale-chromatic实现词云组件
前端·javascript·vue.js
zhangxingchao6 小时前
Flutter入门:Flutter开发必备Dart基础
前端
佚名猫6 小时前
vue3+vite+pnpm项目 使用monaco-editor常见问题
前端·vue3·vite·monacoeditor