メディアプレーヤー

Qt Quick を使用してオーディオとビデオを再生します。

この例では、さまざまなコーデックを使用してオーディオとビデオファイルを再生できる、シンプルなマルチメディアプレーヤーをデモします。

サンプルを実行する

Qt Creator からサンプルを実行するには、Welcome モードを開き、Examples からサンプルを選択します。詳細については、Building and Running an Example を参照してください。

プロジェクトの構造

このアプリケーションのアーキテクチャは、3つのカスタムQMLモジュールで構成されています：

MediaControl
MediaPlayer
Config

これはトップレベルのCMakeLists.txt ファイルにも反映されています：

add_subdirectory(MediaPlayer)
add_subdirectory(MediaControls)
add_subdirectory(Config)

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

各QMLモジュールはqt_add_qml_moduleマクロを使って作成されます。

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 アプリケーション

Qt QuickアプリケーションはQMLアプリケーションです。このドキュメントでは、この例がQt Multimedia QML Types をどのように利用するかに焦点を当てています。

カスタムConfig QMLモジュール

このモジュールはアプリケーションのテーマやレイアウトを制御します。

インスタンス化するのは一度だけでよく、コピーを作成するのはリソースの無駄です。

というのも、インスタンス化するのは一度だけでよく、コピーを作成するのはリソースの無駄だからだ。Config.qml

pragma Singleton

次に、Config ディレクトリに、qmldir という名前の qmldir ファイルを作成する：

module Config
singleton Config 1.0 Config.qml

このQMLをアプリケーションで使用するために、MediaPlayer のMain.qmlファイルでどのように参照されているかを見てみましょう：

    color: Config.mainColor

カスタムMediaControls QMLモジュール

このモジュールは、アプリケーションのコントロールを定義するために使用されるすべての型を保持します：

AudioControl.qml
ControlImages.qml
CustomButton.qml
CustomRadioButton.qml
CustomSlider.qml
再生コントロール（PlaybackControl）.qml
再生レートコントロール（PlaybackRateControl）.qml
再生シークコントロール（PlaybackSeekControl）.qml

これらのコントロールの実装方法の詳細については、各タイプの定義ファイルを参照してください。これらは、QML Media Player Exampleのコントロールを発展させたものです。

カスタム`MediaPlayer` QMLモジュール

このモジュールにはMain.qmlファイルがあり、アプリケーションのトップレベルの型のほとんどを宣言し、Qt MultimediaMediaPlayer 、VideoOutput QML型を宣言しています。

    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()
            }
        }
    }

このモジュールには、ファイル情報の取得や表示、ファイルピッカーの呼び出しに使用されるその他のカスタム型が含まれています。

エラーポップアップ.qml
画像.qml
メタデータ情報.qml
PlayerMenuBar.qml
プレイリスト情報(PlaylistInfo).qml
設定情報（SettingsInfo.qml
テーマ情報（ThemeInfo.qml
TouchMenu.qml
トラック情報（TracksInfo.qml
トラックオプション（TracksOptions.qml
UrlPopup.qml

各タイプの実装方法の詳細については、各タイプの定義ファイルを参照してください。QML Media Player Exampleにあるものを発展させたものもあります。

新しい機能

このサンプルアプリケーションには、PlaylistInfo やThemeInfo のような型によって実装された新しい機能があります。これらの実装方法の詳細については、それぞれの.qmlファイルを参照してください。

サンプルプロジェクト @ code.qt.io

©2024 The Qt Company Ltd. 本書に含まれるドキュメントの著作権は、それぞれの所有者に帰属します。ここで提供されるドキュメントは、Free Software Foundation が発行したGNU Free Documentation License version 1.3に基づいてライセンスされています。 Qtおよびそれぞれのロゴは、フィンランドおよびその他の国におけるThe Qt Company Ltd.の商標です。その他すべての商標は、それぞれの所有者に帰属します。