Поделиться через


Краткое руководство: добавление звука в приложение (HTML)

[ Эта статья адресована разработчикам приложений среды выполнения Windows для Windows 8.x и Windows Phone 8.x. В случае разработки приложений для Windows 10 см. раздел последняя документация]

В этом разделе мы разъясним категории потоковой передачи звука и продемонстрируем использование тега <audio> для добавления возможностей потоковой передачи звука в ваше приложение.

Операционная система Windows 8 предоставила платформу, которая позволяет с относительной легкостью добавлять возможности потоковой передачи звука в приложения Магазина Windows средствами HTML5.

Тег <audio> имеет следующие атрибуты:

Атрибут Допустимые значения Описание
autoplay autoplay Указывает, что воспроизведение звука начнется сразу по готовности
controls controls Указывает, что следует показать элементы управления аудио (например, кнопку воспроизведения и паузы).
loop loop Указывает, что звук будет воспроизводиться сначала, как только воспроизведение закончится
preload

auto

metadata

none

Указывает, считает ли автор нужным загружать звук при загрузке страницы, и если да, то каким образом
src <путь к файлу> Задает путь к звуковому файлу

 

Microsoft предоставляет дополнительный атрибут, msAudioCategory, с помощью которого можно обогатить возможности приложения с поддержкой звука. В следующей таблице приведены допустимые значения этого атрибута, а также краткие описания смысла этих значений.

Категория потока Описание Фоновый режим
Alert Закольцованные или длительные звуки оповещения:
  • Будильники
  • Мелодии звонка
  • Уведомление о звонке
  • Звуки, которые должны приглушать воспроизводимый звук
Нет
BackgroundCapableMedia Для звуков, которые должны продолжать воспроизводиться в фоновом режиме. В качестве примеров можно привести следующие сценарии воспроизведения локального мультимедиа:
  • Локальный список воспроизведения
  • Потоковое радио
  • Потоковый список воспроизведения
  • Музыкальные видео
  • Потоковое аудио или радио, YouTube, Netflix и т. д.
Да
Communications Для потоковой аудиосвязи, в том числе:
  • VOIP;
  • разговора в реальном времени или других типов телефонных звонков.
Да
ForeGroundOnlyMedia Игры или другие звуки, которые рассчитаны на воспроизведение только на переднем плане и будут приводить к отключению фоновых звуков мультимедиа.
  • Принципиально необходимый игровой звук (танцевальные или музыкальные игры)
  • Художественные фильмы (которые должны приостанавливаться, когда переходят в фоновый режим)
Нет
GameEffects Звуковые эффекты в играх, которые должны микшироваться с другими воспроизводимыми звуками
  • Речь персонажей
  • Все звуки, кроме музыки
Нет
GameMedia Фоновая музыка в игре Нет
SoundEffects Звуковые эффекты в играх и других программах, которые должны микшироваться с другими воспроизводимыми звуками:
  • речь персонажей
  • гудки, звуки колокольчика, другие короткие звуки.
Нет
Other Тип звука по умолчанию, который рекомендуется выбирать для всего звукового мультимедиа, которое не требует фонового воспроизведения. Нет

 

Цель: Добавление в приложение Магазина Windows возможности передачи звука самым простым методом

Необходимые условия

Необходимо знать HTML, JavaScript и уметь обращаться с событиями Windows и обработкой событий.

У вас должен быть установлен проигрыватель мультимедиа, который может воспроизводить файлы формата MP3 или другие музыкальные файлы с цифровым кодированием.

Время для завершения: 15 мин.

Инструкции

Добавление звука с помощью тега <audio>

При добавлении тега <audio> используйте атрибут "controls", чтобы обозначить необходимость отображения элементов управления (кнопок). Ниже описывается, как это сделать.

  • Скопируйте и вставьте приведенный ниже код в то место HTML-файла , где должны отображаться элементы управления звуком:

    // Adding the <audio> tag to your app
    <audio controls="controls"> 
    <source src="song.mp3"/> 
    </audio>
    

Добавление атрибута msAudioCategory

Добавив атрибут msAudioCategory к тегу <audio>, вы можете расширить функциональные возможности вашего приложения. Атрибут msAudioCategory связывает некоторые усовершенствованные возможности с тегом <audio>, повышая тем самым качество взаимодействия приложения с пользователем. Ниже описывается процедура добавления атрибута msAudioCategory.

  • Добавьте атрибут msAudioCategory в тег <audio>, как показано здесь:

    // Enhancing behavior of audio tag
    // with the msAudioCategory attribute
    <audio msAudioCategory="BackgroundCapableMedia" controls="controls"> 
    <source src="song.mp3"/> 
    </audio>
    

Краткая сводка и дальнейшие действия

Следует очень внимательно подходить к выбору категории для потока, поскольку в каждом случае ваше приложение будет реагировать по-разному.

В следующем разделе, Настройка клавиш для элементов управления мультимедиа, показано, как добавлять и настраивать кнопки управления мультимедиа в приложении Магазина Windows. Эти кнопки можно использовать для воспроизведения звукового потока, его приостановки, остановки или перемотки вперед.

Связанные разделы

Настройка клавиш для элементов управления мультимедиа

Пример настройки клавиш для элементов управления мультимедиа

Пример диспетчера воспроизведения