如何配置媒体控件的密钥 (HTML)(Windows 8)
[ 本文适用于编写 Windows 运行时应用的 Windows 8.x 和 Windows Phone 8.x 开发人员。如果你要针对 Windows 10 进行开发,请参阅 最新文档 ]
本教程介绍如何在键盘上配置硬件媒体键,然后使用配置的键,通过按下或单击播放、暂停等键控制音频视频 (AV) 流。
要点
在 Windows 8.1 中引入的 SystemMediaTransportControls 类替代了之前的 MediaControl 类。 你应该使用新的 SystemMediaTransportControls,而不是 MediaControl。
完成此练习后,你将了解如何配置可操纵 AV 系统的键盘键。
你需要了解的内容
技术
- Windows Runtime
先决条件
- 你应当熟悉 HTML、JavaScript、Windows 事件和事件处理。
- 你必须安装可以播放 MPEG-Layer 3 (MP3) 或其他数字音乐文件的媒体播放机。
说明
步骤 1: 注册按钮按压事件,然后进行处理
MediaButtons 示例配置媒体传输事件。然后通过媒体控制按钮对事件进行侦听,包括频道递增和频道递减按钮。 为响应按钮按压操作,弹出传输控制窗口,以提供视觉反馈,表示已检测到按压事件并进行了处理。
以下是用于注册事件及处理这些事件的 JavaScript 代码:
// Assign the button object to MediaControls MediaControls = Windows.Media.MediaControl; // Add event listeners for the buttons MediaControls.addEventListener(“playpressed”, play, false); MediaControls.addEventListener(“pausepressed”, pause, false); MediaControls.addEventListener(“playpausetogglepressed”, playpausetoggle, false); // Add event listeners for the audio element document.GetElementById(“audiotag”).addEventListener(“playing”, playing, false); document.GetElementById(“audiotag”).addEventListener(“paused”, paused, false); document.GetElementById(“audiotag”).addEventListener(“ended”, ended, false); // Define functions that will be the event handlers function play() { document.getElementById(“audiotag”).play(); } function pause() { document.getElementById(“audiotag”).pause(); } function playpausetoggle() { if(MediaControls.isPlaying === true) { document.getElementById(“audiotag”).pause(); } else { document.getElementById(“audiotag”).play(); } } function playing() { MediaControls.isPlaying = true; } function paused() { MediaControls.isPlaying = false; } function ended() { MediaControls.isPlaying = false; }
步骤 2: 禁用相应的按钮
播放列表的开头没有上一曲目。因此,该示例中,对第一个音频轨禁用了“上一曲目”按钮。同理,播放列表的末尾也没有下一曲目,所以禁用了“下一曲目”按钮。
以下是 JavaScript 代码段,介绍如何通过从 MediaControl 对象删除“上一曲目”和“下一曲目”的事件侦听器,禁用其相应的按钮:
// Assign the button object to MediaControls MediaControls = Windows.Media.MediaControl; … // Disable the previous track button MediaControls.removeEventListener(“previoustrackpressed”, previoustrack); // Disable the next track button MediaControls.removeEventListener(“nexttrackpressed”, nexttrack);
步骤 3: 启用相应的按钮
在第一曲目后,最后一曲目前启用“上一曲目”和“下一曲目”按钮。如果你的播放列表中有三个或更多曲目,则当你的音频应用正在播放除第一个或最后一个曲目以外的曲目时,最好启用“上一曲目”和“下一曲目”按钮。
以下是 JavaScript 代码段,介绍如何通过从 MediaControl 对象添加“上一曲目”和“下一曲目”的事件侦听器,启用其相应的按钮:
// Assign the button object to MediaControls MediaControls = Windows.Media.MediaControl; … // Enable the previous track button MediaControls.addEventListener(“previoustrackpressed”, previoustrack, false); // Enable the next track button MediaControls.addEventListener(“nexttrackpressed”, nexttrack, false);
步骤 4: 运行和测试 CallControl 示例
- 用于构建、运行以及测试此示例的详细说明包含在此示例介绍中。若要查看此示例的构建和其他说明以及查看完整清单,请参阅配置媒体键。
备注
你可使用刚构建和测试的代码,通过创建各个键的事件侦听器和事件处理程序,配置硬件媒体键。为响应按钮按压操作,将在屏幕上弹出传输控制窗口。这允许你检查事件侦听器和处理程序是否运行正常。
如需有关媒体控制按钮支持的其他事件的开发人员指南及详细信息,请参阅开发音频感知应用指南和系统传输控件。