Ventuz教程学习笔记动手实践之简单逻辑动画制作

一.设计结果展示

用Ventuz制作逻辑动画打算达到的效果，见下图。

设计五个圆圈，一个圆球，鼠标点击相应的圆圈，圆球会移动到你点击的圆圈中，中间圆圈中有逻辑数字，每点击一次数字就加1。

二.从零开始

1.新建一个场景，选择Scene-New新建一个空白场景，然后选中Edit selected layer content,进行场景编辑。

2.先新建五个圆圈和一个圆球，圆球先放在中间圆圈处。

View——>Toolbox先调出工具箱，然后点击World选项，鼠标选择Axis，将其拖到Hierarchy中去。选择Geometry,将Circle拖到Axis的后面。如图示：

鼠标选中Axis，然后在最右端的Properties中跳转ScalingFactor属性，可直接修改其值，也可以点击鼠标左右拖动改变其值，在修改过程中我们会发现Renderer中显示的圆球的大小随之变化。

选中Axis后的Circle1，调整ProPerties--Inputs下的Size--Hole属性，将其设为0.9，则圆球就变成了圆圈。那你应该知道这个属性是干什么的了。至此，第一个圆圈制作完毕。

接下来，在Hierarchy选中Axis，然后Crtl+C 复制这个圆圈，然后执行4次Crtl+V黏贴，则可生成5个圆圈，只不过现在这五个圆圈都是重叠在一起的。我们通过调整每个Circle1前面的Axis的坐标来将后面的四个圆圈分布到四周。具体做法是选择第二个Axis，修改ProPerties中Position位置属性中的X、Y，将其分别设置为X= -16，Y=8，则第二个圆球就到了左上角。效果见图：

同理，修改第三个Axis的X=-16，Y=-8，第四个的Axis的X=16，Y=8，第五个的X=16，Y=-8。至此，将五个圆圈分布开了。

接着，跟之前一样选择World中的Axis拖到第五个axis下，然后在Geometry中拖一个Circle到此Axis下，调整此Axis的ScalingFactor属性，将其设置为3。

至此五个圆圈和一个圆球制作完毕。

3.制作点击圆圈，圆球跟着走的动画效果。点击效果需要选择ToolBox中的Interaction中的Touch Button，将其拖动到前面五个圆圈Circle1的前面，如图示，将五个圆圈前都加上Touch Button。

选择圆球前面的Axis中，选择ToolBox中的Animation中的Keyframe Animation，拖动到Content中，然后点击Hierarchy中的圆球前面的Axis,在右边ProPerties中的Position下，鼠标点击拖动Position下的X拖动到Content中的Animation1上，同理将Y也拖动上去，此时将动画跟圆球的坐标关联了起来，鼠标移动到连接线上可以看到关联情况。如下图所示

选中Content的Animation1，然后关闭ToolBox界面，则出现Animation-LogicView界面，在此界面的左上角，点击Create status控件（鼠标移上去会显示控件名），创建动画状态。因为有五个圆圈，所以创建五个状态。如图示

鼠标点击autoConnect status控件，然后选择第二三项，点击OK，创建状态动画链接。

结果状态：

双击每个圆圈前的Touch Botton按钮，为每个Touch Botton按钮命名，依次命名为1/2/3/4/5。按住Shit，一次点击圆圈前的Touch Botton,将其在Content界面中与Animation1一起显示出来。如图所示

选中Animation1,然后再Properties中将Animate中，拖动S1到Touch Button1上，然后选择sigleTap。依次将S2连接2，S3连接3，S4连接4，S5连接5。

在Animation1-LogicView界面，依次点击下面的状态S2,S3，S4 ,S5，修改其Position的XY的值分别为（-16,8）（-16，-8）（16,8）（16，-8）。如图示。

修改完毕后，点击Renderer中的圆圈，圆球会跟着移动。

4.中间圆圈添加数字逻辑，达到每点击一次就增加1的效果。

首先通过工具箱增加文字控件。在world中拖Axis到圆圈下面，然后再Text中将Text 2D拖到此Axis后面。选择Block Text。如图所示：

此时展示的文字内容是BlockText。思路：我们要将文字变成数字，且每点击一次增加1。这功能需要通过函数来控制，初始化一个参数为0，然后每点击一次，让它改变一次，增加1。然后将这个函数的输出值跟文字展示的值做关联。具体做法是，先在Logic中选择Script拖拽到Content中，选择C#.net Script，在打开的Script Editor编辑器中选中Inouts，然后选择后面的+后的下拉，双击选择最后的Method，新增一个方法。

同理，选择Outputs，然后选择+ 后的下拉，双击选择String, 输出String作为后面要显示的数字。

接下来，编辑刚刚增加的method方法。先设置一个int 参数初始化为0.然后在新增方法中把它++。

 // This Method is called if the function/method Method1 is invoked by the user or a bound event.// Return true, if this component has to be revalidated!int a = 0;public bool OnMethod1(int arg){a++;String1 = a.ToString();changed = true;return false;}

然后点击关闭，提示保存，保存后退出。接着需要在Content中关联这些东东。

在Content中选择Aa，在Properties中选择Inputs，然后拖拽【Text】中的Text到Script上，就将Script的输出关联到文字的输入了。

选中Script，按住Shit点击圆圈前面的Touch Button,将他们展现在Content面板上，然后拖拽Script的Properties下的Inputs下的Method1分别到Touch Button上，选择singleTap。如图示

现在点击的时候就已经能看到效果了。数字不是正在圆圈中，你可以通过调节数字前面的axis的坐标，将数字放在正中间。

至此。我们想完成的功能完成了。写个博客，好麻烦啊，还有几个小例子，不想写了。。。。

上述的工具箱拖拽都可以通过直接点击空格，然后输入或选择相应控件实现。