QQ音樂微信小程式實例碼-小程式開發-PHP中文網

QQ音樂微信小程式實例碼

高洛峰

發布： 2017-03-20 15:16:49

原創

7233 人瀏覽過

想做一個功能齊全的類似QQ音樂的微信小程序，demo來了，可供大家參考，包含音樂搜尋、音樂清單及播放停止
範例程式碼：

QQ音樂微信小程式實例碼

var util = require(&#39;../../utils/util.js&#39;)

var app = getApp()

Page({
    data: {
        playingSong: {},
        songUrl: &#39;&#39;,
        songImg: &#39;&#39;,
        songState: {
            progress: 0,
            currentPosition: &#39;00:00&#39;,
            duration: &#39;00:00&#39;
        },
        isPlaying: true,
        lyric: &#39;&#39;
    },
    onLoad: function(){
        console.log(&#39;playsong onLoad&#39;);

        let that = this;
        let songdata = app.globalData.songData;
         
        that.setData({
            playingSong: songdata,
            songUrl: &#39;http://ws.stream.qqmusic.qq.com/C100&#39; + songdata.songmid + &#39;.m4a?fromtag=38&#39;,
            songImg: &#39;http://y.gtimg.cn/music/photo_new/T002R150x150M000&#39; + songdata.albummid + &#39;.jpg&#39;,
        });

        let thatData = that.data;
        wx.playBackgroundAudio({
            dataUrl: thatData.songUrl,
            title: thatData.playingSong.songname,
            coverImgUrl: thatData.songImg,
            success: function(res){
                //do something
            }
        });
    },
    onReady: function(){
        console.log(&#39;playsong onReady&#39;);
        let that = this;
        that.songPlay();

        wx.onBackgroundAudioPlay(function(){
            console.log(&#39;播放了&#39;);
            that.songPlay();
        });
    },
    timeToString: function(duration){
        let str = &#39;&#39;;
        let minute = parseInt(duration/60) < 10 ? (&#39;0&#39;+ parseInt(duration/60)) : (parseInt(duration/60));
        let second = duration%60 < 10 ? (&#39;0&#39;+duration%60) : (duration%60);
        str = minute+&#39;:&#39;+second;
        return str;
    },
    songPlay: function(){
        let that = this;
        let inv = setInterval(function(){
            wx.getBackgroundAudioPlayerState({
                success: function(res){
                    if(res.status == 1){
                        that.setData({
                            isPlaying: true,
                            songState: {
                                progress: res.currentPosition/res.duration*100,
                                currentPosition: that.timeToString(res.currentPosition),
                                duration: that.timeToString(res.duration)
                            }
                        })
                    }else{
                        that.setData({
                            isPlaying: false
                        });
                        clearInterval(inv);
                    }
                }
            });
        }, 1000);
    },
    songToggle: function(){
        let that = this;

        if(that.data.isPlaying){
            wx.pauseBackgroundAudio();
        }else{
            wx.playBackgroundAudio({
                title: that.data.playingSong.songname,
                coverImgUrl: that.data.songImg
            });
        };

        that.songPlay();
    }
})

登入後複製

以上是QQ音樂微信小程式實例碼的詳細內容。更多資訊請關注PHP中文網其他相關文章！