通过IDE开发工具修改AR素材(修改模型颜色、纹理或制作一段动画)、发布上传到华为3D内容平台、使用手机端的AR Player把修改过的AR素材放置到实景中,体验AR素材开发、分享和应用的整体流程;

什么是华为AR应用 IDE开发工具?

华为AR应用 IDE开发工具增强现实互动内容开发工具平台,通过使用IDE工具,没有编写代码能力的普通人,无需编写任何代码,仅仅使用鼠标拖拽,设置属性等操作,就可以快速开发出具有互动功能的增强现实应用内容。

华为AR应用 IDE开发工具开发的增强现实互动内容,可以保存在华为Vector平台上,也可以发布到华为手机端,使用AR Player来播放和使用。

什么是华为AR 3D内容平台?

华为终端打造的华为3D内容平台,致力于打造成为全领域素材聚合分发服务平台,快速连接素材与开发者,为开发者搭建一个素材交流的桥梁,从而构建华为AR/VR等领域下的极致内容体验。更多详细信息以及平台使用细节,请参考:华为3D素材平台介绍

接入华为3D内容平台,您将获得:

在手机中运行的AR互动内容。比如,在IDE开发工具中可以建立一个卡通人物互动场景,小动物们在花园里蹦蹦跳跳,点击哪个小动物,哪个小动物就说出自己的名字。还可以使用华为手机,将这样的互动场景虚拟摆放在桌面或地面上。

通过华为3D 内容平台,您将可以获得免费分享的精美素材,或者将您的素材共享以供开发者使用。同时,接入平台的素材,还可以通过华为提供的WEB IDE能力在线编辑,开发动画等内容,然后在手机侧通过AR APP查看素材的虚实结合效果。

硬件要求

开发计算机
一个AREngine支持的设备,通过USB连接到PC,保证后置摄像头工作正常。

软件要求

Chrome、Microsoft Edge浏览器

https://developer.huawei.com/consumer/vector/

打开Web IDE开发工具网站程序

添加灯光

单击灯光组件展开灯光列表,可依次列出"点光源"、"聚光灯"、"平行光"、"半球光"、"环境光"等光源。选择平行光,将光源拖拽至合适的角度位置

制作动画

Step 1

点击Vector平台右上方"场景开发"按钮,进入WEB IDE页面。点击展开素材库,选择想要编辑的模型,单击添加到场景中

Step2

单击左侧场景树中的"动画列表"选项

Step3

单击右侧动画组列表中的加号,展开动画制作窗格

Step4

在时间轴上点击"+"添加动画,选择要添加动画的节点。

单击"+",选择"waike222"作为要添加动画的节点

Step5

拖动时间轴,选择动画结束的时间点,这里设置为1s

Step6

拖拽Step4中选中的节点到任意位置,再点击"添加帧"按钮

添加动画帧。

Step7

点击保存按钮,输入动画名称,保存制作好的动画

点击动画列表可查看制作好的动画

全场景构建

Step1

点击展开天空盒列表,设置恰当的天空盒

Step2

点击几何体列表,添加"地面"至场景中,并将地板摆放至恰当位置

Step3

右侧属性面板可以修改几何体材质贴图等属性。这里将地面颜色修改为水泥色

Step4

从素材库中导入"悠悠"模型(人物角色分类)与"瓶子"模型(文化艺术分类),并拖拽至合适位置

Step5

点击展开相机列表,添加透视相机,并将相机拖拽至恰当位置

Step6

制作相机位移动画,保存至动画列表。具体流程可参考动画制作指引

Step7

点击打开灯光列表,适当添加光源

Step8

点击展开2D控件列表,添加按钮

Step9

点击"+"绑定动画播放事件,修改按钮名称

Step10

依次添加相机动画、悠悠踢腿动画与瓶盖飞起动画,设置后两个动画延迟1秒后播放,交互类型选择整体播放

点击左侧下拉框可选择预览模式;点击"眼睛"图标进入预览模式

点击按钮播放动画

点击右上方图标可保存场景

干得好,你已经成功完成了codelab并学到了:

已复制代码