热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

QQ音乐微信小程序实例代码

这篇文章介绍QQ音乐微信小程序实例代码
想做一个功能齐全的类似QQ音乐的微信小程序,demo来了,可供大家参考,包含音乐搜索、音乐列表及播放停止
示例代码:

var util = require('../../utils/util.js')

var app = getApp()

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

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

        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('playsong onReady');
        let that = this;
        that.songPlay();

        wx.onBackgroundAudioPlay(function(){
            console.log('播放了');
            that.songPlay();
        });
    },
    timeToString: function(duration){
        let str = '';
        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社区 其它相关文章!


推荐阅读
  • 使用JS、HTML5和C3创建自定义弹出窗口
    本文介绍如何结合JavaScript、HTML5和C3.js来实现一个功能丰富的自定义弹出窗口。通过具体的代码示例,详细讲解了实现过程中的关键步骤和技术要点。 ... [详细]
  • 本文将深入探讨PHP编程语言的基本概念,并解释PHP概念股的含义。通过详细解析,帮助读者理解PHP在Web开发和股票市场中的重要性。 ... [详细]
  • 国内BI工具迎战国际巨头Tableau,稳步崛起
    尽管商业智能(BI)工具在中国的普及程度尚不及国际市场,但近年来,随着本土企业的持续创新和市场推广,国内主流BI工具正逐渐崭露头角。面对国际品牌如Tableau的强大竞争,国内BI工具通过不断优化产品和技术,赢得了越来越多用户的认可。 ... [详细]
  • PHP 5.2.5 安装与配置指南
    本文详细介绍了 PHP 5.2.5 的安装和配置步骤,帮助开发者解决常见的环境配置问题,特别是上传图片时遇到的错误。通过本教程,您可以顺利搭建并优化 PHP 运行环境。 ... [详细]
  • 新冠肺炎疫情期间,各大银行积极利用手机银行平台,满足客户在金融与生活多方面的需求。线上服务不仅激活了防疫相关的民生场景,还推动了银行通过互联网思维进行获客、引流与经营。本文探讨了银行在找房、买菜、打卡、教育等领域的创新举措。 ... [详细]
  • Android 渐变圆环加载控件实现
    本文介绍了如何在 Android 中创建一个自定义的渐变圆环加载控件,该控件已在多个知名应用中使用。我们将详细探讨其工作原理和实现方法。 ... [详细]
  • Google最新推出的嵌入AI技术的便携式相机Clips现已上架,旨在通过人工智能技术自动捕捉用户生活中值得纪念的时刻,帮助人们减少照片数量过多的问题。 ... [详细]
  • 本文介绍了如何使用PHP代码实现微信平台的媒体素材上传功能,详细解释了API接口的使用方法和注意事项,确保文件路径正确以避免常见的错误。 ... [详细]
  • JavaScript 中创建对象的多种方法
    本文详细介绍了 JavaScript 中创建对象的几种常见方式,包括对象字面量、构造函数和 Object.create 方法,并提供了示例代码和属性描述符的解释。 ... [详细]
  • 本文详细介绍了如何使用 PHP 接收并处理微信支付的回调结果,确保支付通知能够被正确接收和响应。 ... [详细]
  • 嵌入式开发环境搭建与文件传输指南
    本文详细介绍了如何为嵌入式应用开发搭建必要的软硬件环境,并提供了通过串口和网线两种方式将文件传输到开发板的具体步骤。适合Linux开发初学者参考。 ... [详细]
  • 微信小程序:授权登录与手机号绑定
    本文详细介绍了微信小程序中用户授权登录及绑定手机号的流程,结合官方指引和实际开发经验,提供了一套完整的实现方案,帮助开发者更好地理解和应用。 ... [详细]
  • 在使用Netty 4.1.48版本运行自带的HTTP服务器示例时,观察到大量本地IP环回连接。本文将探讨这些环回连接的原因,并解释其与TCP连接的关系。 ... [详细]
  • 程序员如何优雅应对35岁职业转型?这里有深度解析
    本文探讨了程序员在职业生涯中如何通过不断学习和技能提升,优雅地应对35岁左右的职业转型挑战。我们将深入分析当前热门技术趋势,并提供实用的学习路径。 ... [详细]
  • 深入理解小程序中的Picker组件
    Picker组件是一种从屏幕底部弹出的滚动选择器,支持多种选择模式,包括普通选择器、多列选择器、时间选择器、日期选择器和省市区选择器。本文将详细介绍Picker的各种属性及其应用场景。 ... [详细]
author-avatar
幽忧白雪666
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有