今天要做的是设计一个移动端的选择器功能，由于产品的独特性（量大），所以在寻找指定产品时移动加载用户体验较差，很难找到自己想要的产品，所以我们计划设计一个下拉选择器来提高用户的体验，这是一个用来选择产品的下拉功能，如图。
现在我们开始用Axure制作我们的移动选择器了，先做个简单的模型，鼠标拖动即可移动实现数据的移动，如下图所示，在数字处拖动即可实现数字移动：
既然是动态显示，这里我们必然要用到动态面板了，新建一个动态面板，用来显示我们的固定显示区域（这时我们能看到的区域）。
进入到动态面板中，我们将动态面板划分成三个区域，上下区域为过渡区域（设置透明度，区分数据），中间为显示区域。接着我们再创建2个动态面板，一个是用来拖动的，另一个是用来存放数据的，下面是模板结构。
这里主要的事件操作都在show这个动态面板中完成，拖动show面板时要显示数据，所以data面板要跟随show移动，所以show这里我们要设置一个跟随事件。
接着我们来处理拖动事件，首先我们要做的是将移动的动作选定，这里我们拖动时是垂直拖动，所以我们给show添加一个移动时间，移动方式为垂直移动。
我们需要对移动进行以下几两种情况进行判断，当show的顶部位置大于顶部遮挡的高度时，说明数据还在下面这时就可以每次移动顶部遮挡的高度（这里最好将分割的三处和数据显示栏的高度设置一致，这样移动时就可以避免跑偏）。
当show的底部位置大于mokuai和底部遮挡的位置时，移动显示区域的高度，这样每次都以指定的高度进行移动，当你移动位置不够时会退回原来的位置，移动过多时会回到准确的位置上，这时你会发现移动的位置基本都是一致的。
到了这里，功能基本实现了，但是还有个问题，那就是show和data的高度不一样，当我们拖动到点击show底部时，data多出来的位置无法进行拖动，所以这里我们需要再添加一个载入事件，在载入时将show的宽高设置成data的宽高。
“fx”进入编辑文本窗口，而后点击“Insert Variable or Function”按钮，里面有很多函数可以使用，下面是一些常用的函数：
| 函数名称 |
函数说明 |
| x |
获得部件的X坐标 |
| y |
获得部件的X坐标 |
| This |
获得当前部件 |
| width |
获得部件的宽度 |
| height |
获得部件的高度 |
| scrollX |
动态面板部件在X轴滚动的距离，单位：px |
| scrollY |
动态面板部件在Y轴滚动的距离，单位：px |
| text |
部件的文本值 |
| name |
部件的名称 |
| top |
获得部件的Y坐标，即顶部Y坐标的值 |
| left |
获得部件的X坐标，即左侧X坐标的值 |
| right |
获得部件右侧的X坐标，right-left=部件的宽度 |
| bottom |
获得部件底部的Y坐标，bottom-top=部件的高度 |
| Repeater |
获得当前项的父中继器 |
| visibleItemCount |
返回当前页面中所有可见项的数量 |
| itemCount |
当前过滤器中项的数量 |
| dataCount |
当前过滤器中所有项的个数 |
| pageCount |
中继器对象中页的数量 |
| pageindex |
中继器对象当前的页数 |
| Window.width |
窗口的宽度 |
| Window.height |
窗口的高度 |
| Window.scrollX |
窗口在X轴滚动的距离 |
| Window.scrollY |
窗口在Y轴滚动的距离 |
| Cursor.x |
鼠标指针所在的x坐标 |
| Cursor.y |
鼠标指针所在的y坐标 |
| DragX |
本次拖动事件部件延x轴拖动的距离 |
| DragY |
本次拖动事件部件延y轴拖动的距离 |
| TotalDragX |
部件延x轴拖动的总距离（在一次OnDragStart和OnDragDrop函数之间） |
| TotalDragY |
部件延y轴拖动的总距离（在一次OnDragStart和OnDragDrop函数之间） |
| DragTime |
部件拖动的总时间 |
| + |
加，返回前后两个数的和 |
| - |
减，返回前后两个数的差 |
| * |
乘，返回前后两个数的乘积 |
| / |
除，返回前后两个数的商 |
| % |
余，返回前后两个数的余数 |
| abs(x) |
返回x的绝对值 |
| acos(x) |
返回x的反余弦值 |
| asin(x) |
返回x的反正弦值 |
| atan(x) |
返回x的反正切值 |
| atan2(y,x) |
返回从x轴到(x,y)的角度 |
| ceil(x) |
对x进行上舍入操作 |
| cos(x) |
返回x的余弦值 |
| exp(x) |
返回x的e指数值 |
| floor(x) |
对x进行下舍入操作 |
| log(x) |
返回x的自然对数 |
| max(x,y) |
返回x和y两个数的最大值 |
| min(x,y) |
返回x和y两个数的最小值 |
| pow(x,y) |
返回x的y次幂 |
| random() |
返回0到1的随机数 |
| sin(x) |
返回x的正弦值 |
| sqrt(x) |
返回x的平方根 |
| tan(x) |
返回x的正切值 |
| Now |
返回计算机系统当前设定的日期和时间值 |
| GenDate |
获得生成Axure原型的日期和时间值 |
| getDate() |
返回Date对象属于哪一天的值，可取值1-31 |
| getDay() |
返回Date对象为一周中的哪一天，可取值0～6，周日的值为0 |
| getDayOfWeek() |
返回Date对象为一周中的哪一天，表示为该天的英文表示，如周六表示为“Saturday” |
| getFullYear() |
获得日期对象的4位年份值，如2015 |
| getHours() |
获得日期对象的小时值，可取值0～23 |
| getMilliseconds() |
获得日期对象的毫秒值 |
| getMinutes() |
获得日期对象的分钟值，可取值0～59 |
| getMonth() |
获得日期对象的月份值 |
| getMonthName() |
获得日期对象的月份的名称，根据当前系统时间关联区域的不同，会显示不同的名称 |
| getSeconds() |
获得日期对象的秒值，可取值0～59 |
| getTime() |
获得1970年1月1日迄今为止的毫秒数 |
| getTimezoneOffset() |
返回本地时间与格林威治标准时间(GMT)的分钟值 |
| getUTCDate() |
根据世界标准时间，返回Date对象属于哪一天的值，可取值1-31 |
| getUTCDay() |
根据世界标准时间，返回Date对象为一周中的哪一天，可取值0～6，周日的值为0 |
| getUTCFullYear() |
根据世界标准时间，获得日期对象的4位年份值，如2015 |
| getUTCHours() |
根据世界标准时间，获得日期对象的小时值，可取值0～23 |
| getUTCMilliseconds() |
根据世界标准时间，获得日期对象的毫秒值 |
| getUTCMinutes() |
根据世界标准时间，获得日期对象的分钟值，可取值0～59 |
| getUTCMonth() |
根据世界标准时间，获得日期对象的月份值 |
| getUTCSeconds() |
根据世界标准时间，获得日期对象的秒值，可取值0～59 |
| parse(datestring) |
格式化日期，返回日期字符串相对1970年1月1日的毫秒数 |
| toDateString() |
将Date对象转换为字符串 |
| toISOString() |
返回ISO格式的日期 |
| toJSON() |
将日期对象进行JSON（JavaScript Object Notation）序列化 |
| toLocaleDateString() |
根据本地日期格式，将Date对象转换为日期字符串 |
| toLocaleTimeString() |
根据本地时间格式，将Date对象转换为时间字符串 |
| toLocaleString() |
根据本地日期时间格式，将Date对象转换为日期时间字符串 |
| toTimeString() |
将日期对象的时间部分转换为字符串 |
| toUTCString() |
根据世界标准时间，将Date对象转换为字符串 |
| UTC(year,month,day,hour, minutes sec, millisec) |
生成指定年、月、日、小时、分钟、秒和毫秒的世界标准时间对象，返回该时间相对1970年1月1日的毫秒数 |
| valueOf() |
返回Date对象的原始值 |
| addYears(years) |
将某个Date对象加上若干年份值，生成一个新的Date对象 |
| addMonths(months) |
将某个Date对象加上若干月值，生成一个新的Date对象 |
| addDays(days) |
将某个Date对象加上若干天数，生成一个新的Date对象 |
| addHous(hours) |
将某个Date对象加上若干小时数，生成一个新的Date对象 |
| addMinutes(minutes) |
将某个Date对象加上若干分钟数，生成一个新的Date对象 |
| addSeconds(seconds) |
将某个Date对象加上若干秒数，生成一个新的Date对象 |
| addMilliseconds(ms) |
将某个Date对象加上若干毫秒数，生成一个新的Date对象 |
| == |
等于 |
| != |
不等于 |
| < |
小于 |
| <= |
小于等于 |
| > |
大于 |
| >= |
大于等于 |
| && |
并且 |
| || |
或者 |