如何使用系統媒體傳輸控制項 (HTML)

發行項
02/12/2016

[ 本文的目標對象是撰寫 Windows 執行階段 App 的 Windows 8.x 和 Windows Phone 8.x 開發人員。如果您正在開發適用於 Windows 10 的 App，請參閱最新文件 ]

SystemMediaTransportControls 類別可讓您的應用程式使用 Windows 提供的系統媒體傳輸控制項，並更新顯示的媒體資訊。

若要在完成的媒體播放範例中查看此功能的運作方式，請參閱媒體播放，從開始到完成。

簡介

SystemMediaTransportControls 類別是在 Windows 8.1 中引進以取代舊 MediaControl 類別。您應該使用新 SystemMediaTransportControls 來取代 MediaControl。

系統傳輸控制項不同於 audio 或 video 物件上的傳輸控制項。系統傳輸控制項是在使用者按下硬體媒體鍵 (例如耳機上的音量控制或鍵盤上的媒體按鈕) 時以快顯方式顯示的控制項。如果使用者按下鍵盤上的暫停鍵且您的應用程式支援 SystemMediaTransportControls，您的應用程式會收到通知，而且您可以採取適當的動作。

您的應用程式也可以更新媒體資訊，例如歌曲標題以及 SystemMediaTransportControls 顯示的縮圖影像。

設定傳輸控制項

若要取得 SystemMediaTransportControls 的執行個體，請呼叫 getForCurrentView。

若要啟用您應用程式將負責處理的按鈕，請在 SystemMediaTransportControls 物件上設定對應的「已啟用」屬性，例如 isPlayEnabled、isPauseEnabled、isNextEnabled 與 isPreviousEnabled。請參閱 SystemMediaTransportControls 參考文件，取得完整清單。

這裡有一些程式碼可用 paused、playing 和 ended 事件的事件處理常式建立 video 物件，並設定 SystemMediaTransportControls。它會啟用播放和暫停按鈕並新增 buttonpressed 事件的事件處理常式。paused、playing 和 ended 的事件處理常式會在本範例的稍後顯示。

<video id="mediaVideo" 
       controls 
       src="https://www.contoso.com/clip.mp4"
       onpause="mediaPaused(event)"
       onplaying="mediaPlaying(event)"
       onended="mediaEnded(event)" />

var systemMediaControls;

systemMediaControls = Windows.Media.SystemMediaTransportControls.getForCurrentView();

systemMediaControls.addEventListener("buttonpressed", systemMediaControlsButtonPressed, false);

systemMediaControls.isPlayEnabled = true;
systemMediaControls.isPauseEnabled = true;
systemMediaControls.isStopEnabled = true;

systemMediaControls.playbackStatus = Windows.Media.MediaPlaybackStatus.closed;

和傳輸控制項通訊

使用傳輸控制項時有三個通訊層面：

當某個啟用的按鈕被按下時，SystemMediaTransportControls 會透過 buttonpressed 事件通知您的應用程式。您的應用程式接著可以控制媒體 (例如暫停或播放)，以回應被按下的按鈕。

當媒體狀態變更時，您的應用程式會透過 SystemMediaTransportControls 屬性通知 SystemMediaTransportControls.playbackStatus。這樣做可以讓傳輸控制項更新按鈕狀態，以便回應媒體來源的狀態。

您可以使用 SystemMediaTransportControlsDisplayUpdater 來更新傳輸控制項顯示的媒體資訊，例如歌曲標題或專輯封面。

處理按下按鈕

當某個啟用的按鈕被按下時，系統傳輸控制項會引發 buttonpressed 事件。 button 屬性事件引數會指定按下的按鈕。

以下部分程式碼會建立 buttonpressed 事件處理常式和協助程式方法，以播放和暫停 video。

// Event handler for SystemMediaTransportControls' buttonpressed event
function systemMediaControlsButtonPressed(eventIn) {

    var mediaButton = Windows.Media.SystemMediaTransportControlsButton;

    switch (eventIn.button) {
        case mediaButton.play:
            playMedia();
            break;

        case mediaButton.pause:
            pauseMedia();
            break;

        case mediaButton.stop:
            stopMedia();
            break;

        // Insert additional case statements for other buttons you want to handle
    }
}

// Plays the media.
function playMedia() {
    var media = document.getElementById("mediaVideo");
    media.play();
}

// Pauses the media.
function pauseMedia() {
    var media = document.getElementById("mediaVideo");
    media.pause();
}

// Stops the media.
function stopMedia() {
    var media = document.getElementById("mediaVideo");
    media.pause();
    media.currentTime = 0;
}

更新媒體狀態

若要向 SystemMediaTransportControls 通知媒體已經變更的狀態，請將 playbackStatus 設定成適當的 MediaPlaybackStatus 值。

以下程式碼會處理媒體事件以及更新 SystemMediaTransportControls 的 playbackStatus 屬性。

// The media Play event handler.
function mediaPlaying() {
    // Update the SystemMediaTransportControl state.
    systemMediaControls.playbackStatus = Windows.Media.MediaPlaybackStatus.playing;
}

// The media Pause event handler.
function mediaPaused() {
    // Update the SystemMediaTransportControl state.
    systemMediaControls.playbackStatus = Windows.Media.MediaPlaybackStatus.paused;
}

// The media Ended event handler.
function mediaEnded() {
    // Update the SystemMediaTransportControl state.
    systemMediaControls.playbackStatus = Windows.Media.MediaPlaybackStatus.stopped;
}

更新媒體資訊和縮圖

您可以使用 SystemMediaTransportControlsDisplayUpdater 類別來更新傳輸控制項顯示的媒體資訊，例如，歌曲標題或專輯封面。

displayUpdater 屬性是和 SystemMediaTransportControls 關聯的 SystemMediaTransportControlsDisplayUpdater。

在 musicProperties、imageProperties 或 videoProperties 上設定媒體屬性，即可手動更新中繼資料。不過，建議您使用更簡便方法，就是將媒體檔案傳遞給 copyFromFileAsync 方法，該方法會從檔案自動擷取中繼資料與縮圖影像。

設定完所有要顯示的媒體資訊之後，請呼叫 update。呼叫 update 之後，才會更新 UI。

Windows.Storage.StorageFile 和 Windows.Storage.Streams.RandomAccessStreamReference 可在使用媒體資訊時提供有用的靜態方法。

StorageFile

RandomAccessStreamReference

Windows：背景音訊

若要在 Windows 的背景播放音訊，應用程式必須透過將 isPlayEnabled 和 isPauseEnabled 設定成 true，以啟用播放和暫停按鈕。應用程式還必須處理 buttonpressed 事件。如需在 Windows 的背景播放音訊的所有需求相關資訊，請參閱如何在背景播放音訊。

共用方式為