- 博客(7)
- 收藏
- 关注
原创 A-Frame 组件代码实现 —— draggable-by-ray:利用手柄射线拽取实体
监听 raycaster 指向事件:更新 raycaster 指向的对象实体。监听手柄 trigger 事件:根据手柄 trigger 事件激活拉取动作。判别是否存在选中的实体、是否按下 trigger。计算移动方向,移动距离,并移动到目标位置。
2024-03-27 18:00:09 801
原创 A-Frame 组件代码实现 —— thumbstick-moved:监听手柄摇杆事件
通过 this.el.addEventListener(eventName,function) 监听手柄的摇杆事件,并更新其他 Entity。代码实现a-box的xy轴position移动
2024-03-26 20:47:49 1124
原创 A-Frame 组件代码实现 —— trigger-changed 手柄Trigger触发事件
通过 this.el.addEventListener(eventName,function) 监听手柄的按钮事件,并更新其他 Entity。代码可以实现trigger键按下将方块的蓝色转变为红色
2024-03-26 20:20:46 273
原创 A-Frame架构 WebXR 虚拟现实开发:4、Introduction —— Interactions 和 Controllers
A-Frame提供的交互方式:gaze cursor模仿鼠标行为、HMD Controller等
2024-03-25 14:24:51 2015 1
原创 A-Frame架构 WebXR 虚拟现实开发:3、Introduction —— A-Frame 和 Three.js 关系
Three.js和A-Frame的层级关系和映射关系
2024-03-25 13:44:40 581
原创 A-Frame架构 WebXR 虚拟现实开发:2、Introduction —— JS, Events, DOM API
注册组件 registerComponent//注册log组件,打印当前tag的data值AFRAME"log"schematype"string"initfunctionvarthis;log;;// 注册foo组件,打印当前场景元素AFRAME"foo"initfunctionlogthis;;
2024-03-25 13:43:22 379
原创 A-Frame架构 WebXR 虚拟现实开发:1、Introduction —— Entity-Component-System
Entity 实体:类似 HTML 的,场景中组件的容器。是空的,不含任何对象,不做任何渲染Component 组件:场景中实体的属性,提供外观/行为/函数等,即插即用,可重用等System 系统:为组件类别提供全局管理和全局服务。
2024-03-25 13:40:49 352
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人