Finalmente debido a que Unai no podrá asistir al CodeCamp 2009, Antón Molleda y yo estaremos como ponentes contando como “Socializar” una web utilizando el Windows Live Messenger Toolkit 3.5

La descripción de la charla que será antes de comer es la siguiente:

En esta sesión os enseñaremos las bondades del Windows Live Messenger Toolkit 3.5 con la que podremos "socializar" nuestras páginas web. Además veremos cómo mejorar y personalizar los controles comunes que encontraremos en el toolkit utilizando ScriptSharp. Y finalmente veremos cómo utilizar todo esto desde nuestra maravillosa aplicación desarrollada con Silverlight 3.0

Nos vemos en el CodeCamp!!

Ayer día 6 de Octubre de 2009 fuimos recompensados con el segundo premio de la Imagine Mobile 2009, por Mobie, en el evento de presentación oficial de Windows Mobile 6.5, celebrado en el Teatro Afil de Madrid.

Los integrantes del Pig Team que hicieron posibles este premio:

• Roberto Vivancos
• Antón Molleda
• Anuar Khan
• Y un servidor!

PD: Ya estamos preparando la siguiente aplicación para Windows Mobile 6.5 que será lanzada en su primera release sobre mediados de Noviembre en el marketplace. Permanecer atentos porque os interesará.

Con la versión final de Silverlight 2.0 pensaba que aparecería algun control de más que hemos echado en falta durarnte el periodo de Betas y demás. Por suerte en codeplex http://www.codeplex.com/Silverlight tenemos un set de controles típicos ya desarrollados.

Ha fecha de hoy existen dos conjuntos de controles, controles estables para ser usados tranquilamente y controles en pruebas:

En pruebas

Estables

A disfrutarlos pues :)

Volvemos a esta serie de posts relacionados con problemas que nos podemos encontrar a la hora de migrar una aplicación Silverlight Beta 2 a la versión final. En este caso supongamos que tenemos una aplicación silverlight con el siguiente código Xaml:

   1:      <Grid x:Name="LayoutRoot">

   2:          <Image Margin="0,0,0,0" Source="Images/background.jpg" Stretch="Fill" />

   3:          <Labs:Control1 HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>

   4:          <Labs:Control2 Height="92.719" HorizontalAlignment="Left" Margin="8,8,0,0" VerticalAlignment="Top" Width="176"/>

   5:          <Labs:Control3 x:Name="mainMenu" HorizontalAlignment="Right" VerticalAlignment="Top"/>

   6:      </Grid>

Donde cada UserControl Control contienen un botón que responde al evento MouseLeftButtonUp.

¿Qué ocurre si migramos esta aplicación a la versión final de silverlight? Pues ocurre que no ocurre nada, es decir, por mucho que apretemos el botón izquierdo del ratón sobre el botón, contenido en cada control, no ocurre nada.

El por qué lo tenemos en el tipo de panel que contiene la imagen y los tres controles de usuario. ¿No veis que falte algo? Pues sí, no están definidas las filas ni las columnas. Otro de los problemas de la Beta 2 en cuenta a permisividad. Por tanto añadiendo la definición de filas y columnas y definición que parte del Grid ocupa cada objeto, el código fuente resultante y funcional seria el siguiente:

   1:      <Grid x:Name="LayoutRoot">

   2:          <Grid.RowDefinitions>

   3:              <RowDefinition Height="100"/>

   4:              <RowDefinition Height="*"/>

   5:          </Grid.RowDefinitions>

   6:          <Grid.ColumnDefinitions>

   7:              <ColumnDefinition Width="180"/>

   8:              <ColumnDefinition Width="*"/>

   9:          </Grid.ColumnDefinitions>

  10:          <Image Margin="0,0,0,0" Source="Images/background.jpg" Stretch="Fill" 

                         Grid.Column="0" Grid.Row="0" Grid.RowSpan="2" Grid.ColumnSpan="2"/>

  11:          <Labs:Control1 HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
                         Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Grid.ColumnSpan="2"/>

  12:          <Labs:Control2 Height="92.719" HorizontalAlignment="Left" Margin="8,8,0,0" 

                         VerticalAlignment="Top" Width="176" Grid.Column="0" Grid.Row="0"/>

  13:          <Labs:Control3 x:Name="mainMenu" HorizontalAlignment="Right" VerticalAlignment="Top" Grid.Row="0" Grid.Column="1"/>

  14:      </Grid>

Ahora si que funcionan nuestros botones :)

Migrando y migrando aplicaciones, demos y demás que tengo por aqui en Silverlight Beta2 a la versión final, me he encontrado con problemas en tiempo de ejecución con un error que asusta al principio pero que investigando un poco se encuentra el por qué del mismo. El mensaje de error es: Catastrophic failure (Excepción de HRESULT: 0x8000FFFF (E_UNEXPECTED)), el cual lo podemos ver en la siguiente imagen.

El problema viene dado en la permisividad que nos daban las versiones Beta de Silverlight, a la hora de añadir elementos al diccionario de recursos de un elemento de tipo FrameworkElement. Es decir, el siguiente código fallaría una vez migrado a Silverlight 2.0:

Storyboard Story = new Storyboard();
DoubleAnimation da = new DoubleAnimation();
da.To = -200;
da.Duration = TimeSpan.FromSeconds(20);
Story.Children.Add(da);

LayoutRoot.Resources.Add(null, Story);

Y la solución pasa por dar un valor correcto al parámetro key:

Storyboard Story = new Storyboard();
DoubleAnimation da = new DoubleAnimation();
da.To = -200;
da.Duration = TimeSpan.FromSeconds(speed);
Story.Children.Add(da);

LayoutRoot.Resources.Add("story", Story);

Ahora que ya tenemos Siverlight 2.0 en la calle, nos podemos animar a desplegar nuestra aplicación a nuestros servidores, empresas de hosting y demás donde tengamos nuestros sites alojados. ¿Qué puede ocurrir casi siempre?, que no tengamos bien configurados los MIME Types y por tanto al intentar ejecutar la aplicación una vez desplegada tengamos el siguiente error que se ve en la imagen:

La solución pasa por añadir los siguientes MIME Types necesarios para hacer funcionar nuestra aplicación Silverlight:

.manifest - application/manifest
.xaml - application/xaml+xml
.dll - application/x-msdownload
.application - application/x-ms-application
.xbap - application/x-ms-xbap
.deploy - application/octet-stream
.xps - application/vnd.ms-xpsdocument
.xap - application/x-silverlight-app

Windows Presentation Foundation esta siendo tomado más en serio para la creación de aplicaciones cliente ricas a nivel empresarial, diferenciadoras y pensadas en el usuario final (aqui me diran que siempre se piensa en el usuario final y yo digo que tararí!!). Bueno a lo que vamos, nos piden que desarrollemos una aplicación con WPF que mejore la interfaz de usuario, experiencia del usuario, y en ocasiones su productividad (provocando acciones naturales que redundan en facilidad y rapidez de uso), y lógicamente que mantenga la funcionalidad de la aplicación predecesora.

Estamos en un escenario real, el cual ya no es una aplicación piloto sencillita realizada por dos o tres personas, sino una en la que necesitamos la participación de un equipo de desarrollo o varios, trabajando conjuntamente y bien orquestados. Aqui es donde entran los chicos del equipo de patterns & practices que han desarrollado una serie de recursos que facilitan precisamente esto que hemos planteado, el desarrollo de aplicaciones WPF modulares donde intervienen varios equipos ayudando a los arquitectos de software a plantear una arquitectura modular, escalable y donde la nueva funcionalidad sea sencilla de añadir.

Entre los activos que tenemos disponibles destacan:

• Una guía explicativa donde se centran en diferentes aspectos de arquitectura
• Hands-on-Lab
• Ejemplo de aplicación WPF utilizando estas prácticas
• Framework arquitectural

La dirección de principal de codeplex es la siguiente: http://www.codeplex.com/CompositeWPF

Mas información

El pasado julio, Carson Hager, el presidente y fundador de Cynergy empresa dedicada al desarrollo RIA con Adoble Flex/Air y Microsoft Silverlight/WPF, nos cuenta pequeños detalles de una comida organizada en la Microsoft Worldwide Partner Conference donde participó el propio Steve Ballmer.

De sus palabras escritas se extraen dos interesantes puntos:

• Que Microsoft está trabajando muy duro para ponerse a la par (y superar si puede) el trabajo realizado en el mundo Adobe y reproducirlo en el mundo Microsoft.
• Las altas instancias de Microsoft creen y por tanto apostarán, por que el diseño de software dirigido hacia la mejora de la experiencia del usuario será el futuro del desarrollo de software.

Yo también opino que el año próximo será muy interesante en el mundo UX.

PD: Que pena que Cynergy no este en España :)

Un poco tarde…Sí! Pero más vale tarde que nunca. El pasado 25 de septiembre Scott Guthrie en su blog avisó de la publicación de la primera Release Candidate de Silverlight 2.

Es una buena excusa para ir migrando nuestras aplicaciones Silverlight Beta 2 a esta versión que ya será muy similar a la versión final para estar preparados. Entre otras cosas hay que tener claro que esta versión es la Developer Runtime, pensada precisamente para que nos vayamos preparando a la versión final los desarrolladores, más que los usuarios finales :)

Y como ya ocurrió con el paso de la Beta 1 a la Beta 2, existen los consabidos Breaking Changes entre la Beta 2 y la RC.

No descubrimos la pólvora si decimos que ya hay un documento donde se especifican dichos cambios cuando compilemos con la RC y aquello escupa errores a diestro y siniestro: Breaking Change Between Beta2 and Release

Y cosas nuevas y como podemos leer en el post de Scott, entre los controles tenemos: PasswordBox, ProgressBar y ComboBox (Ea, ya va tomando forma esto, ahora a ver si para la versión final nos añaden el un WrapPanel), solución de bugs, Skins Controls y demás.

Como menciona este hombre y aunque ya hay un post suyo sobre eso, me parece interesante escribir un post sobre Visual State Manager en Castellano y con su código de ejemplo para descargar.

Casi lo olvido, el link donde está dicha versión: http://silverlight.net/GetStarted/sl2rc0.aspx

En el último post de la serie esta que comencé de "Las Cosas Claras" estuvimos viendo como podíamos acceder al DOM del explorador para, en el ejemplo, llamar a funciones javascript. Pues bien, hoy veremos como hacer precisamente lo contrario.

En el siguiente ejemplo veremos como desde javascript podemos provocar cambios en el Silverlight, en este caso cambiar la orientación de los elementos de un StackPanel, pero también podríamos provocar el inicio de una animación o pararla, etc.

En primer lugar utilizaremos el siguiente namespace ya que contiene lo necesario para realizar esto:

using System.Windows.Browser;

Centrándonos en la página principal del Silverlight Page.xaml. El código XAML será muy sencillo, un simple StackPanel con varios botones:

    <StackPanel x:Name="LayoutRoot" Background="White">
        <Button Content="Rojo" Background="Red"/>
        <Button Content="Verde" Background="Green"/>
        <Button Content="Azul" Background="Blue"/>
        <Button Content="Amarillo" Background="Yellow"/>
        <Button Content="Blanco" Background="White"/>
        <Button Content="Negro" Background="Black"/>
    </StackPanel>

Y en el código fuente debemos registrar la clase MiTipoScriptable para poderla usar desde javascript de la siguiente manera:

• En el evento Loaded de la página registraremos el objeto que será usados para acceder desde javascript al método.

HtmlPage.RegisterScriptableObject("slObject", this);

• Y por último decoraremos un método de la clase Page, donde hemos realizado el registro del objeto del punto anterior, con el decorador [ScriptableMember] el cual será el método al que podremos llamar desde javascript.

[ScriptableMember]
public void slMethod(string o)
{
    if (o != "H")
        LayoutRoot.Orientation = Orientation.Vertical;
    else
        LayoutRoot.Orientation = Orientation.Horizontal;
}

Ahora nos vamos a la página ASPX desde la cual llamaremos al método slMethod del Silverlight. Para esto en primer lugar obtendremos el contenedor del Silverlight el cual en nuestro caso del ejemplo se llama SilverlightContainer y por último accederemos al método registrado mediante la siguiente sintaxis:

function Orientacion(oo)
{
    var slPlugin = $get("SilverlightContainer");
     
    slPlugin.Content.slObject.slMethod(oo);
}

PD: Se han creado dos botones Vertical y Horizontal que llamarán a la función Orientacion para cambiar el tipo de orientación del StackPanel.