如何使用系统媒体传输控件 (HTML)

[ 本文适用于编写 Windows 运行时应用的 Windows 8.x 和 Windows Phone 8.x 开发人员。如果你要针对 Windows 10 进行开发,请参阅 最新文档 ]

SystemMediaTransportControls 类使你的应用可以使用 Windows 提供的系统媒体传输控件,并更新显示的媒体信息。

若要在操作中将此功能作为完整媒体播放示例的一部分进行查看,请参阅媒体播放详细信息

简介

在 Windows 8.1 中引入的 SystemMediaTransportControls 类替代了之前的 MediaControl 类。 你应该使用新的 SystemMediaTransportControls,而不是 MediaControl

系统传输控件不同于 audiovideo 对象上的传输控件。 系统传输控件是在按下硬件媒体键时弹出的控件,例如耳机上的音量控制器,或者键盘上的媒体按钮。如果用户按了键盘上的暂停键,并且你的应用支持 SystemMediaTransportControls,该应用将收到通知,你也可以进行相应操作。

你的应用还可以更新媒体信息,例如 SystemMediaTransportControls 显示的歌曲标题和缩略图。

设置传输控件

要获取 SystemMediaTransportControls 的实例,请调用 getForCurrentView

若要启用你的应用将处理的按钮,请在 SystemMediaTransportControls 对象上设置相应的“已启用”属性,例如 isPlayEnabledisPauseEnabledisNextEnabledisPreviousEnabled。 有关完整列表,请参阅 SystemMediaTransportControls 参考文档。

以下代码可以创建具有用于 pausedplayingended 事件的事件处理程序的 video 对象并设置 SystemMediaTransportControls。它启用了播放和暂停按钮并为 buttonpressed 事件添加了一个事件处理程序。本示例的下文中显示了 pausedplayingended 的事件处理程序。

<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.playbackStatus 属性通知 SystemMediaTransportControls。这使得传输控件能够更新按钮状态,以使它们与媒体源的状态一致。

你可以使用 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 值。

以下代码可以处理媒体事件,并更新 SystemMediaTransportControlsplaybackStatus 属性。

// 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

你可以通过在 musicPropertiesimagePropertiesvideoProperties 上设置媒体属性来手动更新元数据。但是,建议你将媒体文件传递给 copyFromFileAsync 方法,这更加简单,并且该方法将自动提取文件中的元数据和缩略图图像。

当设置了所有要显示的媒体信息时,调用 update。调用 update 之后才会更新 UI。

Windows.Storage.StorageFileWindows.Storage.Streams.RandomAccessStreamReference 提供了用于操作媒体信息的非常有用的静态方法。

StorageFile

RandomAccessStreamReference

Windows:后台音频

要在 Windows 中播放后台音频,应用必须通过将 isPlayEnabledisPauseEnabled 设置为 true 来启用播放和暂停按钮。应用还必须处理 buttonpressed 事件。有关在 Windows 上播放后台音频的所有要求的信息,请参阅如何在后台播放音频