Programar aplicaciones Metro en Windows 8: herramientas

Programar aplicaciones Metro en Windows 8: herramientas
Facebook Twitter Flipboard E-mail

Las herramientas principales con las que se va a poder crear Aplicaciones Metro son los dos productos principales para el desarrollo y diseño de software que Microsoft lleva años ofreciendo a desarrolladores y diseñadores: Visual Studio y Blend.

Visual Studio 2012

Visual Studio es un producto maduro que lleva siendo la herramienta para el desarrollo de software con tecnologías de Microsoft desde hace muchos años. En esta nueva versión, como no podía ser de otro modo, de crear Aplicaciones Metro con cualquiera de los lenguajes de programación que hemos visto en puntos anteriores.

Como en anteriores ediciones, Visual Studio 2012 no será una única aplicación, sino una familia con distintas configuraciones y distintos precios que se adapta a las necesidades del desarrollador. Tendremos desde la versión Express, gratuita y suficiente para la creación de Aplicaciones Metro, hasta la versión Ultimate con los últimos adelantos en modelado y arquitectura, pruebas, depuración, etc. En cualquier caso, durante un tiempo tendremos la posibilidad de utilizar la versión Ultimate de forma totalmente gratis, por lo que puede ser una oportunidad para conocer la versión más potente de la gama y conocer sus posibilidades.

En cuanto a las novedades que presenta VS 2012 con respecto a la edición anterior, son muy numerosas, por lo que destacaremos las tres más relevantes.

Interfaz Metro

Quizás la novedad más impactante a primera vista es el profundo rediseño que se ha hecho de la interfaz gráfica de Visual Studio. El estilo continuista que habíamos visto desde Visual Studio 2005 a Visual Studio 2010 se rompe completamente en esta nueva versión, haciendo una metroficación del IDE.

Esta redefinición a la Metro empieza con la simplificación de la interfaz, reduciendo líneas, iconos y, en general, dando paso a un aspecto mucho más minimalista que en versiones anteriores. Se abre paso, como en otras aplicaciones con estilo Metro, el espacio y la jerarquía de tipografías para darle forma a las ventanas y su contenido.

También se ha producido un cambio drástico en la iconografía, puesto que se han sustituido todos los iconos por versiones Metro de los mismos, más planos y más esquematizados. Para algunos desarrolladores acostumbrados a versiones anteriores de VS esto puede resultar un problema en una primera toma de contacto, pero el período de adaptación es menor que la diferencia con lo existente hasta ahora nos pudiera hacer pensar.

IntelliSense en JavaScript

IntelliSense es un sistema de ayuda contextual que facilita la programación al ofrecer información en línea sobre APIs, métodos, parámetros y sus tipos, resultados, excepciones, etc. Gracias a este sistema el desarrollador se evita tener que memorizar las APIs, al tiempo que facilita que el código se escriba correctamente a la primera, reduciendo errores de compilación.

Con Visual Studio 2012 este sistema aterriza en el JavaScript que usaremos para programar Aplicaciones Metro. En la siguiente imagen podemos ver un ejemplo de su uso, mostrando los métodos en el espacio de nombres WinJS, así como una pequeña explicación del que tenemos seleccionado.

Plantillas de proyecto

Con Visual Studio 2012 vamos a tener de serie una serie de plantillas de proyecto de Aplicación Metro con HTML/JS que nos van a minimizar la curva de aprendizaje de esta nueva tecnología. Las plantillas con las que contaremos son:

  • Blank App: esta plantilla crea un proyecto con una única página, la que cargará por defecto el sistema operativo al lanzar la aplicación. Puede ser un buen ejemplo para conocer los ficheros mínimos que todo proyecto de Aplicación Metro necesita.

  • Grid App: la más completa de todas las plantillas, muestra ítems de información agrupados. Se compone de tres páginas, una para mostrar un resumen general de información, otra para mostrar información específica de cada grupo y una tercera para mostrar información detallada de cada ítem.

  • Split App: esta plantilla define un proyecto con dos páginas, una para mostrar grupos de información y otra para mostrar los elementos de cada grupo.

  • Fixed Layout App: similar a Blank App, crea una aplicación con un layout fijo, a diferencia de las anteriores que lo crean de tipo adaptativo. Esta plantilla está pensada para juegos.

  • Navigation App: esta plantilla es un ejemplo básico del tipo de navegación que se debe utilizar con Aplicaciones Metro.

En función del tipo de proyecto elegiremos una plantilla u otra, así como la forma en que prefiramos empezar a crear Aplicaciones Metro: partiendo de una versión mínima (Blank App) o con una aplicación ejecutable que queramos modificar para adaptar a nuestro escenario (Grid App o Split App).

Blend for Visual Studio

La otra herramienta que vamos a necesitar tener siempre a mano para crear Aplicaciones Metro es Blend for Visual Studio. Hasta ahora esta herramienta de diseño se había utilizado para crear, fundamentalmente, aplicaciones con interfaz gráfica basada en XAML.

Sin embargo con el lanzamiento de las nuevas Aplicaciones Metro para Windows 8 se ha creado una nueva versión de la herramienta que ofrece un completo soporte para la creación de interfaces basadas en HTML5 y CSS3. Entre las posibilidades que nos ofrece Blend para la creación de interfaces con estos lenguajes tenemos:

  • Diseño visual, de tipo WYSIWYG (What You See Is What You Get), además de permitir emular distintos tamaños y orientación del dispositivo para el que estamos creando la aplicación.

  • Modo interactivo, que permite ejecutar la aplicación dentro de Blend para poder diseñar para ciertos estados a los que sólo se llega en tiempo de ejecución.

  • Arrastrar y soltar de controles y propiedades.

  • Potente generación de código a partir de los elementos que se ha añaden visualmente.

  • Depuración de HTML y CSS.

En definitiva, Blend es más que un simple diseñador de interfaces. Es una potente herramienta que nos permitirá definir cada aspecto de la interfaz gráfica, desde su estilo a parte de su comportamiento ante circunstancias como cambios de orientación o tamaño de ventana.

Más información | Visual Studio 2012, Blend for Visual Studio
En Genbeta Dev | Programar aplicaciones Metro en Windows 8

Avatar de Javier Holguera

Javier Holguera es desarrollador en Payvision y lleva más de 5 años trabajando con tecnologías de Microsoft en una gran variedad de proyectos.

Es especialista en metodologías ágiles y en estándares web relacionado con HTML5. Es miembro activo de la comunidad .NET a través de MADNUG y colabora con medios como DotNetMania, PC Actual o Desarrolloweb.com.

Puedes seguirle en Twitter: @javierholguera o en su blog: javierholguera.com


Comentarios cerrados
Inicio