Windows 8: Terminando Apps.

Un detalle interesante sobre el ciclo de vida de las aplicaciones Windows 8 (del que ya hablé brevemente aquí) es que al estado “Terminado” puede llegarse por varias razones.

Un paseo por la vida de…

Ya hemos visto en otras ocasiones el ciclo de vida de una aplicación del App. Store.

image_thumb[1]

La aplicación del App. Store que se encuentra en pantalla es aquella que se está llevando el tiempo de procesador (no es cierto del todo, pero a efectos de esta entrada, nos sirve la simplificación). Si el usuario cambia de aplicación, la que estaba en ejecución pasa a estado “Suspendida” y la que el usuario acaba de arrancar pasa a estado “En Ejecución”.

Sin embargo, no es lo mismo que una aplicación pase al estado “Terminada” porque el S.O. reclame los recursos que esta ocupa mientras está suspendida (e.d. reclame la memoria ocupada) que una aplicación pase al estado “Terminada” porque el usuario decida finalizarala (ya sea utilizando Ctrl Alt+F4 o arrastrándola a la parte inferior de la pantalla). En el segundo caso no queda rastro de la aplicación en la interfaz de usuario, en el primer caso todavía aparece la aplicación en la zona izquierda de la pantalla, tal y como estaría si la aplicación siguiera suspendida y no terminada (y si lo piensas es normal, el usuario no tienen por qué saber que el S.O. ha terminado la aplicación y, si esta desaparece sin motivo aparente de la parte izquierda de la pantalla, la sensación del usuario sería que algo no marcha del todo bien en su dispositivo).

I’ll be back.

Pues sí, tal y como dijo Terminator: “volveré”, pero no de cualquier manera. Cuando una aplicación pasa del estado “suspendida” al estado “running” debería de ser capaz de restaurar el estado en que se encontraba previamente (supongo que aquí no tendremos discusión). Cuando una aplicación es terminada por el usuario, no existe motivo aparente para querer volver al mismo estado donde la aplicación se encontraba antes de ser finalizada (bueno, salvo que tu aplicación ofrezca esta característica al usuario, claro está). Pero. ¿Qué pasa cuando una aplicación suspendida es finalizada por el SO y posteriormente vuelta a poner en marcha por el usuario?

Pues bien, seamos coherentes con el comportamiento del SO. Si Windows 8 pretende que todo siga como si la aplicación nunca hubiera sido terminada (al fin y al cabo, su tile sigue disponible en la zona izquierda de la pantalla), nuestra aplicación debería de ser capaz de restaurar el estado como si volviera de “suspendida” en vez de “terminada”.

¿Pero, es posible determinar durante el arranque si una aplicación fue terminada por el SO o por el usuario?

Pues sí, y es bastante fácil.

   1: if (args.PreviousExecutionState == ApplicationExecutionState.ClosedByUser)

   2: {

   3:     // Comprobar aquí si el usuario quiere que se recuerde su estado anterior de navegación    

   4:     // Y si así es, entonces cargar dicho estado.

   5: }

En definitiva. Parte de la filosofía que se esconde tras las aplicaciones disponibles en la nueva Tienda de Windows 8 es proporcionar coherencia en la experiencia de usuario en su nuevo dispositivo. Es interesante estar pendiente de estos pequeños detalles para proporcionar dicho grado de coherencia.

Depurando una aplicación Windows 8

Llevaba ya mucho tiempo sin escribir ninguna entrada, así que este es un buen momento para retomar el hábito.

Recientemente he estado revisando el desarrollo de aplicaciones Windows 8 (utilizando WinRT).

Existen algunas semejanzas con las experiencias previas en Windows Phone 7.5, pero no nos engañemos, son semejanzas superficiales. Sin embargo, sí es cierto que el ciclo de vida de las Aplicaciones de Tienda de Windows 8 (madre mía, menudo nombre) es prácticamente idéntico al ciclo de vida de aplicaciones Windows Phone.

El Ciclo de Vida

Nos encontramos con el siguiente conjunto de estados.

image

Como podéis ver, prácticamente idéntico al ciclo de vida de aplicaciones Windows Phone 7.5

De nuevo cabe destacar que, una vez una aplicación ha sido suspendida, no hay garantía de que vuelva a pasar a “en ejecución” ya que el S.O. puede decidir descargarla de memoria en cualquier momento.

Depurando los cambios de estado

Una de las las facilidades que se encuentra con Visual Studio 2012 a la hora de depurar aplicaciones Windows 8 es la posibilidad de mandar mensajes a la aplicación que nos servirán para depurarla cuando lleguen los cambios de estado. ¿De qué forma? Pues nada más sencillo.

image

A un simple click de ratón tenemos la posibilidad de enviar nuestra aplicación de el estado “en ejecución” a “suspendida”, de “suspendida” de vuelta a “en ejecución” y, por último ya sea desde el estado “en ejecución” o “suspendida” a “terminada”.

Actualización: ¿Y dónde puedo encontrar esta ayuda para la depuración? Pues simplemente hay que activar la barra de herramientas “Ubicación de Depuración” o “Debug Location”.

Magnífica ayuda para comprobar que nuestra aplicación es capaz de guardar el estado y recuperarlo correctamente.

Windows 8 – Control de Usuario

Mientras espero pacientemente a que pueda seguir programando mi teléfono móvil con Windows 8 y Visual Studio 2012

image

(Sí, ya sé que Windows 8 trae Hyper-V y podría instalarme una máquina virtual con Windows 7 y Visual Studio 2010).

Como decía, mientras tanto, he optado por empezar a explorar las posibilidades que tengo para programar aplicaciones XAML sobre Windows 8.

XAML (mi desconocimiento sobre…)

Lo primero es decir que no tengo mucha experiencia con WPF, así que con la idea de hacer una aplicación sencilla en la cabeza me he lanzado a ello.

Visual Studio 2012 permite comenzar con varias plantillas de aplicación para la tienda de Windows

  • Una aplicación vacía formada por una única pantalla sin contenido.

image

  • Una aplicación de cuadrícula organizada en tres pantallas y pensada en mostrar desde agrupaciones de elementos hasta los detalles de un elemento perteneciente a uno de los grupos

image

  • Una aplicación dividida que está organizada en dos pantallas, muy similar a la anterior en la que se muestran grupos de elementos en una pantalla y los elementos que pertenecen a un grupo junto con el detalle del elemento seleccionado en la otra pantalla.

image

Mi elección (con la idea de evitar complejidades en el primer contacto) ha sido la aplicación vacía.

Bibliotecas Portables

Mi objetivo es crear una aplicación donde el usuario puede ir creando de forma dinámica nodos que pueden tener relaciones entre sí (a modo de grafo).

Para ello he creado una biblioteca de clases donde he implementado la estructura de datos del grafo (así recuerdo un poco los estudios de la Universidad).

Una de las nuevas características que trae consigo el .NET Framework 4.5 es la Biblioteca Portable de Clases que te permite crear un ensamblado que puede ser reutilizado en diferentes tecnologías y dispositivos. Con este tipo de bibliotecas, puedo disponer de una colección de componentes que podré utilizar tanto en mis proyectos de Windows Phone (7.x y 8) y en mis proyectos basados en Windows 8. ¡Por fin!

image

Mi Primer Control de Usuario

El siguiente paso consiste en crear un control personalizado que me permita representar los nodos de un grafo.

Nada más sencillo ¿Verdad? (Pues, cosas de lo más triviales me han dado ciertos dolores de cabeza).

Lo primero, añadir a mi proyecto de Windows 8 un nuevo control. ¿Cuál escoger?

image

Tenemos dos tipos de controles.

  1. Controles con plantilla (Templated Controls)
  2. Controles de usuario (User Controls)

Bien, no voy a entrar ahora en diferencias entre unos y otros (todavía las estoy digiriendo). Como de lo que se trata es de aprender he optado por el camino del medio. ¡He implementado los dos tipos!

Mi objetivo es mostrar (en primera instancia) un rectángulo con un título, un área de texto descriptiva y una url que permita navegar a otro punto con más información (ese otro punto puede ser una web o una página de la propia aplicación. ¿Quién sabe?)

Algo de este estilo.

image

El proceso ha sido relativamente sencillo. Primero crear la estructura XAML que lo defina (esencialmente un grid con tres filas)

   1: <UserControl

   2:     x:Class="Jdmveira.Controls.NodeControl"

   3:     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

   4:     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

   5:     xmlns:local="using:Jdmveira.Controls"

   6:     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

   7:     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

   8:     mc:Ignorable="d"

   9:     d:DesignHeight="400"

  10:     d:DesignWidth="300">

  11:

  12:     <UserControl.Resources>

  13:         <Style x:Key="MainBorderDefaultNodeStyle" TargetType="Border">

  14:             <Setter Property="BorderThickness" Value="3" />

  15:             <Setter Property="CornerRadius" Value="1" />

  16:         </Style>

  17:

  18:         <Style x:Key="InnerBorderDefaultNodeStyle" TargetType="Border">

  19:             <Setter Property="BorderThickness" Value="2" />

  20:             <Setter Property="CornerRadius" Value="1" />

  21:         </Style>

  22:     </UserControl.Resources>

  23:

  24:     <Grid x:Name="CtrlMainLayout">

  25:         <Border x:Name="MainBorder" Style="{StaticResource MainBorderDefaultNodeStyle}">

  26:

  27:             <Border.BorderBrush>

  28:                 <SolidColorBrush x:Name="MainBorderColor" Color="#FF0067BD" />

  29:             </Border.BorderBrush>

  30:

  31:             <Border Style="{StaticResource InnerBorderDefaultNodeStyle}">

  32:

  33:                 <Border.BorderBrush>

  34:                     <SolidColorBrush x:Name="InnerBorderColor" Color="#FF84C7FF" />

  35:                 </Border.BorderBrush>

  36:

  37:                 <Grid MinHeight="150"

  38:                   MinWidth="150">

  39:                     <Grid.RowDefinitions>

  40:                         <RowDefinition Height="10*"/>

  41:                         <RowDefinition Height="50*"/>

  42:                         <RowDefinition Height="10*"/>

  43:                     </Grid.RowDefinitions>

  44:

  45:                     <TextBlock

  46:                         x:Name="TitleBlock"

  47:                         Margin="0"

  48:                         Text="Prueba"

  49:                         FontSize="24"

  50:                         Padding="6,2,0,0"

  51:                         Foreground="Black"

  52:                         Grid.Row="0">

  53:

  54:                     </TextBlock>

  55:

  56:                     <Rectangle

  57:                         Grid.Row="0"

  58:                         Fill="{StaticResource NodeCaptionBackground}"

  59:                         Canvas.ZIndex="-1"/>

  60:

  61:                     <TextBlock

  62:                         x:Name="DescriptionBlock"

  63:                         Text="Texto descriptivo que podría ocupar perfectamente más de una línea"

  64:                         TextWrapping="Wrap"

  65:                         Padding="4,4,4,0"

  66:                         Foreground="Black"

  67:                         Grid.Row="1"/>

  68:

  69:                     <Rectangle Grid.Row="1" Fill="White" Canvas.ZIndex="-1" />

  70:

  71:                     <HyperlinkButton

  72:                         x:Name="LinkMoreInfo"

  73:                         VerticalAlignment="Bottom"

  74:                         Grid.Row="2" HorizontalAlignment="Right">www.bing.es</HyperlinkButton>

  75:

  76:                         <Rectangle Grid.Row="2" Fill="White" Canvas.ZIndex="-1" />

  77:                 </Grid>

  78:             </Border>

  79:         </Border>

  80:         <Grid x:Name="GridShadows" Margin="-2,-2,-6,-6">

  81:             <Rectangle Stroke="Black" Margin="5" RadiusX="7" RadiusY="7" Opacity="0.3"/>

  82:             <Rectangle Stroke="Black" Margin="4" RadiusX="8" RadiusY="8" Opacity="0.25"/>

  83:             <Rectangle Stroke="Black" Margin="3" RadiusX="9" RadiusY="9" Opacity="0.2"/>

  84:             <Rectangle Stroke="Black" Margin="2" RadiusX="10" RadiusY="10" Opacity="0.15"/>

  85:             <Rectangle Stroke="Black" Margin="1" RadiusX="11" RadiusY="11" Opacity="0.1"/>

  86:             <Rectangle Stroke="Black" Margin="-37,0,37,0" RadiusX="12" RadiusY="12" Opacity="0.05"/>

  87:         </Grid>

  88:     </Grid>

  89: </UserControl>

Las diferencias para ambos han sido que el control de usuario tiene el XAML fuertemente asociado a la clase que implementa el control (el code behind, vamos), mientras que en el caso del control de plantilla define un fichero aparte con la correspondiente plantilla para cambiar el aspecto del control (Template)

   1: <Style x:Name="EstiloNodoGridView" TargetType="local:NodeControl2">

   2:     <Setter Property="Template">

   3:         <Setter.Value>

   4:             <ControlTemplate TargetType="local:NodeControl2">

   5:                 <Grid x:Name="CtrlMainLayout">

   6:                     <Border x:Name="MainBorder" Style="{StaticResource MainBorderDefaultNodeStyle}">

   7:

   8:                         <Border.BorderBrush>

   9:                             <SolidColorBrush x:Name="MainBorderColor" Color="#FF0067BD" />

  10:                         </Border.BorderBrush>

  11:

  12:                         <Border Style="{StaticResource InnerBorderDefaultNodeStyle}">

  13:

  14:                             <Border.BorderBrush>

  15:                                 <SolidColorBrush x:Name="InnerBorderColor" Color="#FF84C7FF" />

  16:                             </Border.BorderBrush>

  17:

  18:                             <Grid MinHeight="150" MinWidth="150">

  19:                                 <Grid.RowDefinitions>

  20:                                     <RowDefinition Height="10*"/>

  21:                                     <RowDefinition Height="50*"/>

  22:                                     <RowDefinition Height="10*"/>

  23:                                 </Grid.RowDefinitions>

  24:

  25:                                 <TextBlock

  26:                                     x:Name="TitleBlock"

  27:                                     Margin="0"

  28:                                     Text="Prueba"

  29:                                     FontSize="24"

  30:                                     Padding="6,2,0,0"

  31:                                     Foreground="Black"

  32:                                     Grid.Row="0">

  33:

  34:                                 </TextBlock>

  35:

  36:                                 <Rectangle

  37:                                     Grid.Row="0"

  38:                                     Fill="{StaticResource NodeCaptionBackground}"

  39:                                     Canvas.ZIndex="-1"/>

  40:

  41:                                 <TextBlock

  42:                                     x:Name="DescriptionBlock"

  43:                                     Text="Texto descriptivo que podría ocupar perfectamente más de una línea"

  44:                                     TextWrapping="Wrap"

  45:                                     Padding="4,4,4,0"

  46:                                     Foreground="Black"

  47:                                     Grid.Row="1"/>

  48:

  49:                                 <Rectangle Grid.Row="1" Fill="White" Canvas.ZIndex="-1" />

  50:

  51:                                 <HyperlinkButton

  52:                                     x:Name="LinkMoreInfo"

  53:                                     VerticalAlignment="Bottom"

  54:                                     Grid.Row="2" HorizontalAlignment="Right">www.bing.es</HyperlinkButton>

  55:

  56:                                 <Rectangle Grid.Row="2" Fill="White" Canvas.ZIndex="-1" />

  57:                             </Grid>

  58:                         </Border>

  59:                     </Border>

  60:                     <Grid x:Name="GridShadows" Margin="-2,-2,-6,-6">

  61:                         <Rectangle Stroke="Black" Margin="5" RadiusX="7" RadiusY="7" Opacity="0.3"/>

  62:                         <Rectangle Stroke="Black" Margin="4" RadiusX="8" RadiusY="8" Opacity="0.25"/>

  63:                         <Rectangle Stroke="Black" Margin="3" RadiusX="9" RadiusY="9" Opacity="0.2"/>

  64:                         <Rectangle Stroke="Black" Margin="2" RadiusX="10" RadiusY="10" Opacity="0.15"/>

  65:                         <Rectangle Stroke="Black" Margin="1" RadiusX="11" RadiusY="11" Opacity="0.1"/>

  66:                         <Rectangle Stroke="Black" Margin="-37,0,37,0" RadiusX="12" RadiusY="12" Opacity="0.05"/>

  67:                     </Grid>

  68:                 </Grid>

  69:             </ControlTemplate>

  70:         </Setter.Value>

  71:     </Setter>

  72: </Style>

(Os recuerdo que estoy aprendiendo, así que encontraréis probablemente cosas que haya que definir de mejor manera: estoy pensando en estilos fundamentalmente…)

Dándole un poco de interactividad

El objetivo es que el usuario pueda seleccionar nodos para editar sus contenidos, arrastrarlos por la ventana para ajustar su disposición, relacionarlos entre sí…)

Voy a empezar por algo sencillo (y que sólo tiene sentido si se está utilizando un ratón). Destacar el control que se encuentre bajo el cursor cambiando simplemente el color del borde (de momento a un rojo chillón para destacar, más adelante intentaremos mejorar el aspecto visual).

Mi primera tentación fue (tirando de experiencias previas desarrollando con aplicaciones Windows puras y duras) tirar de manejadores de eventos. Sin embargo, unas pocas visitas a la red parecieron indicar que esa era una de las peores ideas que se me podrían haber ocurrido.

   1: protected override void OnPointerEntered(Windows.UI.Xaml.Input.PointerRoutedEventArgs e)

   2: {

   3:     base.OnPointerEntered(e);

   4:

   5:     // ¿Qué tal si cambio aquí el aspecto del borde de mi control?

   6: }

   7:

   8: protected override void OnPointerExited(Windows.UI.Xaml.Input.PointerRoutedEventArgs e)

   9: {

  10:     base.OnPointerExited(e);

  11:

  12:     // Y aquí me limito a volverlo como estaba. ¿No?

  13: }

Así que a seguir investigando.

Tras algunas vueltas más salieron a flote algunos conceptos. Triggers y el VisualStateManager.

Resulta que los Triggers no funcionan en el XAML de Windows 8, así que me quedé con la otra opción.

El VisualStateManager

En esencia, se trata de un componente que me permite definir estados visuales de un control, grupos de estados visuales y (opcionalmente) transiciones para cambiar de un estado a otro. En resumen, ayuda a dejar en la capa de presentación la lógica de presentación asociada al cambio del estado visual de un control. Resumiendo: “evita” que tengas que escribir código en el Code Behind (ya veremos que he tenido que meter una línea, al menos).

Dentro del grid externo que defino en mi control (el que tiene como nombre “CtrlMainLayout”) me he limitado a introducir el siguiente código.

   1: <VisualStateManager.VisualStateGroups>

   2:     <VisualStateGroup x:Name="NodeStates">

   3:         <VisualStateGroup.Transitions>

   4:             <VisualTransition To="PointerOver" GeneratedDuration="0:0:0.5" />

   5:         </VisualStateGroup.Transitions>

   6:

   7:         <VisualState x:Name="Normal" />

   8:         <VisualState x:Name="PointerOver">

   9:             <Storyboard>

  10:                 <ColorAnimation

  11:                     Storyboard.TargetName="MainBorderColor"

  12:                     Storyboard.TargetProperty="Color"

  13:                     To="Red" />

  14:                 <ColorAnimation

  15:                     Storyboard.TargetName="InnerBorderColor"

  16:                     Storyboard.TargetProperty="Color"

  17:                     To="OrangeRed" />

  18:             </Storyboard>

  19:         </VisualState>

  20:     </VisualStateGroup>

  21:     <VisualStateGroup x:Name="FocusStates"/>

  22: </VisualStateManager.VisualStateGroups>

Lo que este código quiere decir es lo siguiente.

  1. He definido un grupo de estados visuales llamado “NodeStates”
  2. Dentro de dicho grupo he definido dos estados visuales
  1. Normal
  2. PointerOver
  • El estado visual “PointerOver” tiene definidas dos animaciones de color (una para cada uno de los bordes, interior y exterior, que defino dentro de mi control). En ambos casos pasamos del color que sea a Rojo (en el caso del borde exterior) y Naranja rojizo (en el caso del interior)
  • Una transición que indica que, cuando se transicione de cualquier estado (no se define el atributo “from”) al estado “PointerOver” la duración de la animación será de cinco segundos.

Bueno, pues ya está. ¿No? La web está llena de ejemplos que aplican a la plantilla de un botón y no hace falta nada más…

Craso error: compilo, paso mi cursor por encima del control y nada de nada.

¿Cómo cambio entre estados visuales?

Otra vez a internet y a darle vueltas. Después de cierta cantidad de esfuerzo (acompañado de bizquera) descubrí por qué funcionaba para un botón y no para mi control y es que, el botón ya tiene definidos una serie de estados visuales (Default, PointerOver, Pressed, Disabled) que gestiona internamente. Pero mi control no.

Así que, aquí viene la línea de código en mi code-behind (vale, en realidad son dos).

   1: protected override void OnPointerEntered(Windows.UI.Xaml.Input.PointerRoutedEventArgs e)

   2: {

   3:     base.OnPointerEntered(e);

   4:

   5:     VisualStateManager.GoToState(this, "PointerOver", true);

   6: }

   7:

   8: protected override void OnPointerExited(Windows.UI.Xaml.Input.PointerRoutedEventArgs e)

   9: {

  10:     base.OnPointerExited(e);

  11:

  12:     VisualStateManager.GoToState(this, "Normal", true);

  13: }

Sencillamente: capturo los eventos de entrada y salida del cursor sobre y desde el control y utilizo el VisualStateManager para indicar el cambio de estado (hacia “PointerOver” cuando el cursor entra y hacia “Normal” cuando el cursor sale).

¡Y ya está, funcionando!

image

(Los controles de los extremos son controles de plantilla y el central un control de usuario)

¿Alguien conoce una mejor forma de manejar situaciones como estas?

Mis primeras experiencias con Windows 8

Recientemente decidí instalar Windows 8 en un ordenador de escritorio para poder comprobar qué tal pinta tenía la cosa en una máquina de verdad. Lo cierto es que la experiencia de instalación no ha sido del todo satisfactoria, pero finalmente tengo mi máquina funcionando. Empecemos por el principio. Primero de todo, la instalación no actualiza el sistema operativo, como mucho te permite mantener una copia de todo la anterior en una carpeta llamada “Windows.old”. En mi caso, mi instalación anterior de Windows 7 tenía dos particiones de disco. La primera contenía el sistema operativo y aplicaciones. La segunda contenía las carpetas de usuarios (y en consecuencia todos sus datos) así como bases de datos y proyectos. Esto simplificó enormemente el proceso de mantener la información de mi ordenador (más o menos) intacta. La instalación Como comentaba anteriormente, la instalación no fue del todo satisfactoria ya que, la primera instalación terminó con aplicaciones “antes conocidas como Metro, pero ya no más” cayéndose por culpa de una instalación errónea del Framework .NET 4. En este punto podía machacarme los sesos para intentar arreglar la instalación o bien reinstalar. Opté por lo segundo ya que probablemente me llevaría menos tiempo. Ante todo hay que decir que el problema vino de una prueba que realicé con una aplicación en fase Beta todavía… Quien con niños duerme, meado se despierta. La segunda instalación Se resume en una palabra: “fina” Rápida y sin problemas. Las pruebas y el proceso de familiarización Me está llevando cierto tiempo habituarme a la nueva filosofía del Sistema Operativo. La “Modern UI” funciona muy bien con ratón y teclado, aunque estoy deseando echarle mano a un Tablet con Windows 8 casi tan pronto como salgan (bueno, casi, habrá que ver presupuestos y versiones). Por otro lado, la instalación de aplicaciones es sencilla y rápida, el arranque del sistema operativo rápido como el rayo. Vamos que parece que tenga ordenador nuevo. Los usuarios, las aplicaciones y una duda a ver si me aclaro Por último, pasé a importar la información de los usuarios. La estructura de directorios de un usuario sigue siendo idéntica así que pude recuperar sin mayor problema documentos, favoritos, imágenes, vídeos… Tengo un par de niñas pequeñas, pero la mayor ya quiere utilizar el ordenador desde hace algún tiempo. En mi antiguo Windows 7 me encargué de instalar el software de control parental para evitar sustos. Cuando ella quiere navegar por Internet, normalmente su navegación se limita a un par de páginas o tres. Estas páginas están dentro de las páginas que puede visitar. En el nuevo Windows 8 el control parental está incluido con lo que es fácil establecer algunas limitaciones (hay software mucho mejor por ahí, pero se trata de una opción de inicio más que decente). Sin embargo la sorpresa vino cuando decidí instalar algunos programas para niños. Mi usuario administrador puede instalar las aplicaciones. ¡Pero sólo para mi! Es decir, cuando quise instalar alguna aplicación en la configuración de mi hija, tuve que entrar en su cuenta (tiene una cuenta local, no de Microsoft) poner mis credenciales e instalarla. He mirado un poco por ahí y parece que este es el funcionamiento esperado, pero me cuesta creer que no haya una posibilidad (como hay para las aplicaciones de escritorio) de instalar una aplicación del Store no sólo para tu usuario, sino para todos. ¿Alguien que sepa esto?

Windows Phone 7.5–Manejando llamadas a Servicios

Mientras preparo un post de un tamaño bastante considerable (ya me está llevando algo de tiempo documentarme para completarlo) he decidido sacar una pequeña entrada con algo de información que me ha resultado bastante útil en el proyecto personal que voy llevando a cabo.

Accediendo a FourSquare

Una parte fundamental del proyecto es el acceso al API de FourSquare. Este API está basada en un conjunto de servicios REST muy bien diseñados y fáciles de comprender (bueno, al menos en cierta parte).

image

Uno (entre muchos) de los aspectos interesantes del API es el soporte a varios idiomas. Según indica la documentación, existen dos formas para solicitar las respuestas en uno de los idiomas soportados por FourSquare.

Una de ellas es especificar un parámetro (locale=xx) dentro de la petición HTTP, sin embargo el método favorito es utilizar una cabecera HTTP (Accept-Language). Así que, sin dudarlo, y aprovechando que la infraestructura que monté para llamar a los diferentes end-points de FourSquare me lo permitía con facilidad, me decidí a incluir la cabecera para el idioma.

Todos los end-points heredan de una clase base llamada FourSquareEndPointBase.cs, donde se gestiona de forma asíncrona las peticiones y respuestas realizadas por la aplicación. Entre las responsabilidades de esta clase está, lanzar asíncronamente la petición al end-point que especifique la clase hija, recibir la información desde FourSquare, comprobar el estado de la llamada y pasarle a la clase hija la respuesta jSon para que ella se encargue de Deserializar dicho jSon a las clases de entidad necesarias.

La siguiente porción de código pertenece al método que realiza asíncronamente la llamada al end-point de FourSquare.

   1: protected void BeginRequest(Uri url, string method)

   2: {

   3:    HttpWebRequest request = WebRequest.CreateHttp(url);

   4:  

   5:    request.Headers["Accept-Language"] = System.Threading.Thread.CurrentThread.CurrentUICulture.TwoLetterISOLanguageName;

   6:    request.Method = method;

   7:  

   8:    CallbackResult asyncResult = new CallbackResult

   9:    {

  10:        Request = request,

  11:        JsonResponse = null

  12:    };

  13:  

  14:    request.BeginGetResponse(_callback, asyncResult);

  15: }

Como podéis ver, la cabecera HTTP “Accept-Language” se informa con el idioma actual del hilo de interfaz de usuario (el método de la petición puede ser GET o POST en esta versión del framework de acceso a FourSquare que he montado).

Hasta aquí no hay ningún misterio. Mirando el código me acordé de un proyecto que realicé años atrás en el antiguo PocketPC Phone Ed. 2003. Y, me lancé a mirar si:

  1. ¿Me permitirá FourSquare me permitiría pedir respuestas comprimidas?
  2. ¿Me permitirá Windows Phone descomprimir respuestas en caso de que me lleguen comprimidas?

Solicitando Compresión en las respuestas de FourSquare (y de quien quiera darlas)

El proceso para solicitar una respuesta comprimida es muy similar al descrito un poco más arriba.

   1: protected void BeginRequest(Uri url, string method)

   2: {

   3:     HttpWebRequest request = WebRequest.CreateHttp(url);

   4:  

   5:     request.Headers["Accept-Language"] = System.Threading.Thread.CurrentThread.CurrentUICulture.TwoLetterISOLanguageName;

   6:     request.Headers["Accept-Encoding"] = "gzip";

   7:     request.Method = method;

   8:  

   9:     CallbackResult asyncResult = new CallbackResult

  10:     {

  11:         Request = request,

  12:         JsonResponse = null

  13:     };

  14:  

  15:     request.BeginGetResponse(_callback, asyncResult);

  16: }

Como podéis ver, he añadido una segunda cabecera HTTP en la que indico que acepto como codificación de la respuesta, una codificación comprimida como “gzip”.

El siguiente paso es ver si FourSquare responde comprimiendo o no…

image

En la captura de pantalla se aprecia, inspeccionando el correspondiente objeto con el depurador, que la respuesta contiene una cabecera “Content-Encoding” y que su contenido es “gzip” lo que significa que: ¡FourSquare admite compresión!

Bien, acabo de estropear todo mi código. Ya que, las clases utilizadas para deserializar el jSon se estrellan irremediablemente contra un chorro de caracteres sin sentido. Es hora de descomprimir la respuesta.

Windows Phone no da soporte nativo a la compresión HTTP

Como he podido verificar después de dar unas cuantas vueltas, así que es hora de echar mano de (otra) biblioteca de terceros como SharpCompress.

Busqué el paquete en NuGet y, voilà. Ahí estaba.

image

¡Magnífico, incluso en la versión para Windows Phone 7! Ahora manos a la obra.

image

Y el código que se encarga de descomprimir la respuesta cuando corresponda.

   1: using SharpCompress.Compressor;

   2: using SharpCompress.Compressor.Deflate;

   3:  

   4: ...

   5:  

   6: response = (HttpWebResponse)request.EndGetResponse(ar);

   7:  

   8: byte[] buf = new byte[8192];

   9:  

  10: Stream respStream;

  11: if (response.Headers["Content-Encoding"] != null && response.Headers["Content-Encoding"] == "gzip")

  12: {

  13:     respStream = new GZipStream(response.GetResponseStream(), CompressionMode.Decompress);

  14: }

  15: else

  16: {

  17:     respStream = response.GetResponseStream();

  18: }

  19:  

  20: ...

Como podéis ver, muy sencillo y, de un plumazo, acabamos de ahorrarle a nuestro usuario algún que otro gasto en la factura telefónica (bueno, se lo hemos cambiado por algo más de consumo de batería)