Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Making a Very Small MP3 Player With QML

DZone's Guide to

Making a Very Small MP3 Player With QML

How you create your own music player with just a few lines of code

· IoT Zone
Free Resource

Discover why Bluetooth mesh is the next evolution of IoT solutions. Download the mesh overview.

I’ve been futzing around with QML. Here’s a tiny MP3 player, for a single song in the current directory.

It would be nice if the Mac’s homebrew could install QML for you, but it can’t (yet I guess). Thus, I had to install the QT 5.5 piece manually (via it’s installer at qt.io).

The installer doesn’t make links for commands into /usr/local/bin or similar, so forgive the long path in the shebang line below (line 1):

#!/usr/bin/env /Users/paul/Qt/5.5/clang_64/bin/qml.app/Contents/MacOS/qml

import QtQuick 2.2
import QtMultimedia 5.0

Rectangle {
    width: 200
    height: 100
    property bool playing: false

    Text {
        anchors.centerIn: parent
        // one way binding - neat!
        text: playing ? "Stop music" : "Start music"
    }
    Audio {
        id: playMusic
        source: "MemphisSlim-IJustLandedInYourTown.mp3"
    }    
    MouseArea {
        anchors.fill: parent
        onClicked: {
            if(playing == true) {
                playMusic.stop()
                playing = false
            } else {
                playMusic.play()
                playing = true
            }
        }
    }
}

That’s an elegant syntax IMO. Not ugly bedfellows, like HTML and JavaScript.

The app only plays one song though. If you’re interested, that song is Memphis Slim’s “I Just Landed In Your Town”. Read about it onpublicdomain4u, or grab the song from archive.org

The app on Mac OS X:

I’d like the app to offer a selection of a choice of songs from the current directory. There’s a Repeat{ } structure in QML that looks exactly what I want, but no ability to list files, which is a gaping hole in the API. At least, if there is, I can’t find it, as Google search results are littered with previous versions of QT, and indeed the name for QML isn’t standardized (it is alternately known as QtQuick and QtCreator). I believe the owners of Qt want you to dive off to C++ or a High level language that can bootstrap QML to do heavy lifting like List_the_files_or_subdirectories_in_a_directory. QML in the style that I have it, leverages JavaScript for the programmatic bits (as opposed to declarative).

The NodeJs people had to enhance JavaScript to add a lot more functions to make it usable server-side. For my needs that would be thefile system API. Lo and behold, a Oleg Shparber (trollixx) has done just that with A port of Node.js to QML. That is Linux only though, and only after patching your own build of Qt 5.5 (for now).



Take a deep dive into Bluetooth mesh. Read the tech overview and discover new IoT innovations.

Topics:
qml ,music

Published at DZone with permission of Paul Hammant, DZone MVB. See the original article here.

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}