导语：滑块拖动效果是原型设计中比较常见的交互效果，今天我们以豆瓣的评分区间筛选组件为例来讲讲如何在Axure中实现拖动滑块确定评分区间的交互。

一、交互效果说明

1. 滑块及评分数值跟随鼠标拖动沿水平方向移动，移动范围不能超出灰色背景条两端。
2. 拖动滑块时，橙色的进度条宽度随着滑块的拖动而变化。
3. 评分数值的坐标始终与滑块一致，且数值要随着滑块拖动在「0-10」的范围内变化。

效果预览：

二、元件准备

1. 拖入一个【矩形】元件，设置元件宽度：300px，高度：6px，圆角半径：6，填充颜色：#EEEEEE，命名为「BackGround」。

复制一个「BackGround」出来，置于「BackGround」上方，填充颜色：#FFB444，命名为「ProgressBar」。

2. 拖入一个【圆形】元件，设置大小为：28px*28px，线段宽度：1px，线段颜色#A2A2A2。

在此【圆形】元件上方拖入一个【文本标签】，设置字体颜色：#999999，字体大小：12px，文本内容：“0分”，命名为「Min」。

将上述两个元件选中点击右键转换为动态面板，命名为「LeftSlider」。

3. 复制一个「LeftSlider」出来，命名为「RightSlider」。

双击进入动态面板修改文本标签的文本内容为：“10分”，命名为「Max」。

将上述元件按照图示位置进行调整，所有元件准备完毕。

三、添加交互