Hello World Windows 8 Metro! (I)

Introducción

Siempre que comenzamos con una nueva tecnología, como en este caso y para Windows 8, WinRT y en su caso Metro, se presta a desarrollar lo que es nuestra primera toma de contacto.

Es casi desde el principio de los tiempos cuando a alguien se le ocurrió la idea de hacer un primer ejemplo en forma de presentación, y para ser educados, un saludo general. De ahí surgió el mítico y famoso Hello World u Hola Mundo en nuestro idioma (ver referencias al final de esta entrada para más detalles).

Esta vez no va a ser menos, así que he decidido adoptar ese mítico ejemplo para desarrollar nuestra primera aplicación Metro y tener así una primera y modesta toma de contacto con Visual Studio 2012 y el desarrollo de aplicaciones de este tipo.

Propósitos

Antes de abordar el ejemplo demostrativo «Hello World Metro«, voy a enumerar los propósitos u objetivos de este ejemplo:

• Creación del proyecto en Visual Studio 2012.
• Conocer las partes principales de un proyecto Windows 8 Metro.
• Trabajo con la capa de presentación (XAML) de un proyecto Windows 8 Metro.
• Generación y uso de eventos en XAML y su correspondiente programación.
• Presentación de un mensaje en pantalla (el típico MessageBox de .NET).
• Posibilidad de cerrar nuestra aplicación a través de un botón.
• Ajustes simples de iconos y diseño para nuestra aplicación.

Como son muchos los propósitos a alcanzar, voy a preparar diferentes entregas.

Iniciaremos obviamente este camino, por lo que es la creación del proyecto en Visual Studio 2012 y la explicación de cada una de las partes de las carpetas y archivos que aparecen en el proyecto.

Creación del proyecto en Visual Studio 2012

Iniciaremos Visual Studio 2012.

Una vez hecho esto, elegiremos para esta ocasión la plantilla de proyecto Blank App del grupo de plantillas Windows Metro Style.

Conocer las partes principales de un proyecto Windows 8 Metro

En el explorador de soluciones, obtendremos un conjunto de carpetas y subcarpetas parecidas a las que se detallan a continuación:

Explicaré a continuación cada una de las carpetas y subcarpetas que aparecen en la imagen anterior.

La carpeta Properties corresponde con la carpeta que contendrá los metadatos de la aplicación. Estos metadatos se almacenarán en el archivo AssemblyInfo.cs (en el caso de C#).

En la carpeta References se indicaremos las referencias utilizadas en el proyecto.

En la carpeta Assets indicaremos por su parte las imágenes de la aplicación que aparecerán al iniciar nuestra aplicación o en el icono de instalación de la aplicación en Windows 8, etc.

La carpeta Common está reservada para aquellas partes comunes a la aplicación. Por ejemplo, allí encontraremos por defecto el fichero StandardStyles.xaml que contendrá las plantillas y estilos predeterminados a utilizar en nuestra aplicación.

El fichero App.xaml contendrá la lógica a nivel de aplicación. Este fichero es indispensable para que la interfaz de usuario se ejecute correctamente.

El fichero MainPage.xaml contendrá la página principal o de inicio de la aplicación una vez ejecutamos la misma. Adjunto a este fichero también encontraremos el fichero MainPage.xaml.cs que tiene que ver (en el caso de C#) con el código en C# asociado a la página MainPage.xaml.

El fichero Package.appxmanifest contiene las propiedades de la aplicación y proyecto. Estas propiedades están divididas en 4 apartados: Application UI, Capabilities, Declarations, Packaging.

De acuerdo a las 4 categorías anteriores, deberíamos aclarar que:

En la solapa Application UI podremos establecer las propiedades que nos permitan describir nuestra aplicación al ser desplegada.

En la solapa Cababilities podremos indicar las características del sistema o de los dispositivos que van a utilizar nuestra aplicación.

En la solapa Declarations podremos agregar declaraciones y establecer sus propiedades.

En la solapa Packaging podremos establecer las propiedades que identifican y describen el paquete de tu aplicación al ser desplegado.

Para finalizar, recuerda que podemos igualmente acceder a las propiedades de nuestro proyecto haciendo clic en el proyecto y pulsando la combinación de teclas Alt + Enter o bien pulsando el botón derecho del ratón sobre el proyecto y seleccionando la opción Propiedades del menú emergente.

Estas son las partes generales que podemos encontrar en nuestros proyectos Metro.

Evidentemente, existirán algunas diferentes de acuerdo a la plantilla de proyecto seleccionada, pero esta distribución nos permitirá tener una toma de contacto con Visual Studio 2012 y con los proyectos Metro.

A continuación en próximas entradas, abordaremos el desarrollo de nuestro primer ejemplo Metro.

Referencias

Wikipedia – Windows 8

Wikipedia – Historia del “Hola Mundo”