uniapp音频类

news/2024/12/22 11:03:26/

功能:
1.可以设置固定地时间间隔播放循环

export default {audio: null,playInterval: 0, // 播放间隔时间(毫秒)time: null,init(src, options) {let that = this;that.playInterval = options.playInterval ?? 5000return new Promise((resolve, reject) => {try {if (that.audio === null) {that.audio = uni.createInnerAudioContext();that.audio.src = src || 'https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3';that.setProperty(options)// 可以在这里设置其他属性,如音量等console.log('auto+++++++++++++', that.audio)// utils.sleep(3000);resolve(that.audio)} else {resolve(that.audio)}} catch (e) {//TODO handle the exceptionreject()}})},setProperty(obj) {Object.assign(this.audio, obj)},play() {if (this.audio) {this.audio.play();if (this.playInterval && !this.audio.loop) {this.audio.onEnded(this.onEndedHandle())}}},onEndedHandle() {// 设置定时器,在指定的时间间隔后再次播放let that = this;that.time = setTimeout(() => {that.play()}, that.playInterval)console.log(that.playInterval, '设置定时器,在指定的时间间隔后再次播放')},pause() {console.log('暂停')if (this.audio) {this.audio.pause();if (this.playInterval && !this.audio.loop) {this.clearCustomPlayInterval()}}},clearCustomPlayInterval() {clearTimeout(this.time)console.log(this.time)this.audio.offEnded()},stop() {if (this.audio) {if (this.playInterval) {this.clearCustomPlayInterval()}this.audio.stop();this.audio.destroy(); // 销毁音频上下文this.audio = null;}},onPlay(callback) {if (this.audio) {this.audio.onPlay(callback);}},onPause(callback) {if (this.audio) {this.audio.onPause(callback);}},onStop(callback) {if (this.audio) {this.audio.onStop(callback);}},onError(callback) {if (this.audio) {this.audio.onError(callback)}}
};

使用

import musicPlayer from '@/common/musicPlayer';
musicPlayer.init('/static/mp4.mp3', {obeyMuteSwitch: false,loop: false,playInterval: 12000});

http://www.ppmy.cn/news/1557177.html

相关文章

汇编DOSBox 如何使文件可以运行

1.在vscode编写(其他也可以)如何在vscode中编写汇编语言并在终端进行调试(保姆级别)_如何在vscode编译asm-CSDN博客 2.点击ML615中的DOS 2.1在命令行中输入命令 ml 文件名.asm ml 文件名.obj 2.2 将生成的exe文件移动到Assembly里面 这个文件…

对uniApp 组件 picker-view 的二次封装,实现日期,时间、自定义数据滚动选择,容易扩展

在开发过程中根据业务需求,对unaipp的picker-view 组件进行了一些封装,目前封装:实现日期,时间、自定义数据滚动选择。 开发的朋友感兴趣可以看看,可以根据你们的需要,可以对封装的组件增加功能配置&#…

在Windows11上编译C#的实现Mono的步骤

在Windows11上编译Mono的步骤 1、 在win11打开开发者模式,在更新和安全选项里,如下图: 2、下载并安装64位的cygwin, 下载网站:www.cygwin.com 3、 安装 Visual Studio 2015 or later 的社区版本。 4、 下载Mono的windows最新版本。 5、 在cmd.exe里运行下面的命令来安…

centos怎么安装haproxy

在CentOS上安装HAProxy的步骤如下: 添加HAProxy的官方仓库: HAProxy提供了一个官方的RPM仓库,可以通过添加这个仓库来安装最新版本的HAProxy。首先,你需要下载仓库的公钥并添加仓库: sudo rpm --import https://haprox…

B树的性质和插入过程

性质 平衡性:所有叶子节点都在同一层多路:m 阶 B 树 最多: m 个分支,m-1 个元素 最少: 根节点 2 个分支 1个元素 其他节点 ⌈ m / 2 ⌉ \lceil m/2\rceil ⌈m/2⌉ 个分支 ⌈ m / 2 ⌉ \lceil m/2\rceil ⌈m/2⌉ −…

动手学深度学习-线性神经网络-7softmax回归的简洁实现

目录 初始化模型参数 重新审视Softmax的实现 优化算法 训练 小结 在 线性回归的实现中, 我们发现通过深度学习框架的高级API能够使实现 线性回归变得更加容易。 同样,通过深度学习框架的高级API也能更方便地实现softmax回归模型。 本节如在上一节…

MapBox实现深蓝色科技风格底图方案

先来简单看一下效果: 当然你也可以根据自己的喜好去调整颜色: 而且我亲自测试不会影响其他的图层效果。 因为mapbox到目前为止的3.8.0版本不像openlayers那样能够灵活的操作图层。因此在mapbox中通过修改天地图去改变其底图色彩样式就变得比较困难。 我们都知道(不知道 的…

Webpack学习笔记(5)

1.拆分开发环境和生产环境配置 很多配置在开发环境和生产环境存在不一致的情况,比如开发环境没有必要设置缓存,生产环境需要设置公共路径等等。 2.公共路径 使用publicPath配置项,可以通过它指定应用程序中所有资源的基础路径。 webpack.…