Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Windows Phone
Code

Windows Phone 8: trabajo con contenido multimedia

by
Difficulty:BeginnerLength:ShortLanguages:
This post is part of a series called Getting Started with Windows Phone 8.
Windows Phone 8: Events and Navigation
Windows Phone 8: Pivot And Panorama

Spanish (Español) translation by Rolando Gonzalez (you can also view the original English article)

No podemos imaginar una aplicación móvil sin contenido multimedia, como imágenes y sonido. Contenido de multimedia es clave para muchas aplicaciones. En este tutorial, voy a estar mostrando cómo insertar imágenes y habilitar reproducción de audio en una aplicación de Windows Phone.

1. Trabajando con imágenes

Prácticamente todas las aplicaciones Windows Phone contienen una o más imágenes. Imagínense una aplicación sin ilustraciones, sólo texto. Eso no sería muy agradable en términos de usuario. Por eso es importante que aprendamos cómo agregar, utilizar y manipular imágenes en una aplicación de Windows Phone.

Al igual que en los tutoriales anteriores, empezamos por crear un nuevo proyecto de Windows Phone. Para añadir una imagen a la aplicación, cambie la Toolbox (Caja de herramientas) en Visual Studio y agregue un control de Image (Imagen) a la vista de diseño. Puede cambiar el tamaño del control de imagen que se adaptarse a tus necesidades.

El próximo paso es rellenar el control de imagen con una imagen real. Vamos a mostrar una imagen que forma parte de todos los proyectos de Windows Phone. Abra la carpeta Assets (Activos) en el Solution Explorer (Explorador de Soluciones) del proyecto y localice la subcarpeta Tile. Debería contener un puñado de imágenes que podemos utilizar en nuestra aplicación. La imagen que vamos a utilizar se llama FlipCycleTileLarge.png.

Tenemos que decirle al control de imagen donde se puede encontrar esta imagen especificando la ruta relativa de la imagen. Un control de imagen tiene una propiedad Source para este propósito. El siguiente fragmento de código muestra cómo se puede hacer esto usando XAML. Por ahora esto te debe ser familiar.

Después de establecer la propiedad Source del control de Imagen, la vista de diseño debería actualizarse, mostrando la imagen que ha establecido. Hay muchas otras maneras en las que podemos personalizar el control de la imagen, como darle un borde. Siéntase libre de jugar con el control de imagen para averiguar qué otras propiedades puedes establecer para personalizarlo.

2. Trabajando con audio

Se dará cuenta que la reproducción de audio es muy fácil también. Antes de mostrar cómo reproducir audio en tu aplicación, descargue el audio de ejemplo que vamos a utilizar de SoundBible.com y nombralo cat.mp3.

El objetivo es reproducir el sonido cuando el usuario pulsa un botón en la página principal de nuestra aplicación. Para agregar el sonido a tu proyecto de Windows Phone, haga clic en la carpeta Assets y seleccione Add Existing Item (Agregar Elemento Existente) en el menú Add (Agregar). Localiza el archivo de sonido y añádelo a tu proyecto.

Agregue un control Button desde el Toolbox a la vista de diseño, debajo de la imagen que hemos creado antes. Cambie el título del botón estableciendo su propiedad Content (Contenido) a "Play Sound“ (Reproducir Sonido) y establece la propiedad del botón Name en "PlaySoundButton". La propiedad Name es particularmente importante, ya que estará disponible para nosotros en la clase correspondiente de C#.

Antes de pasar al siguiente paso, agregue el siguiente fragmento de código en el control Button. Como su nombre lo indica, el fragmento de código describe un MediaElement. Se apunta al archivo de audio que hemos añadido anteriormente a nuestro proyecto.

You should end up with the following result.

Es hora de poner en práctica controlador de eventos del botón. Haga doble clic en el botón que acabamos de crear para navegar a la clase de C# de la página actual, MainPage.cs. Notarás que Visual Studio ya ha creado un controlador de eventos, PlaySoundButton_Click. En el método PlaySoundButton_Click, llamamos Play en el objeto CatSound.

Recuerde que CatSound es el nombre que le dimos al MediaElement hace un momento. Cuando llamamos al método Play en el objeto MediaElement, este último busca en su propiedad Source para averiguar lo que necesita reproducir.

Eso es lo fácil que es reproducir audio en una aplicación de Windows Phone. Ejecute la aplicación para probarlo.

Conclusión

En este tutorial, has aprendido a mostrar imágenes con el control de la imagen y como reproducir audio mediante el control MediaElement. Hay mucho más que puede hacer con el control MediaElement, como la reproducción de vídeo. Te animo a navegar por la documentation para obtener más información acerca de estas características.

¡Sé el primero en conocer las nuevas traducciones–sigue @tutsplus_es en Twitter!

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.