养生 装修 购物 美食 感冒 便秘 营销 加盟 小吃 火锅 管理 创业 搭配 减肥 培训 旅游

【Axure如何实现音量调节按钮

时间:2024-10-21 11:36:03

在网上看视频时经常有音量调节的按钮,如何用Axure快速做出音量调节按钮?简单几步,让你轻松解决。

【Axure如何实现音量调节按钮

方法/步骤

1、1.打开软件,新建文件,拖入一个【动态面板】,命名为【按钮】。

【Axure如何实现音量调节按钮

2、2.訇咀喃谆将【按钮】的状态1和状态2分别命名为【未选中】和【选中】。分别加入未选中和选中两种状态下的喇叭图标。

【Axure如何实现音量调节按钮

【Axure如何实现音量调节按钮

3、3.创建滑块条背景:拖入一个【动态面板】,命名为【滑块背景】。

【Axure如何实现音量调节按钮

4、4.双击进入【滑块背景】的状态1,创建一根圆角矩形。

【Axure如何实现音量调节按钮

5、5.回到【坡纠课柩index】页面,拖入一个【动态面板】,命名为【滑块】,并进入【滑块】状态1创建一个圆形滑块。

【Axure如何实现音量调节按钮

6、6.回到【index】页面,调整各部件位置。

【Axure如何实现音量调节按钮

7、7.设置【热区】,如下图,用于触发关闭音量调节。

【Axure如何实现音量调节按钮

8、8.选中其中一个热区,设置事件-->复制事件,粘贴到其他热区的动作中。

【Axure如何实现音量调节按钮

【Axure如何实现音量调节按钮

9、9.设置【按钮】的单击事件如下:

【Axure如何实现音量调节按钮

10、10.设置【滑块】的滑动如下。页面载入时隐藏【滑块】和【滑块背景】

【Axure如何实现音量调节按钮

【Axure如何实现音量调节按钮

11、如果您觉得有用,记得在下方点击投票、点衙吧拊路赞、关注、留言,小编会定期奉上更多的惊喜哦,您的支持才是小编继续努力的动力,么么哒。

【Axure如何实现音量调节按钮

© 一点知识