cocos creator 3D | 拇指射箭
拇指射箭!你能射中靶心么?
效果预览
配置环境:
cocos creator 3d v1.0.0
玩法介绍:
长按屏幕,拖动瞄准,放手发射。风向、重力和距离影响最终结果!越靠近中心得分越高!最高分10分!
实现原理
流程图:
镜头控制:
采用两个摄像机控制镜头显示。一个是发射视角的摄像机;另一个是绑定在箭节点的摄像机,会跟随箭一起移动。通过控制摄像机节点的 active 实现镜头切换。
弓箭控制:
通过触摸移动的距离乘以一个调控系数,控制弓箭的位置。
private onTouchMove(touch: Touch) {const delta = touch.getDelta();this.NodePos_bows.x -= delta.x * CONST_TOUCH_FACTOR;this.NodePos_bows.y = delta.y * CONST_TOUCH_FACTOR;
}
为所有需要控制位置的节点写了一个通用的组件脚本。只要为节点添加这个脚本,就可以通过设置 x,y,z 调整位置。
export class NodePos extends Component {private _curPos: Vec3 = cc.v3();start() {this._curPos = this.node.position;} get x() {return this._curPos.x;}set x(x: number) {this._curPos.x = x;}// 省略部分代码update(deltaTime: number) {this.node.position = this._curPos;}
}
发射箭:
使用 tween 控制箭位置,并在发射结果添加重力、风向和距离的影响。并为箭添加了拖尾组件。
tweenUtil(this.NodePos_arrow).stop().to(5, { z: targetZ, x: targetX, y: targetY }).to(1, {}).call(() => {this.gameOver();}).start()
得分计算:
通过计算箭和靶心的距离,以及靶子的半径关系,可以计算出得分。
const dis = this.NodePos_arrow.position.clone().subtract(this.NodePos_target.position).length();
const score = dis < CONST_TARGET_RADIUS ? ((1 - dis / CONST_TARGET_RADIUS) * 10).toFixed(2) : ('0');
小结
这个拇指射箭游戏采用了两个摄像机控制镜头显示。由于 cocos creator 3d 不能直接设置 x,y,z 控制位置,所以写了个简单的组件控制位置。
以上就是这个拇指射箭的主要实现方案。文章底部可以点击链接试玩哦!打到 9 分以上还是要技巧的哦!
本文使用图片素材来自网络!版权归原作者所有,如有侵权还请联系!
在线试玩
源码获取
cocos creator 3D | 拇指射箭相关推荐
- cocos creator 3D | 拇指投篮 | 3D项目入门实战
你的命中率是多少呢?文章底部试玩! 效果预览 配置环境: Cocos Creator 3D v1.0.1 玩法说明: 触摸屏幕,向上滑动投篮!注意篮板是会移动的哦!看看你的命中率是多少! 实现原理 为 ...
- 022 - cocos creator 3D
#cocos creator 3D warning 报错:"project:///assets/main.js,将https中的export注视掉重试一遍 知识点 scrollview组件添 ...
- 长远发展java还是cocos_聊聊 Cocos Creator 3D 的未来
Hi,各位开发者,很高兴跟大家见面.在我们发布了 Cocos Creator 3D 之后,得到了许多积极的反馈和建议,在此真诚地感谢大家的支持! 从去年十月份 Cocos Creator 3D 诞生 ...
- 如何用 Cocos Creator 3D 如何实现小姐姐的发丝高光?
Introduction PRB 材质改变了人们对于引擎实时渲染画面的理解,让玩家在游戏中,也能够体验到锈蚀的金属,厚重的皮革,精细的纹理,感受更加真实的世界.在正式发布的 Cocos Creator ...
- Cocos Creator 3D 材质系统:曲面效果如何实现?
引言 前不久发布的 Cocos Creator 1.0.2 版本中正式加入了对 OPPO 小游戏.vivo 小游戏以及华为快游戏平台的支持,在诸多 Creator 3D 制作的小游戏案例中,<猪 ...
- cocoscreator3d 模型透明_用 Cocos Creator 3D 实现小姐姐的发丝高光
本文作者:武云潇 Cocos Creator 3D 引擎开发工程师 >>作者知乎:YunHsiao Wu >>作者其他文章:<It's not a bug, it's ...
- 用 shader effect 实现雨滴落水效果!Cocos Creator 3D !
最近逛论坛时,看到一位大佬在分享各种 shader 特效.基于其中的水波 shader ,白玉无冰写了一个玩水效果!文章底部获取完整代码!还可以试试水哦! 先一起看看效果- 点击任意位置,会在该位置生 ...
- 麒麟子Cocos Creator 3D研究笔记十:【qfw】开源的Extension Pack for Cocos Creator 3D
零.写在前面 愿你活得烈马青葱,不为他人的目光所累 ---嗯! 阿子也不知道这个句子的原始出处,但就想把它分享给大家.专心写好自己的BUG,让别人说去吧! 在进入今天的正文之前,阿子想给大家聊聊最近使 ...
- 蚂蚁庄园运动会登山赛!3d项目入门实战!Cocos Creator 3D!
好像没写过3d项目分享,那么就跟着蚂蚁庄园的小鸡一起跳跳跳吧! 效果预览 配置环境: cocos creator 3D 1.0.0 首先是寻找3d资源花费了大半天时间,开发3d游戏不易呀!最终还是向K ...
最新文章
- 中国知网PCNI号码
- webview加载html跳转,WebView加载网页(二)
- 【转】 LSD(Line Segment Detector) 直线段检测算法学习~
- python如何调用c函数实现真正意义的多线程_python如何使用多线程执行多个函数?...
- “约见”面试官系列之常见面试题之第五十三篇之网站的资源优化(建议收藏)
- Arcgis10安装说明
- 蓝桥杯 ADV-126 算法提高 扫雷
- 面试出现频率超高的一道算法题
- Python数据分析四剑客:IPython、Numpy、pandas、Matplotlib
- 宠物商城后台管理系统(springMVC+Mybatis+数据库)
- seo高手需要具备的能力
- 写了一个个人资产管理的后台系统
- SEDA: An Architecture for Well-Conditioned, Scalable Internet Services
- 你应该掌握的JavaScript高阶技能(六)
- 网易互娱2022校园招聘在线笔试 -《魔塔》
- Linux线程数和系统线程数查看
- 【数据结构】- 几个步骤教你认识并实现一个链表之带头(哨兵位)双向循环链表(上)
- 计算机u盘被禁用怎么办,笔记本电脑U盘等USB设备被禁用怎么处理
- Vmware上安装openstack(Queens版)
- C# ComboBox 下拉选项框
热门文章
- .NET CORE 关于void返回类型的坑
- android 重启应用(cocos2d-x重启游戏)
- 山东5G覆盖时间表出炉:2020年市区重点区域,2023年覆盖县城
- ASO优化之应用商店排名因素
- 中国网络游戏数据月度跟踪
- 下载虚幻引擎提示错误代码MD-DL
- Qusestion--20190101-20190115
- 【秋招纪实录】一篇特别正经的【深信服】求职经验分享
- 已解决I tensorflow/stream_executor/cuda/cudart_stub.cc:29] Ignore above cudart dlerror if you do not ha
- Java、JSP校园二手商品交易平台的设计与实现