怎么创建自己公司的网站,前端网站制作教程,网络购物系统,海外推广服务Mozilla创建并开源了A-Frame#xff0c;这是一个用于在桌面浏览器、智能手机和Oculus Rift上创建VR场景的框架。\\A-Frame是一个在浏览器中创建VR体验的开源框架。该框架由Mozilla的MozVR团队创建和开发。A-Frame使用了一个在游戏开发中经常使用的“实体-组件#xff08;Enti…Mozilla创建并开源了A-Frame这是一个用于在桌面浏览器、智能手机和Oculus Rift上创建VR场景的框架。\\A-Frame是一个在浏览器中创建VR体验的开源框架。该框架由Mozilla的MozVR团队创建和开发。A-Frame使用了一个在游戏开发中经常使用的“实体-组件Entity-component”系统其中实体是放置在场景中的对象而组件是与那些实体相关的属性。实体使用HTML标签定义而组件则基于一种类似CSS语法的HTML属性。实体需要置入一个场景其中包含了VR中需要渲染的一切内容。\\下面的示例代码描绘了一个边长为1米的红盒子实体立方体\\\u0026lt;a-scene\u0026gt;\ \u0026lt;a-entity geometry\primitive: box; width: 1\ material\color: red\\u0026gt;\u0026lt;/a-entity\u0026gt;\\u0026lt;/a-scene\u0026gt;\\目前geometry组件支持下列primitivebox、circle、cylinder、plane、ring、sphere、torus、torusKnot。其他组件包括camera、light、sound、fog、material、scale等等。实体可以关联多个组件创建更复杂的场景像下面的示例代码这样\\\u0026lt;a-entity geometry\primitive: cube; depth: 1; height: 1; width: 1\\ material\color: pink\\ light\intensity: 2\\ position\-1 5 0\\ sound\src: dangerzone.mp3; volume: 2\\u0026gt;\\u0026lt;/a-entity\u0026gt;\\为了简化开发人员的工作Mozilla封装了一些实体-组件元素创建了若干语法更简单易用的原语。如下所示这行代码描绘了与上文相同的正方体\\\u0026lt;a-cube width\1\ color\red\\u0026gt;\u0026lt;/a-cube\u0026gt;\\预定义的原语包括a-camera、a-cylinder、a-plane、a-sphere、a-light、a-sky、a-image、a-video等等。a-model让开发人员可以在场景中加载OBJ或DAE 3D模型资产。\\动画是虚拟现实渲染的重要组成部分。A-Frame内部使用基于Web动画规范的tween.js。下面的这段代码实现了一个男人的旋转模型\\\u0026lt;a-entity id\model\ position\0 0 -2\\u0026gt;\ \u0026lt;a-animation attribute\rotation\ from\0 -30 0\ to\0 330 0\ dur\15000\ easing\linear\ repeat\inifite\\u0026gt;\u0026lt;/a-animation\u0026gt;\ \u0026lt;a-model position\-.35 0 .55\ rotation\0 -20 0\ scale\1.5 1.5 1.5\ src../_models/man/man.dae\u0026gt;\u0026lt;/a-model\u0026gt;\\u0026lt;/a-entity\u0026gt;\\A-Frame可以用于主流的桌面浏览器中场景受鼠标或键盘控制也可以用于智能手机和Oculus Rift头戴设备上。有个问题是某些特定的场景在部分Android设备上不能正常渲染但这个问题很快就会被修复。Mozilla创建了若干展示这项技术的演示程序。感兴趣的读者可以从GitHub上下载A-Frame的源代码。\\查看英文原文Mozilla Has Created A-Frame, a VR Framework