Aplicaciones de Windows
Contraer la tabla de contenido
Expandir la tabla de contenido

Cómo reproducir audio en segundo plano (aplicaciones de la Tienda Windows con JavaScript y HTML)

En este tutorial se muestra cómo seleccionar la categoría correcta de una secuencia de audio y vídeo (AV) y configurarla para que se reproduzca en segundo plano.

Nota  Si la secuencia de vídeo está correctamente categorizada para reproducirse en segundo plano, entonces cuando el vídeo cambie a modo en segundo plano, podrás oír la parte de audio pero no verás el vídeo que lo acompaña. Esto es por diseño diseño y reduce los requisitos de energía del dispositivo mientras reproduce el vídeo en segundo plano.

Lo que debes saber

Tecnologías

  • Windows en tiempo de ejecución

Requisitos previos

Instrucciones

Paso 1: Hacer una declaración de audio en segundo plano en el manifiesto de la aplicación

  1. Abre el archivo del proyecto de tu aplicación en Microsoft Visual Studio.
  2. Haz doble clic en el archivo Package.appmanifest en el Explorador de soluciones para abrir el cuadro de diálogo Package.appmanifest.
  3. Haz clic en la pestaña Declaraciones, después selecciona Tareas en segundo plano en el cuadro desplegable Declaraciones disponibles.
  4. Haz clic en Agregar, después en la casilla Audio y haz clic en Aceptar.

    Nota  También puedes hacer la declaración de audio en segundo plano agregando el código manualmente. Para hacer la declaración manualmente, agrega el siguiente código entre las etiquetas <Application> y </Application> en el archivo Package.appmanifest:

    
    
    <Extensions>
       <Extension Category="windows.backgroundTasks" StartPage="default.html">
          <BackgroundTasks>
    	         <Task Type="audio" />
          </BackgroundTasks>
       </Extension>
    </Extensions>
    
    

    También puedes hacer una declaración en segundo plano de una secuencia de vídeo usando el mismo archivo de manifiesto que creaste para el audio en los pasos anteriores. Para hacerlo, establece el atributo "Task Type" en audio.

Paso 2: Establecer el atributo msAudioCategory en el valor correcto

  1. En el panel del Explorador de soluciones, haz clic en el archivo HTML para abrirlo. Por ejemplo, si el archivo HTML de tu aplicación se denomina MyApp.htm, haz clic en ese archivo para abrirlo.
  2. Agrega el atributo "msAudioCategory" a la etiqueta <audio> y establece el atributo en Communications o BackgroundCapabaleMedia de la siguiente manera:
    
    <audio msAudioCategory="BackgroundCapableMedia" controls="controls"> 
       <source src="Somesong.mp3"/> 
    </audio>
    
    
    

    Si estás configurando el atributo msAudioCategory de una secuencia de vídeo, usa el siguiente fragmento de código:

    
    
    <video msAudioCategory="BackgroundCapableMedia" controls="controls"> 
       <source src="Somevideo.mp4"/> 
    </video >
    
    
    

Paso 3: Registrarse para controles de transporte multimedia

Aunque una aplicación esté registrada para reproducir música o vídeo en segundo plano, la aplicación debe controlar eventos para los botones de reproducción y pausa. Al proporcionar esta compatibilidad mínima con el control de eventos, permites que el usuario reproduzca o pause la secuencia de música o vídeo en segundo plano sin llevar la aplicación a primer plano.

Para registrar un botón multimedia con tu aplicación, primero debes crear un objeto MediaControl y agregar una escucha de eventos al objeto. Después, el objeto podrá escuchar los eventos que especifiques. También debes definir que se llame a una función para que controle el evento cuando éste se produzca.

  1. En el panel del Explorador de soluciones, haz clic en el archivo JavaScript de tu aplicación para abrirlo. Por ejemplo, si el archivo JavaScript de tu aplicación se denomina MyApp.js, haz clic en ese archivo para abrirlo.
  2. Usa el siguiente código para registrar los botones que alternan entre pausar y reproducir de tu aplicación:
    
    // Declare a variable that you will use as an instance of an object
    var mediaControls;
    
    // Assign the button object to mediaControls
    mediaControls = Windows.Media.MediaControl;
    
    // Add an event listener for the Play, Pause Play/Pause toggle button
    mediaControls.addEventListener("playpausetogglepressed", playpausetoggle, false);
    mediaControls.addEventListener(“playpressed”, playbutton, false);
    mediaControls.addEventListener(“pausepressed”, pausebutton, false);
    
    
    
    
  3. Usa el siguiente código para controlar los eventos que se generan cuando se presionan los botones que alternan entre reproducir y pausar:
    
    // The event handler for the play/pause button
    function playpausetoggle() {
    	 if(mediaControls.isPlaying === true) {
    		      document.getElementById("audiotag").pause();
    	  } else {
    		      document.getElementById("audiotag").play();
    	  }
    }
    
    // The event handler for the pause button
    function pausebutton() {
       document.getElementById("audiotag").pause();
    }
       
    // The event handler for the play button
    function playbutton() {
       document.getElementById("audiotag").play();
    }
    
    
    

Observaciones

Para obtener más información sobre cómo trabajar con controles multimedia, consulta la notas del producto de la Guía para desarrolladores de controles de transporte del sistema.

Nota  Si tienes una aplicación que realiza otras tareas además de transmitir audio y vídeo, entonces, cuando la aplicación pierda foco y ya no sea la ventana activa, debe dejar de realizar trabajos que no estén relacionados con elementos multimedia. La aplicación puede continuar transmitiendo audio y, en el caso de una secuencia de audio-vídeo, la transmisión de vídeo se detendrá automáticamente. Inicio rápido: reproducir vídeo en una aplicación

Ejemplo completo

Para obtener ejemplos completos sobre cómo transmitir audio y vídeo, consulta la muestra de administrador de reproducción y la muestra de reproducción de multimedia HTML.

Temas relacionados

Muestra de reproducción de multimedia HTML
Muestra de administrador de reproducción
Guía para desarrolladores de controles de transporte del sistema
Inicio rápido: Audio en una aplicación de la Tienda Windows
Inicio rápido: vídeo y audio

 

 

Mostrar:
© 2018 Microsoft