Media Player

Dieses Beispiel zeigt eine QML-Anwendung, die Audio- und Videodateien mit verschiedenen Codecs abspielen kann.

Ausführen des Beispiels

Sie können das Beispiel wie folgt ausführen:

• Qt Creator

  Öffnen Sie den Modus „ Welcome “ und wählen Sie das Beispiel unter „ Examples “ aus. Weitere Informationen finden Sie unter Qt Creator: Tutorial: Erstellen und Ausführen.

• Qt Extension for Visual Studio Code

  Führen Sie den Befehl „ Qt: Open Qt examples “ über „ Command Palette “ aus und wählen Sie das Beispiel aus der Liste aus. Weitere Informationen finden Sie unter Qt Extension for Visual Studio Code: Tutorial: Erstellen und Ausführen.

Projektstruktur

Die Architektur dieser Anwendung besteht aus drei benutzerdefinierten QML-Modulen:

• MediaControl
• MediaPlayer
• Config

Dies spiegelt sich auch in der obersten „ CMakeLists.txt “-Datei wider:

add_subdirectory(MediaPlayer)

target_link_libraries(MediaPlayerApp PRIVATE
    Qt6::Core
    Qt6::Svg
    Qt6::Quick
    Qt6::Multimedia
    MediaControlsplugin
    MediaPlayerplugin
    Configplugin

Jedes QML-Modul wird mit dem Makro ` qt_add_qml_module ` erstellt; sehen Sie sich beispielsweise an, wie das Modul „Config“ erstellt wird.

qt_add_library(Config STATIC)

set_source_files_properties(Config.qml
    PROPERTIES
        QT_QML_SINGLETON_TYPE true
)

qt_add_qml_module(Config
    URI "Config"
    OUTPUT_DIRECTORY Config
    QML_FILES
        "Config.qml"
)

Qt Quick Anwendung

Im Kern handelt es sich hierbei um eine QML-Anwendung; spezifische Informationen hierzu finden Sie unter „Erste Schritte mit Qt Quick: Eine Alarm-Anwendung “. Diese Dokumentation konzentriert sich darauf, wie dieses Beispiel die Qt Multimedia QML Types.

Das benutzerdefinierte QML-Modul „Config“

Dieser Typ steuert je nach Zielbetriebssystem die Designs und Layouts einer Anwendung.

Zunächst deklarieren wir es als Singleton, da es nur einmal instanziiert werden muss und das Erstellen von Kopien eine Verschwendung von Ressourcen wäre.

Dazu fügen wir am Anfang von Config.qml

pragma Singleton

Anschließend erstellen wir im Verzeichnis „ Config “ eine qmldir-Datei mit dem Namen „ qmldir “, die Folgendes enthält:

module Config
singleton Config 1.0 Config.qml

Um es nun in unserer Anwendung zu verwenden, sehen Sie sich an, wie es in der Datei „Main.qml“ im Verzeichnis „ MediaPlayer “ referenziert wird:

    color: Config.mainColor

Das benutzerdefinierte QML-Modul „MediaControls“

Dieses Modul enthält alle Typen, die zur Definition der Steuerelemente der Anwendung verwendet werden, darunter:

• AudioControl.qml
• ControlImages.qml
• CustomButton.qml
• CustomRadioButton.qml
• CustomSlider.qml
• Wiedergabesteuerung.qml
• Wiedergabegeschwindigkeitssteuerung.qml
• PlaybackSeekControl.qml

Einzelheiten zur Implementierung dieser Steuerelemente finden Sie in den jeweiligen Definitionsdateien der einzelnen Typen. Sie stellen eine Weiterentwicklung der Steuerelemente aus dem QML-Media-Player-Beispiel dar.

Das benutzerdefinierte QML-Modul „ MediaPlayer “

Dieses Modul enthält die Datei „Main.qml“, in der die meisten Typen der obersten Ebene für die Anwendung deklariert sind – und vor allem die QML-Typen „ Qt Multimedia “, „ MediaPlayer “ und „ VideoOutput “.

    MediaPlayer {
        id: mediaPlayer

        playbackRate: playbackControl.playbackRate
        videoOutput: videoOutput
        audioOutput: AudioOutput {
            id: audio
            volume: playbackControl.volume
        }
        source: new URL("https://download.qt.io/learning/videos/media-player-example/Qt_LogoMergeEffect.mp4")

        function updateMetadata() {
            root.metadataInfo.clear()
            root.metadataInfo.read(mediaPlayer.metaData)
        }

        onMetaDataChanged: updateMetadata()
        onActiveTracksChanged: updateMetadata()
        onErrorOccurred: {
            errorPopup.errorMsg = mediaPlayer.errorString
            errorPopup.open()
        }
        onTracksChanged: {
            settingsInfo.tracksInfo.selectedAudioTrack = mediaPlayer.activeAudioTrack
            settingsInfo.tracksInfo.selectedVideoTrack = mediaPlayer.activeVideoTrack
            settingsInfo.tracksInfo.selectedSubtitleTrack = mediaPlayer.activeSubtitleTrack
            updateMetadata()
        }

        onMediaStatusChanged: {
            if ((MediaPlayer.EndOfMedia === mediaStatus && mediaPlayer.loops !== MediaPlayer.Infinite) &&
                    ((root.currentFile < playlistInfo.mediaCount - 1) || playlistInfo.isShuffled)) {
                if (!playlistInfo.isShuffled) {
                    ++root.currentFile
                }
                root.playMedia()
            } else if (MediaPlayer.EndOfMedia === mediaStatus && root.playlistLooped && playlistInfo.mediaCount) {
                root.currentFile = 0
                root.playMedia()
            }
        }
    }

    VideoOutput {
        id: videoOutput

        anchors.top: fullScreen || Config.isMobileTarget ? parent.top : menuBar.bottom
        anchors.bottom: fullScreen ? parent.bottom : playbackControl.top
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.leftMargin: fullScreen ? 0 : 20
        anchors.rightMargin: fullScreen ? 0 : 20
        visible: mediaPlayer.hasVideo

        property bool fullScreen: false

        TapHandler {
            onDoubleTapped: {
                if (parent.fullScreen) {
                    root.showNormal()
                } else {
                    root.showFullScreen()
                }
                parent.fullScreen = !parent.fullScreen
            }
            onTapped: {
                root.closeOverlays()
            }
        }
    }

Das Modul enthält außerdem weitere benutzerdefinierte Typen, die zum Abrufen und Anzeigen von Dateiinformationen sowie zum Aufrufen der Dateiauswahl verwendet werden.

• ErrorPopup.qml
• Images.qml
• MetadataInfo.qml
• PlayerMenuBar.qml
• PlaylistInfo.qml
• EinstellungenInfo.qml
• ThemeInfo.qml
• TouchMenu.qml
• Titel-Info.qml
• Titeloptionen.qml
• UrlPopup.qml

Einzelheiten zur Implementierung der Typen finden Sie in den jeweiligen Definitionsdateien der einzelnen Typen. Einige davon sind Weiterentwicklungen der im QML-Media-Player-Beispiel enthaltenen Typen.

Neue Funktionen

Diese Beispielanwendung verfügt über einige neue Funktionen, die über Typen implementiert sind, wie beispielsweise „ PlaylistInfo “ und „ ThemeInfo “. Einzelheiten zur Implementierung finden Sie in den jeweiligen .qml-Dateien.

Quelldateien

Beispielprojekt auf code.qt.io