写在开头：
为了制作高质量的保真原型Demo，手机滑动解锁绝对是一个简单但是看上去又十分真实的设计点。
按照惯例，先上动画演示
开始原型设计
1、画出页面展示图
首先，需要打开Axure软件，并在画板上画出整体图形，包含三部分：屏幕背景、滑动范围框和滑动块。
我以我画的原型为例，屏幕背景375*667，滑动范围框375*100，滑动块65*45，以上都是px即像素单位。
2、创建交互用例
（1）滑动范围框
① 点击滑动范围框，然后右键选择转换为动态面板，并命名为fanwei。
② 双击进入fanwei的动态面板状态中，把滑动块也剪切放到合适的位置，并拖动选择滑动块的极限距离（左侧和右侧可水平移动的限制区域）
左侧28，右侧282（都为x值）
（2）滑动块
① 把滑动块放置在合适的左侧位置，转化为动态面板，并命名为huadong。
② 设置huadong的拖动时的用例为：
移动当前元件（huadong）水平移动、并添加边界
左侧>=左侧放置的位置 示例：左侧>=28
右侧<=[[右侧最多能到的位置+滑块的宽度]] 示例：右侧<=[[282+lvar1.width]]或者直接写[[282+65]]，其中65为滑块的宽度。
注意：右边的X值需要加上滑块的宽度width，因为左侧和右侧的边界范围可以理解为元件范围。
③ 设置huadong的拖动结束时的用例为：
case 1
条件：值 [[LVAR1.x]] （其中Fx为元件 滑动块） < 值 282 ，282为右侧最大的x值。
用例：移动huadong到绝对位置（28,28）、动画为线性500ms
case 2
条件：else if true （不用创建条件，默认为第一个如果没实现，执行这个）
用例：隐藏滑动范围框fanwei
3、设计用例概况
之后就可以点击F5进行浏览了。
该教程主要为拖动动态面板的水平移动用例的使用，以及拖动结束判断条件是否满足从而实现不同的结果。
至此，手机滑动解锁讲演结束，期待与您的交流沟通！
