今天来分享下使用Axure制作拖动滑块解锁这个功能的方法，使用淘宝网的例子来还原制作过程。

如下图：

相信很多人对这个界面都不陌生，这是淘宝网的注册页面，除此之外目前很多网站都有用这种方式来进行验证，当然也有同一种方法不同的表现形式，比如拖动后完成拼图，以防止频繁的非正常请求，进行人机验证。

操作描述：

• 拖动滑块时，滑块水平左右运动，不可超出灰色边框；
• 拖动时，绿色的背景随滑块进行移动；
• 拖动达到最右端时，显示白色文字“加载中”，等待半秒钟后显示白色文字“通过验证”，并且「对勾」图标变为绿色，同时“获取短信验证码”按钮变为可用状态；
• 如果拖动并为达到最右端，滑块则回到初始位置。

01

根据该效果图准备以下元件，其他部分元件仿照淘宝注册页面调整就行，我这里就不逐个列出了。