Tutorial de desarrollo de aplicaciones para Windows Phone 7

| enero 13, 2011 |
Tags: , , , , , , , , , , , , , ,

Este es el primer artículo de una serie dedicada al desarrollo de aplicaciones para Windows Phone 7 en Silverlight. Como primer ejemplo vamos a crear una aplicación sencilla de representación de datos y la iremos refinando en sucesivos episodios:

  1. Aplicación base: representación de datos y visionado de vídeos.
  2. Mejoras visuales y navegación
  3. Guardar el estado (tombstoning)
  4. Mejoras de rendimiento
  5. Interacción con otros servicios
  6. Preparación para el Marketplace

Veremos lo fácil que nos va a resultar realizar la primera versión mientras que el aspecto de la aplicación va a resultar profesional desde el primer momento. Una característica común de las aplicaciones WP7.

Plantillas de proyecto para WP7

Cuando creamos una aplicación en Silverlight para Windows Phone 7 tenemos varias proyectos base donde elegir:

  1. Aplicación Windows Phone: nos da una pantalla con un título donde podemos empezar a crear nuestra aplicación desde cero. Aunque sea la primera opción que tenemos es la más cruda de todas, yo recomiendo no empezar por aquí.
  2. Una aplicación conectada a datos: en este caso nos proporcionan dos pantallas, una principal y otra de detalle. Es conectada a datos al modo de WP7, es decir, no esperéis un sql compact o algo parecido, WP7 está pensado para consumir datos de la nube, así que los datos se obtendrán inicialmente a través de la conexión de red.
  3. Un Panorama: que nos permite crear una aplicación que ocupa una región más grande que la pantalla con una imagen de fondo común. Es el proyecto más vistoso de todos y el que se suele usar de base para casi todas las aplicaciones básicas del WP7: contactos, imágenes, marketplace, etc….
  4. Un Pivot: la versión WP7 de lo que sería una página con tabs, se usa por ejemplo para el cliente de correo o para las pantallas de configuración.

La aplicación

La idea es crear una aplicación que nos de una vista de noticias, artículos y vídeos recientes, tal como sería para un canal de noticias cualquiera. Para el ejemplo voy a usar las fuentes RSS que hay en MSDN España y así estaremos al día en últimas tecnologías.

Para ello vamos a crear una aplicación tipo Panorama, pues es la más adecuada ya que nos da un patrón de diferentes vistas conectadas a una fuente de datos. Vamos a empezar creando un nuevo proyecto del tipo "Windows Phone Panorama Application"

c5a5c image thumb Tutorial de desarrollo de aplicaciones para Windows Phone 7

La plantilla nos creará un proyecto con datos de ejemplo para que veamos en la lista de diseño cómo quedará la aplicación. El esquema de los datos está definido como la clase ItemViewModel dentro de la carpeta ViewModels y también tenemos el MainViewModel donde tenemos la colección de datos que vamos a mostrar.

Dentro del proyecto que nos crea la plantilla Panorama tenemos ejemplos de cómo representar los datos, la manera más sencilla: una listbox que enlazaremos a la colección de datos que tenemos en el ViewModel.

Para nuestro caso vamos a borrar ItemViewModel generado, pues vamos a crear nuestras propias clases para representar las fuentes RSS y borraremos el contenido de MainViewModel, donde luego escribiremos el código para recuperar los datos. Las fuentes de datos que vamos a utilizar son fuentes disponibles públicamente. Son las mismas que podemos usar desde cualquier lector de feeds o como fuente de datos para nuestros mashups. Para el ejemplo, como ya he dicho antes, usaremos las fuentes de MSDN España, una de vídeos y otras dos de texto:

Leave a Reply