在原型设计工作中,看似简单的滑块元件,如果想要做好,如果没有得心应手的工具也是要费一番功夫的。如果你想在Axure中创建滑块,哪怕最简单的哪种,没有30分钟也很难完成。
下面讲解一下如何在Xstar软件中使用系统自带的Bootstrap效果的滑块。
目录
1. 元件效果
2. 准备工作
3. 设置详解
3.1 放置滑块元件
3.2 移动边界的最大值、最小值设置
3.3 滑块位置,滑动幅度设置
3.4 禁用
3.5 成功范围设置
3.6 验证设置
3.7 验证样式设置
1. 元件效果
简单的运行效果大概就是上图这个样子,当然还可以配合其他元件制作出多钟效果,今天只是对滑块本身进行讲解,以便突出重点。
2. 准备工作
功欲善其事,必先利其器。动手之前,先要安装最新版的Xstar软件,我使用的是Xstar2022.2.20版,因为软件没有自动升级功能,还需要手动下载安装。【下载地址】
3. 设置详解
3.1 放置滑块元件
3.2 移动边界的最大值、最小值设置
最小值:滑块向左移动的位置边界
最大值:滑块向右移动的位置边界
3.3 滑块位置,滑动幅度设置
滑块位置:滑块当前所在长条的位置
增量:移动滑块时,鼠标按键抬起时,滑块移动的最小单位
3.4 禁用
禁用:滑块无法移动
3.5 成功范围设置
成功范围:在勾选“验证成功提示”选项时,如果滑块在成功范围内,则显示成功提示信息的内容,如果不在成功范围内,则不显示成功提示信息的内容(如果勾选了“验证失败提示”选项,则显示失败提示信息的内容)。
3.6 验证设置
验证包括“成功验证”和“失败验证”,对应的信息为验证成功信息、验证失败信息。在成功范围内时,触发显示成功信息,不在成功范围内时,触发失败提示信息。
3.7 验证样式设置
提示样式分为:默认提示、工具提示。
(1)默认提示效果:
(2)工具提示效果:
声明:本站部分文章及图片源自用户投稿,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!