使用Audio API中的playlist来做一个音乐播放器
2016-05-27 12:18
435 查看
在最新的QtMultiMedia 5.6中,AudioAPI中有一个playlist属性.我们可以充分利用这个属性来做一个简单的音乐播放器.在我们的官方文档中,写的是QttMultiMedia 5.4.正确的是5.6版本.Audio API可以让我们很方便地播放我们所需要的音乐.在我们之前的文章"如何在Ubuntu
QML应用中播放音乐"也讨论过如何利用MediaPlayer及SoundEffect来播放音乐.
如何利用Audio 中的playlist呢?我们先来看一个简单的例子:
在上面的代码中,我们向我们的playlist表中添加我们的音乐文件.当然,我们也可以动态地添加它们到我们的列表中.我们也可以通过如下的方式来添加我们的音乐列表:
目前在Ubuntu手机上测试.这种方法有一个bug.如果音乐文件存在的话,那么在列表中将会有两个相同的项被显示.目前,我们还是使用前面介绍的方法来做我们的例程.
整个的设计还是非常简单.屏幕的上面是一个音乐的列表.下面是一个该音乐文件的状态.由于一些原因,我们目前还不能得到音乐文件的metaData.
我们可以通过点击列表中的像来播放或停止正在播放的音乐.
整个项目的源码在:https://github.com/liu-xiao-guo/playlist-audio
QML应用中播放音乐"也讨论过如何利用MediaPlayer及SoundEffect来播放音乐.
如何利用Audio 中的playlist呢?我们先来看一个简单的例子:
Audio { id: player; autoPlay: true autoLoad: true playlist: Playlist { id: playlist } Component.onCompleted: { console.log(playlist.addItem(Qt.resolvedUrl("sounds/song1.mp3"))) console.log(playlist.addItem(Qt.resolvedUrl("sounds/background.mp3"))) console.log("playlist count: " + playlist.itemCount) console.log("metaData type: " + typeof(meta)) play() } }
在上面的代码中,我们向我们的playlist表中添加我们的音乐文件.当然,我们也可以动态地添加它们到我们的列表中.我们也可以通过如下的方式来添加我们的音乐列表:
Audio { id: player; playlist: Playlist { id: playlist PlaylistItem { source: "song1.ogg"; } PlaylistItem { source: "song2.ogg"; } PlaylistItem { source: "song3.ogg"; } } } ListView { model: playlist; delegate: Text { font.pixelSize: 16; text: source; } }
目前在Ubuntu手机上测试.这种方法有一个bug.如果音乐文件存在的话,那么在列表中将会有两个相同的项被显示.目前,我们还是使用前面介绍的方法来做我们的例程.
Main.qml
import QtQuick 2.4 import Ubuntu.Components 1.3 import QtMultimedia 5.6 MainView { // objectName for functional testing purposes (autopilot-qt5) objectName: "mainView" // Note! applicationName needs to match the "name" field of the click manifest applicationName: "playlist.liu-xiao-guo" width: units.gu(60) height: units.gu(85) property var meta: player.metaData Page { id: page header: PageHeader { id: pageHeader title: i18n.tr("playlist") } Audio { id: player; autoPlay: true autoLoad: true playlist: Playlist { id: playlist } Component.onCompleted: { console.log(playlist.addItem(Qt.resolvedUrl("sounds/song1.mp3"))) console.log(playlist.addItem(Qt.resolvedUrl("sounds/background.mp3"))) console.log("playlist count: " + playlist.itemCount) console.log("metaData type: " + typeof(meta)) console.log("The properties of metaData is:") var keys = Object.keys(meta); for( var i = 0; i < keys.length; i++ ) { var key = keys[ i ]; var data = key + ' : ' + meta[ key ]; console.log( key + ": " + data) } play() } } Flickable { anchors { left: parent.left right: parent.right top: pageHeader.bottom bottom: parent.bottom } contentHeight: layout.childrenRect.height + layout1.height + layout1.spacing Column { id: layout anchors.fill: parent ListView { anchors.left: parent.left anchors.right: parent.right height: page.height/2 model: playlist; delegate: Label { fontSize: "x-large" text: { var filename = String(source); var name = filename.split("/").pop(); return name; } MouseArea { anchors.fill: parent onClicked: { if (player.playbackState != Audio.PlayingState) { player.playlist.currentIndex = index; player.play(); } else { player.pause(); } } } } } Rectangle { width: parent.width height: units.gu(0.1) color: "red" } Slider { id: defaultSlider anchors.horizontalCenter: parent.horizontalCenter width: parent.width * 0.8 maximumValue: 100 value: player.position/player.duration * maximumValue } CustomListItem { title.text: { switch (player.availability ) { case Audio.Available: return "availability: available"; case Audio.Busy: return "availability: Busy"; case Audio.Unavailable: return "availability: Unavailable"; case Audio.ResourceMissing: return "availability: ResourceMissing"; default: return ""; } } } CustomListItem { title.text: "bufferProgress: " + player.bufferProgress; } CustomListItem { title.text: "duration: " + player.duration/1000 + " sec" } CustomListItem { title.text: "hasAudio: " + player.hasAudio } CustomListItem { title.text: "hasVideo: " + player.hasVideo } CustomListItem { title.text: "loops: " + player.loops } CustomListItem { title.text: "muted: " + player.muted } CustomListItem { title.text: "playbackRate: " + player.playbackRate } CustomListItem { title.text: { switch (player.playbackState) { case Audio.PlayingState: return "playbackState : PlayingState" case Audio.PausedState: return "playbackState : PausedState" case Audio.StoppedState: return "playbackState : StoppedState" default: return "" } } } CustomListItem { title.text: "seekable: " + player.seekable } CustomListItem { title.text: "url: " + String(player.source) } CustomListItem { title.text: "volume: " + player.volume } CustomListItem { title.text: { switch (player.status) { case Audio.NoMedia: return "status: NoMedia" case Audio.Loading: return "status: Loading" case Audio.Loaded: return "status: Loaded" case Audio.Buffering: return "status: Buffering" case Audio.Stalled: return "status: Stalled" case Audio.Buffered: return "status: Buffered" case Audio.EndOfMedia: return "status: EndOfMedia" case Audio.InvalidMedia: return "status: InvalidMedia" case Audio.UnknownStatus: return "status: UnknownStatus" default: return "" } } } } } Row { id: layout1 anchors.bottom: parent.bottom anchors.bottomMargin: units.gu(1) anchors.horizontalCenter: parent.horizontalCenter spacing: units.gu(5) Button { text: "Previous" onClicked: { console.log("Previouse is clicked") var previousIndex = player.playlist.previousIndex(1) console.log("previousIndex: " + player.playlist.previousIndex(1)) if ( previousIndex == -1 ) { player.playlist.currentIndex = player.playlist.itemCount - 1; } else { player.playlist.previous(); } player.play() } } Button { text: "Next" onClicked: { console.log("Next is clicked") var nextIndex = player.playlist.nextIndex(1) console.log("nextIndex: " + nextIndex ) if (nextIndex == -1) { player.playlist.currentIndex = 0 } else { player.playlist.next(); } player.play(); } } } } }
整个的设计还是非常简单.屏幕的上面是一个音乐的列表.下面是一个该音乐文件的状态.由于一些原因,我们目前还不能得到音乐文件的metaData.
我们可以通过点击列表中的像来播放或停止正在播放的音乐.
整个项目的源码在:https://github.com/liu-xiao-guo/playlist-audio
相关文章推荐
- samba服务配置详解
- JAVA学习(4)位运算
- SQL— CONCAT(字符串连接函数)
- 当你前面有两条路时,一定要走最难的那条
- LeetCode 134. Gas Station
- 转弯
- 快速排序的几种优化
- CentOS [缺陷库管理工具JIRA]最新Linux版本jira6.3.6安装汉化破解以及数据迁移
- 中位数计数
- 黑色星期五
- 第二次冲刺阶段站立会议(四)
- [Effective JavaScript 笔记]第20条:使用call方法自定义接收者来调用方法
- Sprint总结
- JQ 点击指定文本框显示div。点击其他区域隐藏DIV
- java的反射机制(转)
- java.lang.NoSuchMethodError: antlr.collections.AST.getLine()I 与org.springframework.transaction
- 科学用百度,拒绝一切推广广告
- sqoop与mysql之间中文乱码
- 计算机组成原理 7
- 移动端touch事件封装