lunes, 6 de agosto de 2012

Construyendo las Vistas a partir de las Vista Modelo para MVVM en Windows Phone

Si recién llegas a este post, recuerda que hace parte de una serie, así que te invito a ponerte al día hasta el post anterior.

Bueno antes de continuar con otra parte divertida de todo esto, definiré cuales funcionalidades implementar en esta etapa para generar un producto pronto (Minimum viable product). Las funciones seleccionadas serán dos: mostrar en línea la lista de post desde un rss y la lista de tweets vía rss, al clickear en cada item navegaremos al explorador con su link asociado. 

Recuerden terminar la meta propuesta en el anterior post, de crear las Vista Modelo propuestas en el UML, antes de continuar.


Aquí les dejo como se vería MainViewModel si seguimos la estructura propuesta como ejemplo en el código autogenerado.


Como ven conserve el método LoadData sugerido en la plantilla. Nos aseguramos que todo compile perfectamente y estamos listos para crear nuestros datos de ejemplo en Expression Blend. Podrá quedar una pequeña "Advertencia" (no error) alertando que los datos de ejemplo no existen, pero lo solucionaremos cuando creemos nuestra propias vistas.

Si no sabes crear los datos de ejemplo te invito a revisar el video de ejemplo que cree para mostrar como se configuran. Debes tener en cuenta es que esta vez no vas a configurar manualmente los campos de los datos de ejemplo, si no que usarás la opción crear datos de ejemplo desde una clase:


Luego de esto se te pedirá que selecciones la clase desde donde se generan los datos de ejemplo y seleccionarás MainViewModel


En la pestaña de datos podras ver la estructura que creaste para esta clase


Y en el árbol de proyectos podrás ver que se volvió a generar el archivo de datos de ejemplo que habiamos borrado en pasos anteriores, pero está vez generó los datos de ejemplo con la estructura que necesitamos.


Recuerden que a diferencia de los datos de ejemplo generados manualmente, los datos generados a partir de una clase, no se ven en tiempo de ejecución a menos que cambiemos manualmente esta configuración.

No olviden guardar antes de regresar a Visual Studio y de aceptar que el proyecto en Visual Studio se recargue para mostrar los cambios hechos en Expression Blend.

Además recuerden que si añaden campos a las clases y quieren que se generen datos de ejemplo deben borrar el archivo de datos de ejemplo y repetir el proceso, esto no alterará en ninguna forma el código, pero en Expression Blend deben vincular los datos de ejemplo a las vistas nuevamente para que se refresque la vista de diseño.

Por lo pronto, si estas siguiendo ordenamente este tutorial el reto es empezar a ensamblar las vistas con los datos de ejemplo que se generaron. Para ello recuerden ver el video de ejemplo. El próximo post de la serie, será un video creando las listas y ensamblando el estilo

El código de la aplicación se está publicando en Github:
https://github.com/soreygarcia/RssReader

Nos vemos la próxima, éxitos con el reto.

Sorey
Publicar un comentario en la entrada