Ejercicio 18 – Video
Realizaremos una app que nos mostrará un video con el que podremos interactuar desde nuestra interfaz. Para ello vamos a utilizar un componente llamado VideoPlayer que sirve para reproducir un archivo de vídeo.
Reproductor de vídeo es un componente multimedia que reproduce vídeos. Un reproductor de vídeo aparece en su aplicación como un rectángulo. Si el usuario pulsa el rectángulo, los controles de los medios de comunicación aparecen: reproducción / pausa, saltar hacia delante y saltar hacia atrás.
Su aplicación puede controlar el comportamiento de la reproducción mediante una llamada al inicio, pausa, e ir a: métodos.
Los archivos de vídeo deberán ser, Windows Media Video (. Wmv), 3GPP (.3 gp), o MPEG-4 (. Mp4). En este ejercicio subiremos a nuestra cuenta de App inventor un archivo .mp4 que se encuentra en nuestra carpeta de Material>Video
App Inventor acepta archivos de vídeo de hasta 1 MB de tamaño y limita el tamaño total de una aplicación de 5 MB. Si sus archivos de medios de comunicación son demasiado grandes, es posible que obtenga errores al empaquetar o instalar su aplicación, en cuyo caso se debe reducir el número de archivos de medios o sus tamaños. Puede utilizar Software de edición de vídeo, como Windows Movie Maker o iMovie de Apple, para reducir el tamaño de los vídeos, acortándolos o volver a codificarlos en formatos más compactos.
La interfaz que vamos a construir es la siguiente:
Como podemos ver los componentes de nuestra aplicación se dividen en dos disposiciones horizontales. La primera es para poner una etiqueta que sirve a modo de título de la app mientras que la segunda son los controles con los que podremos reproducir y parar nuestro video.
Además de un botón que nos permitirá parar el video en un determinado punto con el elemento campo de texto donde pondremos un valor en milisegndos para determinar los segundos de nuestro video. Por ejemplo, si ponemos en este campo 8000 nuestro video se parará en el segundo 8.
Debajo de estos controles colocamos el componente ReproductorVideo
Para colocar nuestro elemento reproductor de video tenemos que seleccionar de la paleta de Componentes de App inventor el llamado ReproductorVideo:
Desde nuestra carpeta de Material buscamos el archivo Trailer20segundos la descargamos a nuestro ordenador y subimos a la aplicación a través de la opción Origen dentro de las propiedades del Reproductor.
Una vez diseñada nuestra interfaz pasaremos a programar nuestra aplicación, para ello abrimos el visor de bloques y construimos las siguientes líneas:
Quedando así nuestras líneas
Repetimos el procedimiento, pero ahora con el botón de Stop
Por último, escribiremos el comportamiento del botón Buscar a: