Axure原型工具如何制作滑动验证的效果

 时间:2024-10-21 01:51:40

1、打开Axure原型工具,创建一个空白页面,在工作区域内拖入本次需要使用的元件元素,主要有标题、矩形、动态面板、热区以及按钮等,如下图所示。

Axure原型工具如何制作滑动验证的效果

2、然后对这些元件元素的样式以及描述等信息进行设置,如下图所示,类似一个手机验证滑动的效果,根据自己的情况去自定义。

Axure原型工具如何制作滑动验证的效果

3、样式调整完成后,需要对各个元件的名称进行设置,后面在进行交互事件的时候会通过名称知道每一个元件的位置及用处,如下图所示。

Axure原型工具如何制作滑动验证的效果

4、下面开始对滑动模块的移动时的交互事件进行设置,如下图所示。

Axure原型工具如何制作滑动验证的效果

5、然后再对滑动模块的拖动时的交互效果进行设置,如下图所示。

Axure原型工具如何制作滑动验证的效果

6、最后再对滑动模块的拖动结束时的交互效果进行设置,如下图所示。

Axure原型工具如何制作滑动验证的效果

7、上述的设置按照图片要求设置完成后,f5预览一下效果,如下图所示。

Axure原型工具如何制作滑动验证的效果

8、拖动滑动模块到中间位置时,会显示绿色,当拖动到最后时候,即表示验证成功了,如下图所示。

Axure原型工具如何制作滑动验证的效果
Axure原型工具如何制作滑动验证的效果
  • 4种方法防止高温天气油漆涂料变坏
  • 手指游戏:紫葡萄
  • 和平精英隐藏技巧
  • 吃太咸也会长斑?重口味正在毁掉你的肌肤!
  • 宝宝吃蓝莓的禁忌
  • 热门搜索
    走进名人手抄报 海洋的手抄报 有关古诗的手抄报 水是生命之源手抄报 三年级上英语手抄报 晒家风手抄报 安全教育手抄报大全 反对邪教手抄报图片 未来的学校手抄报 关于生活的手抄报