Qt Quick multimedia - music and video

MediaPlayer is provided QML core multimedia class, you can play audio and video. To use the MediaPlayer, need to introduce QtMultimedia module, adding "import QtMultimedia 5.0" QML statement at the beginning of the document. The MediaPlayer is the spokesman for QML Qt C ++ Multimedia framework QML environment, if you create a project with Qt QuickApp as a template, you also need to add statements in the pro file: QT += multimedia.


First, play music

Look at the simplest example of playing music, simple_music.qml, on a dozen lines of code:

import QtQuick 2.2
import QtMultimedia 5.0
Rectangle {
    width: 200;
    height: 100;

    MediaPlayer {
        autoPlay: true;
        source: "wangjie_game_and_dream.mp3";
    }
}

About MediaPlayer, just four lines of code. QML document placed in the same directory corresponding MP3 file, perform "qmlscenesimple_music.qml" command, the music will be sounded.

In this simple example, source attribute specifies the file to be played, it is the type url, it accepts absolute path, relative path, valid http link. autoPlay property is set to true, indicates the MediaPlayer object is created to start playing immediately. If you feel immediately start playing not very good, you can also call the MediaPlayer you think of the right time to play () method.

If you want to know the length of the music, visit duration property, which is an integer value, in milliseconds, to achieve onDurationChanged signal processor, it can take a long time to.

If you want to know the play progress, you can access the position property, which is an integer value, in milliseconds, to achieve a onPositionChanged signal processor, it can display real-time progress.

Call the pause () method to pause playback, call the stop () method to stop playing. While playing state changes, will be issued playbackStateChanged () signal within onPlaybackStateChanged signal processor can read playbackState enumerated type attribute, which takes MediaPlayer.PlayingState, MediaPlayer.PausedState, MediaPlayer. StoppedState a three values.

seekable attribute indicates whether the media support seek, when it is true, you can call seek (offset) method to locate the broadcast. Parameter offset is an offset relative to the current position, in milliseconds. Note that the operation may be asynchronous, when the method returns the position property will not necessarily immediately become new.

Mute can be read by imited attribute set, reading volume by volume property set.

Well, so many common operations, now let's build a more feature-rich simple music player. (Also you need to use FlatButton, its qml file content, lack of space is not posted.) Simple_music_player.qml contents are as follows:

import QtQuick 2.2
import QtMultimedia 5.0
Rectangle {
    width: 320;
    height: 240;
    color: "black";

    property var utilDate: new Date();

    function msecs2String(msecs){
        utilDate.setTime(msecs);
        return Qt.formatTime(utilDate, "mm:ss");
    }

    MediaPlayer {
        id: player;
        source: "wangjie_game_and_dream.mp3";
        onPositionChanged: {
            progress.text = msecs2String(position) + progress.sDuration;
        }
        onDurationChanged: {
            progress.sDuration = " / " + msecs2String(duration);
        }
        onPlaybackStateChanged: {
            switch(playbackState){
            case MediaPlayer.PlayingState:
                state.text = "播放中";
                break;
            case MediaPlayer.PausedState:
                state.text = "已暂停";
                break;
            case MediaPlayer.StoppedState:
                state.text = "停止";
                break;
            }
        }
        onStatusChanged: {
            switch(status){
            case MediaPlayer.Loaded:
                console.log(metaData.albumArtist, metaData.albumTitle, metaData.author, metaData.channelCount);
                break;
            }
        }
    }

    Row {
        id: controller;
        anchors.top: parent.verticalCenter;
        anchors.horizontalCenter: parent.horizontalCenter;
        anchors.topMargin: 4;
        spacing: 4;
        FlatButton {
            width: 50;
            height: 50;
            iconSource: "ic_rew.png";
            onClicked: if(player.seekable)player.seek(player.position - 5000);
        }
        FlatButton {
            width: 50;
            height: 50;
            iconSource: "ic_pause.png";
            onClicked: player.pause();
        }
        FlatButton {
            width: 50;
            height: 50;
            iconSource: "ic_play.png";
            onClicked: player.play();
        }
        FlatButton {
            width: 50;
            height: 50;
            iconSource: "ic_stop.png";
            onClicked: player.stop();
        }
        FlatButton {
            width: 50;
            height: 50;
            iconSource: "ic_ff.png";
            onClicked: if(player.seekable)player.seek(player.position + 5000);
        }
    }
    Text {
        id: progress;
        anchors.left: controller.left;
        anchors.bottom: controller.top;
        anchors.bottomMargin: 4;
        color: "white";
        font.pointSize: 12;
        property string sDuration;
    }
    Text {
        id: state;
        anchors.left: progress.left;
        anchors.bottom: progress.top;
        anchors.bottomMargin: 4;
        color: "white";
        font.pointSize: 12;
    }
    Text {
        id: metaInfo;
        anchors.left: state.left;
        anchors.bottom: state.top;
        anchors.bottomMargin: 4;
        color: "blue";
        font.pointSize: 14;
    }
}

Use qmlscene loading simple_music_player.qml, results as shown in FIG.


This version of the player is still very simple, can only play a built-in file, nor can drag the progress bar, but MediaPlayer common interfaces uses. Those things on the screen, a playlist that thing, you can add to the mix on this basis, to find some beautiful pictures, you can create a cool music player up.


Second, play video

Playing video a little more complex than some of the music, you need VideoOutput elements with MediaPlayer. VideoOutput used to render video, can be used as a camera viewfinder (preview window), the simplest usage is that you only need to point to its source property to a MediaPlayer object. simple_video.qml demonstrates how to play a local video:

import QtQuick 2.2
import QtMultimedia 5.0
Rectangle {
    width: 720;
    height: 480;

    MediaPlayer {
        id: player;
        source: "D:/game/helloMv/3D1.mp4";

        onError: {
            console.log(errorString);
        }
    }

    VideoOutput {
        anchors.fill: parent;
        source: player;
    }

    MouseArea {
        anchors.fill: parent;
        onClicked: {
            console.log("call play");
            player.play();
        }
    }
}

As you can see, compared to the example of audio video, just one more VideoOutput object whose source property for the player. When left-click with the mouse, call the play () to play the video.

If you use qmlscene load simple_video.qml on the Windows platform, you may not be able to play, make sure your system is installed DirectShow Filter required for the job. If you can not play, you can try to install LAV Filters (please find the degree of your mother you want to download, you can install pro-test, arranged at random). LAV Filters are a group of ffmpeg based on DirectShow splitter and audio and video decoder, supports most common audio and video formats.

Below is played renderings:


Control video playback, such as pause, stop, positioning, and music, not much to say. Next we look at how to get meta-information multimedia.


Third, multimedia meta information

What multimedia meta information? Is outside the media, the media description information for those, such as a song, album release date, the artist, the sampling rate is meta information; and if a video resolution, encoding format, frame rate, etc., is meta information .

MediaPlayer object has a group attribute metaData, which contains information on all aspects of the yuan, by accessing it, you can discover the media description. But then, these looks beautiful meta information may not be available Oh, it depends on whether the use of the underlying MediaPlayer player able to provide these services. If you need this information, so you can get: in onStatusChanged signal processor, the read status property when its value MediaPlayer.Loaded, access to the information you want. Like this:

MediaPlayer {
        id: player;
        source: "wangjie_game_and_dream.mp3";
    
        onStatusChanged: {
           switch(status){
               case MediaPlayer.Loaded:
                 console.log(metaData.albumArtist,
                             metaData.albumTitle,
                             metaData.author, metaData.channelCount);
                 break;
           }
    }        
}

I use MP3 files, can only take this information to channelCount, output is 2, indicating a two-channel. If you want to know more details multimedia meta information, see the documentation in Qt MediaPlayer help.


This section of the code, please go to github - multimedia to download.


reference:

"Qt Quick core programming" Chapter 14


Guess you like

Origin www.cnblogs.com/linuxAndMcu/p/11986616.html