cocos creator在3D场景中的屏幕点击问题

最新推荐文章于 2024-08-28 15:54:33 发布
最新推荐文章于 2024-08-28 15:54:33 发布
阅读量256 收藏
点赞数 1
文章标签： 3d
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_52381274/article/details/140333153
版权

注意事项：

1.屏幕点击的位置坐标为世界坐标，左下角为（0,0）

2.竖屏游戏中，屏幕横纵轴的实际设计分辨率等于 游戏窗口实际分辨率 x 游戏横纵轴缩放比（发现横纵轴比相同）

1.遇到的问题

1.计算在2D屏幕中的点击位置转换成3D场景中某个节点上的坐标转换

第一步先获取视图窗口的大小乘以横轴缩放比拿到整个屏幕的宽度

第二步将屏幕宽度除以2拿到一半屏幕的大小

第三步用获取到的2D屏幕中的位置坐标减去一半屏幕的大小再除以一半屏幕的大小拿到2D坐标相对半个屏幕的比例并且同时计算出在目标节点上的左边还是右边以及相应的比例在乘以该节点一半的横轴大小得出2D转换成3D坐标中的横轴坐标

公式：

计算半个屏幕大小公式：const haftW = view.getVisibleSize().x * view.getScaleX() * 0.5

计算转换后坐标：(touchPoint.x - haftW) * 3.4/haftW

qq_52381274
关注
【cocos creator】2.4.x实现简单3d功能，点击选中，旋转，材质修改，透明材质
烧仙草奶茶的博客
07-09 460
【代码】【cocos creator】2.4.x实现简单3d功能，点击选中，旋转，材质修改，透明材质。
cocos creator 3D学习（五）射线---点击按钮
judykang123的博客
09-03 1459
目录前言步骤在import里引入geometry定义一个射线在onload里面使用射线射线的函数最后 前言 在cocos creator 3D里，canvas的优先级在3D图层之前，那我们需要点击3D模型的某一处时，就要用到射线了 步骤 在import里引入geometry import { _decorator, Component, Node, Vec3, SkeletalAnimationComponent, macro,ColliderComponent,RigidBodyComponent,Aud
【Cocos Creator深度探索】打造极致游戏体验：Camera的妙用与实战技巧
最新发布
阿拉丁Mr的博客
08-28 2029
Cocos Creator支持通过编写自定义的Effect（着色器）来实现相机的后处理效果，如色彩校正、景深模糊、HDR等。通过将这些Effect附加到Camera节点上，可以轻松地给游戏画面添加丰富的视觉效果。// 假设已经创建了一个名为CustomPostEffect的自定义后处理着色器// 获取第一个后处理效果组件// 检查是否为自定义后处理效果// 可以根据需要调整效果的参数通过本文的介绍，我们深入了解了Cocos Creator中Camera的妙用与实战技巧。
Cocos Creator实战-使用帧动画实现点击屏幕效果
酷玩时刻-By Javen
02-10 3324
涉及到的知识点 帧动画制作 触摸事件监听以及坐标转化 预制资源制作 对象池的使用 动态显示特效 帧动画制作 资源预览 5张72x72的序列帧图片-下载地址 1、新建节点ClickAnim 2、将第一帧的图片拖拽至ClickAnim节点下并重名为item 3、设置item节点的宽高为72x72 4、取消Trim的勾选 5、在ClickAnim节点上添加Animation组件 6、打开...
Cocos Creator 3D游戏成像全过程详解与Shader详解
Thomas_YXQ的博客
04-16 793
Cocos Creator是一款由Cocos2d-x团队开发的游戏开发引擎，它不仅支持2D游戏的开发，还能够创建3D游戏。在本文中，我们将详细介绍Cocos Creator 3D游戏成像的全过程，并深入探讨Shader的实现细节。对惹，这里有一个游戏开发交流小组，大家可以点击进来一起交流一下开发经验呀！一、Cocos Creator 3D游戏成像全过程详解创建场景：在Cocos Creator中，我们首先需要创建一个场景来放置游戏中的各种元素，如角色、道具、背景等。可以通过拖拽资源或代码创建节点来构建场景。
022 - cocos creator 3D
qq_30856231的博客
06-02 3816
#cocos creator 3D 001 初识creator3D 光、摄像机 双击目录–定位到物体 右键旋转 ALT+鼠标左键 旋转物体 x轴【红色】,y轴【绿色】,z轴【蓝色】 3D组件 预览 游戏发布简介 3D坐标系 右手坐标系、左手坐标系 物体： 前方： -z 右边： +x 上面： +y 创建3D物体 plane: 平面：10*10 002 创建一个项目与组件化开发 准备： （1）做3D建模（3DMax,Zbrush,Maya）,模型原点，模型坐标系。 （2）放入3D世界中
cocoscreator 模拟点击
随风的博客
04-24 1792
在制作新手引导或者自动化测试时，有了模拟点击真的方便不少，虽然cocos官方没有提供，但是查看源码还是支持的，这篇文章是转载自：https://forum.cocos.org/t/topic/83221 https://github.com/ShawnZhang2015/GodGuide/blob/01b5041c255e0ea8dc5cb34ee63f4a4e4c3b344b/assets/Go...
CocosCreator_v2.2安装包
03-21
- **项目创建**：在Cocos Creator中，用户可以选择不同的模板来创建项目，如2D游戏或3D游戏，每个模板都预设了相应的场景、资源和配置。 - **资源管理**：通过内置的资源管理器，开发者可以导入、导出、组织和预览...
Cocos Creator 3D初体验
云飞扬的博客
10-22 4391
同步发布在Cocos论坛 Cocos Creator 3D初体验 官方文档 https://docs.cocos.com/creator3d/manual/zh/ 下载 https://www.cocos.com/creator3d 目前个人使用的版本是v1.1.1，官方已发布v1.2版本 整体的使用感受 UI界面的制作一如既往的便捷高效 对Cocos Creator 2D上手很友好 有自己的3D编辑器 材质系统非常的灵活 当前版本对2D游戏的支持不够完善 目前不太完善的地方 2D方面 不支
CocosCreator Shader Editor 编辑器
11-19
CocosCreator是一款强大的2D和3D游戏开发引擎，它为开发者提供了丰富的工具集，包括一个集成的Shader编辑器。这个Shader编辑器是CocosCreator中的一个重要组成部分，它允许开发者自定义图形渲染效果，创造出独特且...
cocoscreator黑边处理.zip
08-05
"cocoscreator黑边处理.zip"这个压缩包文件很可能包含了解决Cocos Creator游戏黑边问题的一些解决方案和教程。下面将详细讨论如何在Cocos Creator中处理黑边问题。 Cocos Creator是一个基于JavaScript的2D和3D游戏...
Cocos Creator 3D开发入门----CocosCreator3D篮球.zip
12-13
Cocos Creator 3D开发入门----CocosCreator3D篮球.zip import { _decorator, Component, Node, RigidBodyComponent, PhysicMaterial, ColliderComponent } from "cc"; const { ccclass, property } = _decorator; @ccclass("PhyMat") export class PhyMat extends Component { @property private friction: number = 0; // 摩擦力 @property private restitution: number = 0; // 弹力 /* class member could be defined like this */ // dummy = ''; /* use `property` decorator if your want the member to be serializable */ // @property // serializableDummy = 0; onLoad(): void{ let comps: Array = this.node.getComponents(ColliderComponent) as Array; let mat = new PhysicMaterial(); mat.friction = this.friction; mat.restitution = this.restitution; for(let i = 0; i < comps.length; i++){ comps[i].material = mat; } } start () { // Your initialization goes here. } // update (deltaTime: number) { // // Your update function goes here. // } }
体育类游戏，3D 足球射门 ，Cocos Creator 3D 实现，附源码Creator3D_football.zip
12-13
体育类游戏，3D 足球射门 ，Cocos Creator 3D 实现，附源码Creator3D_football.zip import { _decorator, Component, Node,ColliderComponent,PhysicMaterial } from "cc"; const { ccclass, property } = _decorator; @ccclass("PhyMat") export class PhyMat extends Component { @property private friction: number = 0; // 摩擦力 @property private restitution: number = 0; // 弹力 onLoad():void{ let comps: Array = this.node.getComponents(ColliderComponent) as Array; let mat = new PhysicMaterial(); mat.friction = this.friction; mat.restitution = this.restitution; for(let i = 0; i < comps.length; i++){ comps[i].material = mat; } } start () { // Your initialization goes here. } // update (deltaTime: number) { // // Your update function goes here. // } }
CocosCreator3D小项目躲避方块
02-06
使用CocosCreator最新版本v2.1.0进行开发的Demo。适用于初学者进行学习研究。里面使用了两个fbx模型，一个球，一个方块。
Cocos Creator 平面魔方源码
07-04
- Cocos Creator提供内置的调试工具，帮助开发者在开发过程中找出和修复问题。 - 发布时，可以将游戏导出为多种平台，如iOS、Android、Web等。 10. **源码分析**： - 文章链接提供的源码详解，将详细介绍每个...
Cocos Creator 3.x 3D点击事件 - 射线检测
qq_14965517的博客
05-27 2697
知识点 射线检测是什么？ 射线检测是非常重要的功能，常常用来判断各种情况。其本质是对一条射线和另一个形状进行 相交性判断，如下图所示。 射线检测怎么使用？ 构造射线 首先 引入 geometry 模块， import { geometry } from 'cc'; 然后 设置起点和方向，常见方法 一、通过 起点 + 方向，ray 的构造函数或静态接口 create import { geometry } from 'cc'; const { ray } = geometry; // 构造一条从（0
cocos 制作微信箫游戏_Cocos Creator如何制作3D微信小游戏
weixin_33729662的博客
01-04 228
Cocos Creator推出了3D编辑器，集成到了2.1以后的版本，今天我们来看下如何来使用 Cocos creator2.1做3D。 1: 可以2D/3D来回切换的场景编辑器: 点击按钮，可以进入3D编辑器模式，再点击一下有回到2D编辑模式。2: 3D游戏中的2D元素:2D元素我们放到Canvas下面，然后我们新建一个分组UI，所有的2D物体(一般是UI)我们都分来的UI分组下，MainCam...
CocosCreator中的键盘和屏幕触摸事件
Cco丶
06-21 4158
1. 通过键盘ADWS 控制物体的八方向移动 export default class TestMove extends cc.Component { //274,410(边界) isLeft:boolean; isRight:boolean; isForward:boolean; isBehind:boolean; moveS...
cocos creator---事件
赳赳万里鲲
02-03 601
1、自定义事件（JS） a、创建客户端自定义事件： let oper = new cc.Event.EventCustom(事件名,true); b、向节点分发事件： this.node.dispatchEvent(oper); c、和后端通信： socket为SocketIO的使用方法。 socket.o
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值