微信小程序音频播放
微信小程序音频播放
// 开启播放音频
startAudio(){
const innerAudioContext = uni.createInnerAudioContext();//创建并返回内部 audio
innerAudioContext.autoplay = false;//不自动播放
innerAudioContext.src =this.pageInfoBack.leaveReason;//音频的地址,不支持本地路径
innerAudioContext.obeyMuteSwitch=false;//即使用户打开了静音开关,也能继续发出声音
let self=this;
innerAudioContext.play(); // 点击按钮音频开始播放事件
self.isPlay=true;//显示播放图标
innerAudioContext.onEnded(res=>{
console.log("播放结束",res)
self.isPlay=false;
})
innerAudioContext.onError(err=>{
self.isPlay=false;
})
},
微信小程序音频播放的更多相关文章
- 微信小程序音频播放 InnerAudioContext 的用法
今天项目上涉及到了微信小程序播放音频功能,所以今天跟着一些教程做了个简单的播放器 1.实现思路 刚开始想着有没有现成的组件可以直接用,找到了微信的媒体组件 audio,奈何看着 1.6.0版本开始,该 ...
- 微信小程序——音频播放器
先来个效果图韵下味: 需求: 音频的播放,暂停,中间按钮状态的变化,播放时实时更新播放进度: 前进15s,后退15s: 进度条拖动. 一开始想着这3个功能应该挺简单的.不就是播放,暂停,前进,后退么~ ...
- 微信小程序 - 音频播放(1.2版本和1.2版本之后)
不多说了,直接贴code // 1.2版本以后便不在维护 wx.getBackgroundAudioManager({ success:function(res){ var status =res.s ...
- 微信小程序音频背景播放
由于微信小程序官方将音频的样式固定死了,往往再工作中和UI设计师设计出来的样式不符,故一般都采用背景音频播放来实现自定义的UI样式的音频播放,即使用官网API提供的BackgroundAudioMan ...
- 微信小程序音乐播放
最近在写一个艾美食艾音乐的微信小程序,其中有用到音乐播放的功能,基本播放切换功能已经实现,但是在反复切换歌曲.重新进入歌曲以及单曲循环.列表循环的测试过程中还是发生了bug,特此写一篇文章,捋一下思路 ...
- 微信小程序音乐播放器
写在前面 1.入门几天小白的作品,希望为您有帮助,有好的意见或简易烦请赐教 2.微信小程序审核音乐类别已经下架,想要发布选题需慎重.附一个参考链接,感谢https://www.hishop.com.c ...
- 微信小程序音频长度获取的问题
小程序推荐使用wx.createInnerAudioContext()创建的innerAudioContext,我们也通过这个接口创建音频.音频的长度可以通过属性获取: 但是,给innerAudioC ...
- 微信小程序音乐播放器组件
wxml <image bindtap="click" src="{{isPlay?'/images/':'/images/'}}"/> JS Pa ...
- 微信小程序---音乐播放和控制
1.效果图如下: 2.代码如下: //index.js //获取应用实例 var app = getApp() Page({ data: { motto: 'Hello World', userInf ...
- 微信小程序(9)--音频及视频弹幕
记录微信小程序音频及视频弹幕播放效果. 1.audio <!-- audio.wxml --> <audio poster="{{poster}}" name=& ...
随机推荐
- git 暂存区问题
如果需要合别人的代码进来 需要暂时把自己的代码stash一下,用 git stash 放入暂存 如果需要释放出来用 git stash pop 当暂存用的越来越多,问题出现了需要清理暂存区队列,使用代 ...
- vagrant搭建开发环境
一:我们为什么需要用这玩意 我们在开发中经常会面临的问题:环境不一致,有人用Mac有人用Windos还有几个用linux的,而我们的服务器都是linux. 在我本地是可以的啊,我测了都,没有问题啊,然 ...
- phpredis和predis
一般我们常用的扩展是phpredis和predis两个 phpredis, 它是用c写的php的高效扩展:https://github.com/phpredis/phpredis, predis, 它 ...
- 【docker-compose】Redis安装教程
仅供学习参考 ,请勿轻易在生产环境使用 0. 文件目录 下面的文件按照这个目录层级放置,首先创建 /docker/redis 文件夹,/docker/redis 对应下边图中 REDIS. 1. 创建 ...
- 前端必须知道的手机调试工具vConsole
在日常业务中我相信大家多多少少都有移动端的项目,移动端的项目需要真机调试的很多东西看不到调试起来也比较麻烦,今天给大家分享一个我认为比较好用的调试第三方库VConsole ,有了这个库咱们就在手机上看 ...
- 远程连接利器:玩转MobaXterm
今天这篇文章轻松不烧脑,主要是想和大家分享一下我在工作中常用的远程管理工具--MobaXterm.这款工具不仅功能强大,而且在日常的远程操作中极为高效,特别适合用来管理远程服务器.MobaXterm结 ...
- css var实现网页换肤
前情 最近在做需求开发,要求根据后台传来的配置对网页换肤,按以往的换肤思路应该是写好几套样式做切换达到换肤效果,但是现在想做到能根据后台配置动态修改. 原理 通过css3新增变量特性,把颜色定义为变量 ...
- jmeter使用jdbc连接SQL server,执行SQL报错处理
前置环境参数:jdk-8u391-windows-x64,驱动:sqljdbc4.jar 备注:这是解决后的截图,将就用 问题一:使用jmeter5.5,使用jdbc连接SQL server,执行SQ ...
- 使用 Store 版的 WinDbg 调试 .NET 应用
1. 通过 Windows Store 安装 WinDbg 打开 Windows Store, 在搜索框中输入 WinDbg, 如果已经安装了,看到的是 Open,如果还没有安装,显式为 Get. 直 ...
- sqlalchemy 的 schema 合并模块 alembic 使用
alembic 很好的解决了升级数据库改变表结构的传统难题,官方的推荐用法是当一个工具用,这是从 Stack Overflow 扒到的直接用内部 api 的代码,操作有点像 diff_patch. 来 ...