Aplicaciones ejemplo para Windows 7 Multitouch: MeteorologíaEspañaTouch Versión 1.1

En la última publicación sobre aplicaciones para Windows 7 Multitouch se mostró la posibilidad de usar un servicio web para obtener datos sobre el estado del tiempo.
Ante la buena acogida por vuestra parte de esta entrada y atendiendo a las peticiones recibidas, en esta entrada describiremos como se ha desarrollado, y   explicaremos las modificaciones realizadas para recibir una información más detallada del tiempo de cada provincia. Para aumentar el detalle informativo se ha usado el fichero XML proporcionado por la agencia estatal de meteorología (AEMET).

La nueva versión de la aplicación, junto con su código fuente, ya está disponible para su descarga y evaluación a través del Canal Windows7-Multitouch abierto en Codeplex. Descargable desde aquí

Como se vio en la entrada anterior, la funcionalidad principal de la aplicación consiste en pulsar sobre una provincia española para obtener el parte meteorológico de la misma.

La aplicación es capaz  de  reconocer la posición donde se ha pulsado en el Tablet y asociarlo a una provincia de España.

Para realizar esto partimos de una imagen de España en formato vectorial, con todas las provincias dibujas en este formato, pero WPF no trabaja de forma directa con imágenes vectoriales, por ello hemos de utilizar el proyecto Svg2Xaml, disponible en Codeplex. Para transforma la imagen en un fichero XAML. Este fichero XAML ya es nativo de WPF  y puede trabajar con él.

El resultado de esta conversión de fichero vectorial a XAML, será un código similar al siguiente:

<Image.Source>

   <DrawingImage  >

       <DrawingImage.Drawing>

           <DrawingGroup Opacity="1">

                <DrawingGroup.Children>

                    <GeometryDrawing Brush="#FFEBF6FD" Pen="{x:Null}">

Y para cada provincia se representaría con un objeto “PathGeometry”, con este aspecto:

<GeometryDrawing.Geometry>

  <PathGeometry FillRule="Nonzero" Figures="M1.00000059604645,1.00000035762787L642,1.00000035762787 642,457 1.00000059604645,457 1.00000059604645,1.00000035762787z" />

</GeometryDrawing.Geometry>

Para recibir los eventos de pulsación, se ha superpuesto en cada provincia una elipse, cuyo código es el siguiente.

<Ellipse Height="42" HorizontalAlignment="Left" Margin="242,107,0,0" Name="zamora" Stroke="black" VerticalAlignment="Top" Width="49" Fill="#00009600"  TouchDown="tenerife_TouchDown"/>

Al establecer el valor de la propiedad “Stroke” como “Black” se pintarán los bordes de la elipse de dicho color  y al dar un valor a la propiedad “Fill”, se llenara la elipse de forma que todos los puntos que se encuentran dentro de dicha elipse obtendrán los eventos correspondientes a la elipse.

 Mapa de España con elipses superpuestas

Si queréis ampliar conocimientos sobre el comportamiento de las elipses en WPF podeis visitar el enlace de MSDN donde se explica con mucho más detalle. http://msdn.microsoft.com/es-es/library/system.windows.shapes.ellipse.aspx

Entre los eventos disponibles en el “Ellipse” se encuentra el evento “TouchDown” que es el que se desencadenará cuando el usuario pulse sobre la pantalla, por lo cual todos los procedimientos relativos a la obtención de información deberán ir dentro del manejador del evento:"tenerife_TouchDown".

Si se desea que la aplicación funcione en dispositivos táctiles y en dispositivos que no lo son, se podría añadir el evento “ MouseLeftButtonDown = "uno_MouseLeftButtonDown" “

Para obtener la información del tiempo hemos actualizado la aplicación para recopilar  los datos desde la agencia estatal de meteorología (AEMET) a través de su página Web en un fichero XML.

Página de la AEMT

Para cada uno de los municipios incluidos en la página de la AEMET, la agencia proporciona un XML con los datos de la predicción meteorológica., si se observan las direcciones URL de estos ficheros es fácil darse cuenta de que estas incluyen el código postal del municipio.

Como la petición se realiza por medio del código postal a cada provincia le asociaremos el código postal de uno de sus municipios, para obtener el XML con la información del tiempo de dicho municipio y nuestra aplicación se encargará de mostrar los datos.

XML de AEMT

Para obtener le fichero XML de la página de AEMT lo haremos  a través del siguiente código, el cual realiza una petición web y se queda a la espera de la respuesta de la página.

HttpWebRequest xmlRequest = (HttpWebRequest) WebRequest.Create("http://www.aemet.es/xml/municipios/localidad_" + código + ".xml");

WebResponse xmlResponse = xmlRequest.GetResponse();

La variable “código” es el código postal sobre el que se desea obtener la información.

Mediante el uso del lenguaje  XPATH se puede acceder a cualquier nodo del fichero XML proporcionado por la agencia.

Stream responseStream = xmlResponse.GetResponseStream();

XPathDocument nuevo = new XPathDocument(responseStream);

Una vez accedidos a los nodos de interés se recupera la información. En esta versión de la aplicación se ha querido mostrar la temperatura máxima, mínima, la probabilidad de lluvia y el estado del tiempo dando una imagen relativa a dicho estado.

Como demostración se hará la petición sobre el estado del tiempo en Madrid.

Resultado del Tiempo

Dentro de la ventana de previsión, se puede apreciar un icono de un sol, el cual sencillamente es objeto de tipo “Image” cuyo origen de datos será un fichero con extensión “.gif” alojado en el servidor de AEMET.

this.image1.Source = new BitmapImage(new Uri("http://www.aemet.es/imagenes_gcd/_iconos_localidades/11.GIF", UriKind.RelativeOrAbsolute)); break;

En el caso que se desee especificar una fuente local, basta con cambiar la URL de la imagen a utilizar, haciendo uso de un archivo que se encuentre dentro del proyecto.

this.image1.Source = new BitmapImage(new Uri("imagen.jpg",UriKind.RelativeOrAbsolute)); break;

Con esta entrada os hemos explicado el funcionamiento de la aplicación MapaEspañaTouch, en las próximas entradas explicaremos el código de las anteriores aplicaciones, además de ir avanzando en la programación de los dispositivos Multitouch con MS Windows 7.

Para acabar, recuerda que si quieres aprender mucho más sobre los secretos de los sistemas Microsoft Windows, te recomendamos leer el libro de Sergio de los Santos "Máxima Seguridad en Windows: Secretos Técnicos" , o siempre puedes suscribirte al Canal RSS de Windows Técnico para estar al día de las novedades e información técnica de interés.