bAxure9 教程:拖动滑块确定评分区间效果( 二 )


文章插图
第三步,设置「Min」「Max」文本标签的评分数值随着滑块拖动而变化。
1)给左侧的动态面板「LeftSlider」添加【移动时】的交互,设置「Min」的【文本】值为:
[[math.ceil((This.left-background.left)/background.width*10)]]分

  • 左侧滑块滑动的宽度=左侧滑块的左坐标-灰色背景条的左坐标 ;
  • 左侧评分分值=左侧滑块滑动的宽度/灰色背景条的宽度*10 ;
  • math.ceil(x)函数为向上取整函数,返回大于或等于参数x,并且与之最接近的整数。
bAxure9 教程:拖动滑块确定评分区间效果
文章插图
2)同样给右侧的动态面板「RightSlider」添加【移动时】的交互,设置「Max」的【文本】值为:
【 bAxure9 教程:拖动滑块确定评分区间效果】[[10-math.ceil((background.right-This.right)/background.width*10)]]分
bAxure9 教程:拖动滑块确定评分区间效果
文章插图
本文由 @Daisy 原创发布于人人都是产品经理,未经作者许可,禁止转载。
题图来自 Unsplash,基于 CC0 协议