Cult3d案例实战:制作网页交互笔记本电脑
来源:互联网
作者:未知
在这个案例中,我们使用Cult3d实现三维网页的制作,实现web3d的虚拟笔记本现实和交互,主要是实现以下功能:
1、模型的建立和输出
2、加入电脑盖子开合的交互事件
3、加入电池移动的交互事件
4、加入打开显示器的交互事件
5、加入播放声音的交互事件
6、加入热区提示(tooltip)
Cult3d主要运用于互连网上作三维产品的全方位交互展示。本练习通过给一个笔记本电脑模型加入交互事件,讲解Cult3d主要事件与action行为的使用方法。
1、模型的建立和输出
在3d studio MAX中建立了如下模型。
模型分为单独的几个部分:
机身、盖子、电源开关、按钮1、按钮2、电池、屏幕1、屏幕2。屏幕2具有电脑桌面贴图。通过显示、隐藏该对象表现出开机和关机屏幕状态。
因为要设置盖子的旋转,调整局部坐标轴到旋转的轴心位置(如图)。
→链接屏幕1、屏幕2到盖子上成为盖子的子物体。
→将所有物体成组,命名为“笔记本电脑”。
→输出为C3D文件。
2、加入电脑盖子开合的交互事件
→打开Cult3D Designer。
→从File-->add Cult3D Designer file导入建立的C3D文件。
在Scene Graph窗口显示场景的各对象与层级结构。render窗口显示了模型的形状。
现在让我们为该场景加入交互事件
a.拖动鼠标旋转物体
→加入一个WorldStart事件于Event Map上。
→从Actions窗口拖动Arcball行为到WorldStart事件上。
→从Scene Gragh窗口拖动笔记本电脑对象到Arcball行为上。
Event Map如图所示
此时在render窗口中就可以拖动鼠标进行旋转物体操作了
b.关闭盖子
→加入一个Left Mouse click on object事件于Event Map上。
→从Actions窗口拖动Rotation XYZ行为到ObjectLClick_1事件上。
→拖动盖子对象于Rotation XYZ行为上。
→拖动盖子对象于ObjectLClick_1事件上。
→双击Rotation XYZ行为,键入在X轴旋转90(度),时间1000(毫秒)。
Event Map如图所示
在render窗口运行。
点击盖子对象,盖子自动旋转90度合上。这时如果再次点击盖子,盖子会接着再次旋转穿过机身。所以现在必须使点击盖子的事件不可用。
c.使用Deactivate event行为使点击盖子旋转事件不可用
→从Actions窗口拖动Deactivate event行为到ObjectLClick_1事件上。
→右击Deactivate event行为选择Parameters打开选择事件窗口。
→在左方列表点选ObjectLClick_1事件,点击Add,再点击OK。
Event Map如图所示
再次运行。点击盖子,盖子旋转一次后就不再接受点击事件。
d.打开盖子
这次要使关闭盖子后,再次点击打开。
→加入一个Left Mouse click on object事件于Event Map上。
→从Actions窗口拖动Rotation XYZ行为到ObjectLClick_2事件上。
→拖动盖子对象于Rotation XYZ行为上。
→双击Rotation XYZ行为,键入在X轴旋转-90(度),时间1000(毫秒)。
此时运行发现点击盖子并不能使之转动,因为两个事件相冲突。我们要使ObjectLClick_2事件在一开始时不可用,盖子关闭后才可用。
→右击ObjectLClick_2事件图标将Intial Activation(初始可用)去掉。
→从Actions窗口拖动Activate event行为到ObjectLClick_1事件上。
→拖动ObjectLClick_2事件到刚才的Activate event行为上。
Event Map如图所示
这回运行发现,盖子合上之后点击再打开,但是再点击盖子仍然向后继续旋转。我们要使盖子打开后再点击关上。
e.循环开合盖子
→拖动一个Deactivate event行为到ObjectLClick_2事件上。
→右击Deactivate event行为选择Parameters打开选择事件窗口。
→在左方列表点选ObjectLClick_2事件,点击Add,再点击OK。
→拖动一个Activate event行为到ObjectLClick_2事件上。
→拖动ObjectLClick_1事件到ObjectLClick_2事件上。
Event Map如图所示
完成、运行、测试。