html5 音频实例,HTML5音频audio属性(示例代码)

audio 的控制函数主要有:

load() 加载音频、视频软件,通常不必调用,除非是动态生成的元素,用来在播放前预加载

play() 加载并播放音频、视频文件,除非文件已经暂停在其他位置,否则默认重头开始播放

pause() 暂停处于播放状态的音频、视频文件

audio 的只读媒体特性有:

duration 获取媒体文件的播放时长,以s为单位,如果无法获取,则为NaN

paused 如果媒体文件被暂停,则返回true,否则返回false

ended 如果媒体文件播放完毕,则返回true

startTime 返回起始播放时间,一般是0.0,除非是缓冲过的媒体文件,并一部分内容已经不在缓冲区

error 在发生了错误后返回的错误代码

currentSrc 以字符串形式返回正在播放或已加载的文件,对应于浏览器在source元素中选择的文件

audio 可脚本控制的特性值:

autoplay 自动播放已经加载的的媒体文件,或查询是否已设置为autoplay

loop 将媒体文件设置为循环播放,或查询是否已设置为loop

currentTime 以s为单位返回从开始播放到目前所花的时间,也可设置 currentTime的值来跳转到特定位置

controls 显示或者隐藏用户控制界面

volume 在0.0到1.0间设置音量值,或查询当前音量值

muted 设置是否静音

autobuffer 媒体文件播放前是否进行缓冲加载,如果设置了autoplay,则忽略此特性

歌曲播放进度

这个功能用到的 audio api 主要有:

currentTime() :以秒为单位返回从开始播放到目前所花的时间,也可设置 currentTime 的值来跳转到特定位置;

duration:获取媒体文件的播放时长,以秒为单位,如果无法获取,则为 NaN;

歌曲进度:首先先设置一个定时器,分别获取这两个值,用当前播放的秒数除以歌曲总秒数,再乘以歌曲进度条的总宽度(px),就能算出歌曲进度条一秒钟可以走多少。

歌曲进度调节:点击进度条的某个位置,歌曲跳转到响应位置,这个功能的实现是先获取到点击的位置距离进度条最左边的长度(让 Firefox 支持 offsetX、offsetY),接着获得这段距离在整个进度条的长度里所占的百分比,用这个百分比乘以歌曲的总长度,就能算出该给 currentTime 设置的值。

歌曲时间显示

歌曲显示:在计算歌曲进度的定时器内,不断发送歌曲的播放时间和总时间,左边的时间为歌曲的播放时间,也就是 currentTime 的值,右边的时间用总时间减去 currentTime ,并将它们转换为我们需要的格式即可。

音量的调节

volume:在0.0到1.0间设置音量值,或查询当前音量值;

音量调节:这个功能实现起来很简单,把 volume 的值设为 0.0,就静音了。在控件上调节音量的原理和也歌曲的进度条一样,判断点击位置距离第一个相对元素 Y 轴上最顶端的位置,然后再进一步计算出具体的数值,注意数值的格式,别超过1,并且小数点后只有1位。

播放列表与播放方式

把整个歌曲文件的信息都写在 json 文件里,获取并生成播放列表。当播放歌曲时,系统会生成当前播放歌曲的引索值(例如:1,2,表示第二张专辑的第三首歌,这个很重要,歌曲切换都是基于这个引索值的),当要播放下一曲时,系统会根据当前是什么播放方式(列表循环,单曲循环,随机播放,顺序播放),生成新的引索值,然后通知播放器,下一首该怎么播放,是随机,还是循环,还是播放结束。

同步显示歌词

ajax获取歌词文件(lrc文件)

用正则分别过滤出歌词和歌词前面对应的时间,存入数组

将歌词的时间和内容遍历存入 HTML

每秒都去判断一下现在歌曲播放的时间,如果和临时数据 data-timeline 里的值一样,就滚动

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
当然,我会尽力回答你的问题。不过,在回答问题之前,请确认一下你的问题是否与我之前提到的ChitGPT有关。因为我是一个文本AI模型,不具备编程能力。如果你需要关于编程的帮助,我可以尽力回答一些基础性的问题,但是如果问题比较复杂,我可能无法回答。 好的,回到你的问题:如何在VB.NET中实现音频文件的复制、剪切和粘贴功能。以下是一个简单的示例代码: ```vb.net ' 复制文件 File.Copy("C:\audio\music.mp3", "C:\backup\music_copy.mp3") ' 剪切文件 File.Move("C:\audio\music.mp3", "C:\backup\music_cut.mp3") ' 粘贴文件 File.Copy("C:\backup\music_copy.mp3", "C:\audio\music_copy.mp3") ``` 这段代码展示了如何使用VB.NET的File类来复制、剪切和粘贴音频文件。具体来说: - `File.Copy(sourceFilePath, destinationFilePath)`方法可以将指定路径下的文件复制到另一个路径中。在本例中,将C:\audio\music.mp3文件复制到C:\backup\music_copy.mp3中。 - `File.Move(sourceFilePath, destinationFilePath)`方法可以将指定路径下的文件移动到另一个路径中。在本例中,将C:\audio\music.mp3移动到C:\backup\music_cut.mp3中。 - `File.Copy(sourceFilePath, destinationFilePath)`方法再次使用,这次将备份的文件复制回原始路径,从而实现了“粘贴”的功能。 请注意,这只是一个简单的示例代码,实际应用中还需要考虑异常处理、文件名重复、文件不存在等情况。另外,这里的示例代码只处理单个文件,如果需要处理多个文件,需要使用循环等方式进行操作。 希望这个简单的示例能够帮助你理解如何在VB.NET中实现音频文件的复制、剪切和粘贴功能。如果你还有其他问题,可以继续问我。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值