Axure教程:实现网易云音乐有声播放效果

0 评论 14852 浏览 11 收藏 4 分钟
🔗 产品经理的核心价值是能够准确发现和满足用户需求,把用户需求转化为产品功能,并协调资源推动落地,创造商业价值

网易云音乐大家应该都有用,它的音乐播放效果不知道你是否有注意过。本文作者介绍了如何用Axure实现网易云音乐有声播放效果的操作步骤,以及实现过程中的一些注意事项,与大家分享。

为了方便讲解,我们首先在桌面新建一个文件夹,命名为音乐。

1、将自己想要演示播放的MP3音乐文件放在这个文件夹里面

2、给播放页添加一个中继器

随便命名,我给它命名为【音乐地址链接器】,用来链接播放本地音乐文件。并将此中继器设置为隐藏。

3、选中播放按钮,给播放状态按钮添加交互事件

在单击事件中再增加“框架中打开链接”交互事件,勾选【音乐地址链接器】中继器,选择链接到【链接到URL或文件路径】,文件路径输入刚才的音乐名称及后缀,如:怎么做怎么过怎么活.mp3。

同理,给暂停状态按钮添加交互事件,再增加“框架中打开链接”交互事件,勾选【音乐地址链接器】中继器,选择链接到【链接到URL或文件路径】,文件路径输入空值,即不打开什么链接或文件,实现停止不播放音乐的假象。

4、点击顶部菜单【发布】-【生成HTML文件】

选择刚才桌面创建的文件夹【音乐】,点击【确定】生成HTML文件。

5、最后,生成的播放页

打开桌面的【音乐】文件夹,选择并打开生成的播放页.html文件(你的源文件里面的播放页命名什么,就打开哪一个)。

此时,点击播放就能听到音乐播放声音的效果了,再点击暂停,音乐即停止播放。

温馨提示

  1. 在源文件直接点击【预览】,是无法听到音乐的播放效果的,只能生成html文件后再打开此html文件。
  2. 音乐的播放效果,是无法实现播放到一半暂停,点击继续播放音乐,只能重新开始播放。

#关联文章#

Axure教程(中级):网易云音乐听歌识曲效果模仿#

 

本文由 @火星人~艾斯 原创发布于人人都是产品经理。未经许可,禁止转载

题图来自Unsplash,基于CC0协议

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 目前还没评论,等你发挥!
专题
15566人已学习12篇文章
逻辑图是用图标符号、说明文字以及连接线等,形象化地表达复数要素之间的相互作用关系。本专题的文章分享了如何绘制逻辑图。
专题
13519人已学习12篇文章
需求管理,也是产品运营人工作中非常重要的一个任务。本专题的文章分享了如何做需求管理。
专题
17942人已学习13篇文章
本专题的文章对整个商业模式进行了一个清晰的梳理和设计,并说明了商业模式如何变成可执行的路径。
专题
13939人已学习12篇文章
作者B端的产品经理,要基于这个行业理解的大背景下去了解公司的业务全局。本专题的文章分享了B端产品经理如何了解业务全局。
专题
14488人已学习11篇文章
本专题的文章分享了收银台功能设计的流程以及过程中需要注意的问题等等。
专题
14591人已学习13篇文章
无论是对于需求的挖掘,还是对于产品的设计迭代,用户访谈这个环节都是必不可少的。本专题的文章分享了如何做好用户访谈。