Hello World en MetroStyle, un futuro cercano

Hello World en MetroStyle, un futuro cercano
Facebook Twitter Flipboard E-mail

Desde la presentación del Windows8 Developer Preview, los anuncios, eventos y novedades sobre el nuevo rumbo de la multinacional, está llenando de excitación y de nuevas futuras oportunidades de negocio a toda la comunidad de desarrollo.

Cosas como los proyectos MetroStyle, en xmla + c#, o html5 + javascript, llenan la imaginación de todo aquel que le guste el desarrollo. Y aún más, como quien escribe estas líneas, en la tecnología que mejor conoce y más cómodo se siente en ella.

Y por eso, hoy os traigo una breve mirada por el ojo de la cerradura a lo que podrían ser la futuras aplicaciones de escritorio/teléfono movil/xbox/tabletas de Windows8.

Pre requisitos


En este punto voy a hacer una criba entre mis lectores. Solamente se quedaran aquellos que realmente estén interesados en esta tecnología, y esto es así porque el Hello World lo voy a construir en un Windows 8 Developer Preview. En mi caso lo tengo instalado en una segunda partición de mi disco duro. Los que utilicéis VHD o máquinas virtuales, vais a tener que tener más paciencia que Job, porque la cosa va ir bastante lenta en vuestros casos.

Lo segundo es instalarse el Visual Studio 11 Developer Preview. No estoy seguro si con el Visual Studio 11 Express que viene con el Windows 8, se puede realizar este ejemplo. Hasta donde he leído por los foros, no permite hacer aplicaciones de escritorio completas, pero no sé si con algo tan simple dejaría.

Estos dos prerrequisitos implican que la máquina que trabajes sea al menos tan potente como la que tienes con tu Windows 7.

MetroStyle


ChooseAMetroStyleProject

¿Qué es MetroStyle? Pues básicamente es que Microsoft ha comprobado que el obligar a los diseñadores a normalizar la forma de interactuar con las aplicaciones y con el diseño en general, le ha venido muy bien a Apple. Y quiere “empujar” amigablemente a que las aplicaciones se centren en la calidad del valor que ofrecen y no en reinventar la rueda de la forma de interactuar.

Para ello estás aplicaciones tienen una serie de cosas muy interesantes y a las que, yo creo, nos deberíamos acostumbrar para poder entrar en un nicho de mercado prácticamente virgen:

  • Eliminar el paradigma de las ventanas. Todo ocurre en una sola ventana.

  • Esta ventana no tiene marco, por lo cual las aplicaciones no se cierran. Entran en Pausa.

  • Toda la comunicación de la UI con el back-end es asíncrona.

  • Se busca por encima de todo la sencillez y que todas las aplicaciones Metro Style se manejen igual y tengan el mismo feedback.

  • Todo debe ser diseñado para que sea táctil. Aunque no lo sea el dispositivo.

  • Este paradigma se utiliza en los Windows Phone, en la Xbox y en las futuras Tablet.

Hello World interactivo


CreateControls

Pensando en poder hacer un ejemplo similar en un futuro post de Windows Phone, he decidido programar mi Hello World interactivo en XAML + C#. He de reconocer que en mi trabajo diario, y desde hace demasiado tiempo, no trabajo para aplicaciones de escritorio. Por lo cual mi conocimiento en XAML es más bien básico. Pero para el ejemplo que quiero realizar, me basta y me sobra.

Así abro mi Windows8, mi Visual Studio 11 y escojo realizar una nuevo proyecto C#, del tipo Windows Metro Style Application.

Y aquí llega la primera sorpresa, el número de controles que puedo añadir a la aplicación es muchísimo mayor que en un proyecto asp.net. Además dichos controles tiene decenas de parámetros que se pueden ajustar. Comportamientos complejos y un montón de cosas que, cuando las controlas un poquillo, facilitan mucho la vida.

En este caso me pongo a trastear con el fichero xaml hasta añadir en el lienzo principal tres controles:

  • Un TextBlock llamado txtBlockSaluda, en donde en tamaño 72 dice por defecto ?Hello World?

  • Un TextBox llamado txtName

  • Un Button llamado bSaluda

Una vez introducido los tres controles, tengo que dar de alta el evento de Click. En ASP.NET era tan sencillo como ponerte encima del control y darle un doble click, pero aquí la lista de eventos es enorme. Por lo cual hay dos formas:

ButtonEvents

Una visual, en donde manteniendo abierta la página de propiedades (F4), pulso encima del botón para seleccionarlo y pulso en el iconito de acciones, obteniendo el listado de todos los eventos que puede lanzar este tipo de control. Ahora sí, doble click en la caja del evento Click y se me crea automáticamente en el code behind.

ButtonClickEvent

La otra forma de dar de alta el evento es desde el editor de XAML, por cierto este método es mucho más rápido. Busco el control, le añado a mano con ayuda del intellisense el evento que quiero capturar y le escribo cual es el método que se va a lanzar. Y si quiero ir al método que acabo de indicar y que me lo cree automáticamente si no existe, botón derecho y le indico que quiero ir al método que captura el evento.

Lo más difícil está echo. Ahora a por lo fácil, picar el código. Como hacer un Hello World es tan sencillo y lo he completado desde la pantalla de diseño, pues en el ejemplo quiero poder meter un texto y que, cuando pulse en el botón de Saluda, me lo ponga en enorme en el titular.

¿Cómo hago esto? Pues simplemente diciéndole que cuando se pulse el botón, lo que haya escrito en el txtName se pinte en el txtBlockSaluda.


partial class MainPage { public MainPage() { InitializeComponent(); }

   private void bSaluda_Click(object sender, RoutedEventArgs e)
   {
       txtBlockSaluda.Text = txtName.Text;
   }

}

Y con este sencillísimo ejemplo le hemos dado un breve vistazo a un futuro que, a mí personalmente, me parece prometedor y rompedor en mucha formas. Solamente un ejemplo y una cifra: Hacer una aplicación que me funcione en mi PC, en mi portátil, en mi Tablet (sea x86 o arm), en mi móvil y en mi xBox. Que la pueda manejar con ratón, con los dedos o con Kinect. Y que, solamente de dispositivos tipo PC, estamos hablando de medio billón de aparatos (500.000.000) donde correrlo actualmente…

Que lo disfrutéis.

Más información | Visual Studio 11 Developer Preview Training Kit
En GenbetaDev | Microsoft presenta en BUILD grandes novedades en el Windows Dev Center
En GenbetaDev | Microsoft ha muerto… Ja!

Comentarios cerrados
Inicio