范围:深圳亚博app开发,软件定制开发,亚博app软件开发公司,深圳软件外包公司.TEL:3447249690
当前位置:首页 > app小程序

亚博-微信小程序简易播放器开发教程

06-23 亚博APP
摘要:本文按照他人例子随着做一个音乐播放器小法式,留下一个脚印吧。实现以下微信小法式的音乐播放器。

本文按照他人例子随着做一个音乐播放器小法式,留下一个脚印吧。实现以下微信小法式的音乐播放器。

width=700

界面做简直实挺丑的,先上wxss文件

//index.wxss

.button-style{

background-color: #eee;

border-radius: 8rpx;

margin: 20rpx;

}

只是顶一个简单的按钮的圆角和间距,色彩这个我仍是用primary这个小绿色。

下面是index.wxml文件

//index.wxml

没法子,用开辟者东西打出来就是如许的丑格局

下面是重点index.js

//index.js

//获得利用实例

var app = getApp()

Page({

data:{ },

//播放

listenerButtonPlay:function(){ wx.playBackgroundAudio({ dataUrl: \'http://ac-5g9r20ds.clouddn.com/e54ad7f0a834b9c07ec6.mp3\', title:\'李宗盛\', //图片地址地址 coverImgUrl:\'http://ac-5g9r20ds.clouddn.com/63bedb5f584234b6827c.jpg\' }) }, //监听button暂停按钮 listenerButtonPause:function(){ wx.pauseBackgroundAudio({ }); console.log(\'暂停播放\') }, /** * 播放状况 */ listenerButtonGetPlayState:function(){ wx.getBackgroundAudi亚博oPlayerState({ success: function(res){ // success //duration 选定音频的长度(单元:s),只有在当前有音乐播放时返回 console.log(\'duration:\' + res.duration) console.log(\'currentPosition:\' + res.currentPosition) //status 播放状况(2:没有音乐在播放,1:播放中,0:暂停中) console.log(\'status:\' + res.status) console.log(\'downloadPercent:\' + res.downloadPercent) //dataUrl 歌曲数据链接,只有在当前有音乐播放时返回 console.log(\'dataUrl:\' + res.dataUrl) }, fail: function() { // fail }, complete: function() { // complete } }) }, /** * 设置进度 */ listenerButtonSeek:function(){ wx.seekBackgroundAudio({ position: 40 }) }, /** * 住手播放 */ listenerButtonStop:function(){ wx.stopBackgroundAudio({ }) console.log(\'住手播放\') }, onLoad:function(options){ // 页面初始化 options为页面跳转所带来的参数 /** * 监听音乐播放 */ wx.onBackgroundAudioPlay(function() { // callback console.log(\'onBackgroundAudioPlay\') }) /** * 监听音乐暂停 */ wx.onBackgroundAudioPause(function() { // callback console.log(\'onBackgroundAudioPause\') }) /** * 监听音乐住手 */ wx.onBackgroundAudioStop(function() { // callback console.log(\'onBackgroundAudioStop\') }) } })

里面可以先依照挨次来看onLoad函数,里面界说了三个监听函数,可以看到console里面结果如图

width=700

相干资讯:微信小法式微信小法式开辟教程

版权保护: 本文由 亚博app开发 原创
转载请保留链接: http://www.cqsLin.com

关于我们      深圳亚博定制开发软件有限公司,自2013年成立以来,为上千家企业提供软件外包、系统软件开发、亚博app开发、微信公众号开发、深圳亚博小程序开发等各种优秀的软件定制开发服务.关键词:软件外包公司、手机软件开发、app制作开发、手机亚博app开发、小程序开发公司【TEL】:3447249690 微信:3447249690 QQ:3447249690
  • 1578文章总数
  • 13访问次数
  • 建站天数