如何使用图片事件(拖拽)制作滑屏解锁
发表时间: 2020-09-08 15:49:52 阶段:高级 分类:实例应用
1. 教程目标
使用高级剧情中的图片事件(拖拽)来制作手机滑动解锁的动效。

2. 素材准备


3. 具体步骤
(1)添加剧情,鼠标右键选择插入高级剧情,双击进入高级剧情。


(2)将先前准备的【背景图】、【黑屏的手机】添加到画面中


点击显示文本,鼠标移动至文本框右键,选择隐藏模式,隐藏对话框。




再添加先前准备的【解锁界面】和【解锁滑块】


完成(2)步骤的效果图如下


(3)接下来给需要移动的图片赋值
点击数值,初始数值。


设置解锁滑块的X和Y的初始值,点击确定。


(4)选中【解锁滑块.png】这一行,点击逻辑指令-数值操作,把【解锁滑块】的X轴和Y轴的数值,添加上对应的初始值,点击确定。






# 如何知道【解锁滑块】的X轴和Y轴该填入哪些数值呢。
双击【解锁滑块.png】道具界面显示的X轴和Y轴就是他的数值。


完成(3)(4)之后,设置截图如下


(5)然后需要确定【解锁滑块】可移动范围X轴的最大值和最小值
范例中,按钮只能在红色框中移动,所以参考(4)步双击素材填写坐标数值的方法,X轴的最大值和最小值分别为543和322。


(6)点击图像指令-图片事件。


(7)点击添加图片动作,在动作1里选择【解锁滑块.png】,素材事件里选择拖拽。


在素材坐标赋值中,选择步骤(3)设置的X轴和Y轴数值。


把步骤(5)确定的X轴最大值和最小值填入X轴范围中,点击确定。


(8)为了避免【解锁滑块】还没有划到指定位置就解锁了,所以需要在图片事件分支列表中添加条件分支

选中图片事件分支列表,解锁滑块。


点击逻辑指令-条件分支。


点击添加分支。在分支1中添加条件,选择【普通数值】-【1:解锁滑块X轴】-【大于等于】-【固定值】-【543】(这里的数值填的是前面设置【解锁滑块】的最大值),即解锁滑块X轴≥543,点击确定。


完成(8)之后,设置截图如下


(9)在图片事件分支列表中,选择达到最大值的分支


添加先前准备的手机界面,就完成了


(10)当图片事件完成时,我们可以移除这个事件,避免后续剧情误触发。

选择图片事件分支列表后面的任意位置(需要移除【图片事件】的位置)


点击图像指令-移除事件


在移除事件中,点击需要移除的图片事件,点击确定就完成了。


4. 整体设置如图


5. 最终效果
TOP