当前位置:主页 > 芜湖喷粉加工 >

芜湖喷粉加工

Axure9 教程:拖动滑块确定评分区间效果

发布日期:2021-11-09 03:31   来源:未知   阅读:

  上海银行业上半年投诉情况:上海银行居,滑块及评分数值跟随鼠标拖动沿水平方向移动,移动范围不能超出灰色背景条两端。

  评分数值的坐标始终与滑块一致,且数值要随着滑块拖动在「0-10」的范围内变化。

  1)拖入一个【矩形】元件,设置元件宽度:300px,高度:6px,圆角半径:6,填充颜色:#EEEEEE澳门论坛六肖资料12码,命名为「BackGround」。

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

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

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

  1)给左侧的滑块「LeftSlider」添加【拖动时】的交互,【移动】「LeftSlider」【跟随水平拖动】。

  做完这步滑块已经可以跟随鼠标水平拖动了,但是我们还需要限制滑块左右拖动的范围。

  「LeftSlider」的滑动范围向左不能超过其初始位置,向右不能超过右侧滑块「RightSlider」的左坐标;滑动范围即灰色背景条「BackGround」的左坐标和滑块「RightSlider」左坐标之间的距离。

  边界值需要借助局部变量获取,点击【添加局部变量】,设置局部变量「backGround」【=】【元件】「BackGround」。

  第二步,添加橙色滑动条「ProgressBar」宽度随着滑块拖动而变化的交互。

  橙色的滑动条的宽度为右侧滑块「RightSlider」的左坐标减去左侧滑块「LeftSlider」的左坐标。

  1)给左侧的动态面板「LeftSlider」添加【移动时】的交互,设置「Min」的【文本】值为:

  math.ceil ( x ) 函数为向上取整函数,返回大于或等于参数 x,并且与之最接近的整数。