Archive

Posts Tagged ‘Silverlight 3 beta’

Desarrollo con Silverlight en Visual Studio 2010 Beta 1

May 20th, 2009 No comments

Solo si han estado debajo de una piedra no sabrán que el día de hoy fue liberado públicamente el Beta 1 de Visual Studio 2010.  La nueva versión de esta herramienta incluye enormes mejoras que merecen un artículo cada una de ellas junto con las nuevas características que podemos encontrar en el .NET Framework 4.0, pero en este artículo nos enfocaremos al desarrollo de aplicaciones de Silverlight con Visual Studio 2010 Beta 1.

Hola Visual Studio 2010

Uno de los primeros cambios evidentes que podemos encontrar en Visual Studio 2010 es que la lista de plantillas de proyectos ahora está un poco más organizada, nos ofrece la capacidad de filtrar plantillas según la versión del .NET Framework al que deseamos apuntar, un cuadro de texto para buscar a través de una cadena en las plantillas, además de permitir ordenamiento por nombre de manera ascendente o descendente:

Caja de diálogo de Nuevo Proyecto en Visual Studio 2010

Crearemos una nueva aplicación llamada SL2010 usando la plantilla de Silverlight Application.  Otro cambio presente en esta nueva versión será en la caja de diálogo “Add Silverlight Application” (Agregar Aplicación de Silverlight), ya que nos permitirá elegir la versión de Silverlight a la que deseamos apuntar! 

Caja de diálogo Add Silverlight Application en Visual Studio 2010

Una mejora que sin duda es una de las más solicitadas desde hace tiempo es la capacidad de utilizar Visual Studio con múltiples monitores, esto ya es posible si simplemente desacoplan alguna ventana y la pasan al monitor que deseen.  En la siguiente foto se muestra en la parte izquierda el IDE de Visual Studio 2010 y en el monitor de la izquierda el editor de código fuente de Page.xaml.cs de la solución que acabamos de crear en los pasos anteriores:

Soporte de múltiples monitores en Visual Studio 2010

El editor es donde más cambios y mejoras vamos a poder apreciar.  Visual Studio 2010 Beta 1 trae consigo un soporte mucho más robusto para edición de Xaml de manera visual.  En esta nueva versión podremos editar desde la ventana de Propiedades los valores de las propiedades de elementos y/o controles sin necesidad de hacerlo directamente en el código Xaml.  La siguiente figura muestra el soporte incluso de propiedades de tipo Brush en donde podemos notar cómo la experiencia es similar a la que podemos encontrar en Expression Blend:

Editor de Brochas en Visual Studio 2010

En el editor también podemos crear y manipular las propiedades de los contenedores, por ejemplo el Grid el cual nos provee un mecanismo de distribución a través de columnas y filas –similar a una tabla-.  En el mismo editor (similar a la experiencia en Expression Blend) podemos crear las columnas filas necesarias para el contenedor, y asimismo indicar el tipo de unidad que deseamos para la altura o ancho: *, Auto o fijo:

Otra característica bastante útil y que no está presente en Visual Studio 2008 es la capacidad de arrastrar y colocar controles y elementos en el mismo editor.  La versión 2008 se limitaba a permitirnos únicamente arrastrar y colocar los controles en el editor de código Xaml: algo bastante inútil.  Ahora en esta nueva versión de Visual Studio 2010 Beta 1 el editor se comporta tal y como lo esperamos, similar al comportamiento que tiene Expression Blend cuando tratamos de realizar la misma tarea, incluso similar a las aplicaciones ASP.NET:

Un editor –decente pero no tan potente como en Blend- de Data Bindings también está disponible para nosotros en esta versión.  Esta característica nos permite establecer y editar enlace a datos desde la ventana a propiedades.  A diferencia de Blend, en Visual Studio no hay una manera visual para crear recursos en un control de usuario de Silverlight, no obstante teniendo la fuente de datos ya declarada en el Xaml podemos una manera sencilla el binding utilizando el editor contextual en la ventana de Propiedades:

Los Markup Extensions como {Binding} ahora muestran sus propiedades inherentes en Intellisense, lo cual es una magnífica mejora cuando estamos escribiendo este tipo de objetos:

Visual Studio 2010 es lo suficientemente hábil para mostrarnos aquellos recursos que tenemos disponibles y que están a nuestro alcance, para poderlos utilizar en aquellas propiedades en las que hagan sentido.  Tal es el caso de un DataTemplate declarado en el diccionario de recursos a nivel del UserControl en la aplicación que aquí se muestra, en donde podemos apreciar cómo se despliega como opción en la propiedad ItemTemplate de un ListBox:

Finalmente, una característica muy importante y práctica que podemos encontrar en Visual Studio 2010 es la posibilidad de escalar o des-escalar la versión de nuestra aplicación entre Silverlight 2 y Silverlight 3.  Esto es una gran ventaja si estás desarrollando en una versión específico pero quieres comprobar cómo se comporta si cambias de versión. 

Ventana de propiedades del proyecto de Silverlight en Visual Studio 2010

Obviamente si des-escalas una aplicación de Silverlight 3 a Silverlight 2 perderás todas las características inherentes a esa versión, y viceversa: si escalas tu proyecto de Silverlight 2 a 3 inmediatamente podrás utilizar todas las nuevas funcionalidades presentes en la última versión.  Nota: si haces un cambio de versión por medio de esta opción no cambiarán adecuadamente los parámetros MinimumVersion y minRuntimeVersion de las páginas .aspx y .html respectivamente.

Resumen

Visual Studio 2010 Beta 1 es la primer versión estable de la próxima generación de herramientas para desarrollo de aplicaciones .NET.  Cuenta con un soporte mucho más amplio para el diseño y codificación de Xaml y por ende de Silverlight.  Además cuenta con la opción de permitirnos elegir sobre cuál versión de Silverlight queremos programar, lo que hace de esta herramienta una de los más importantes y esperados lanzamientos en lo que al desarrollo de Silverlight respecta.

Descarga la serie de WebCasts de Silverlight 2 y 3

May 20th, 2009 No comments

Ya están disponibles para descarga la Serie de WebCasts de Silverlight 2 y 3 que tuve la oportunidad de presentar hace algunos días.  Si no estuviste presente o si quieres revivir esos momentos en los que se me fue el LiveMeeting :D puedes descargar los videos y verlos en la comodidad de tu hogar/oficina.

Las ligas para descarga son las siguientes:

· Introducción y Arquitectura

· Enlace a Datos y Comunicación con Servidores (Servicios)

· Enlace entre Elementos, Ejecución Fuera del Navegador, Comunicación Local y Soporte a 3D

Salu2!

Silverlight 3 Beta 1: Enlace con RelativeSource

May 15th, 2009 No comments

Silverlight 3 Beta 1: Enlace con RelativeSource

Hace algunos días escribí acerca del Enlace entre Elementos, una de las nuevas características presentes en Silverlight 3 Beta 1 (tomadas de su hermano mayor WPF).  Para complementar ese artículo he decidido hablar por separado de RelativeSource: una propiedad que podemos encontrar en el markup extension Binding.  Esta propiedad en Silverlight soporta dos valores tal y como se describen a continuación:

Self

Cuando establecemos un Binding con RelativeSource=Self estamos indicando que el origen del enlace es el mismo elemento en donde lo estamos estableciendo.  El siguiente fragmento de código explica mejor este concepto:


En este ejemplo tenemos una Ellipse un Slider.  La propiedad Width de la Ellipse está enlazada con la propiedad Value del Slider, justo como lo vimos en este artículo.  Aquí el punto interesante es ver cómo la propiedad Height está enlazada a la propiedad Width de el elemento mismo.  Esto es logrado estableciendo la propiedad RelativeSource a Self, a través del markup extension {RelativeSource}.

TemplatedParent

El otro valor que podemos establecer en RelativeSource es TemplatedParent.  Esta opción indica que el valor lo tomará del control en donde estemos aplicando la plantilla en cuestión, por lo tanto esta opción solo es válida dentro de la declaración de una Platilla.  El siguiente código muestra la declaración de una nueva plantilla para un Botón, llamada ‘miEstilo’.  Dentro de esta Plantilla se declara un TextBlock el cual pone en su propiedad Text el valor de la propiedad Height del control en donde se está aplicando la Plantilla (botón ‘btn’):


Cabe mencionar que esta opción es similar a utlizar {TemplateBinding} dentro de la Plantilla.

Resumen

Las nuevas características de Enlace presentes en Silverlight 3 Beta 1 extienden la funcionalidad y abren nuevas oportunidades para el desarrollo de aplicaciones con esta plataforma.

Para ver una aplicación en vivo que demuestra los conceptos expuestos pueden revisarla aquí (el plugin de Silverlight 3 Beta 1 es requerido).

Web Casts: Silverlight 2 y 3 para Desarrolladores y Diseñadores

April 29th, 2009 No comments

Curso gratis de Silverlight 3

Serie de tres Web Casts: Silverlight 2 y Silverlight 3 para Desarrolladores (y Diseñadores ;))

¿Quieres saber qué tiene Silverlight para ti y tus aplicaciones?

¿Tienes dudas acerca de esta tecnología?

¿Quieres de una vez por todas adentrarte en esta tecnología de una manera rápida, práctica y divertida?

Los invito cordialmente a que asistan a una serie de Web Casts de entrenamiento gratuito acerca de Silverlight 2 y Silverlight 3 Beta 1.  En estos Web Casts platicaremos acerca de Silverlight como plataforma de desarrollo usando las nuevas características de la plataforma:  Silverlight 3 Beta 1 anunciado por Microsoft hace algunas semanas en el MIX09; aunque claro está, también utilizaremos Silverlight 2 para que aprecien lo que tienen a su alcance hoy en día! 

Estos Web Casts son de unos 10 minutos de teoría y el resto de puro código, :) así que se los recomiendo ampliamente.

El entrenamiento es totalmente gratis, con una duración aproximada de 3 1/2 horas (sumando los tres días)

Fechas

11 al 13 de Mayo a las 5:00pm Hora de Guadalajara/Monterrey/Ciudad de México

Registro

http://msevents.microsoft.com/CUI/WebCastEventDetails.aspx?EventID=1032414027&EventCategory=2&culture=es-MX&CountryCode=MX

3 días… 3 horas…  Silverlight 3 :)

Me daría mucho gusto que estén presentes, así que los(as) espero!!!

Categories: Eventos Tags: ,

Silverlight 3 Beta 1: Enlace entre Elementos

April 26th, 2009 No comments

Silverlight 3 Beta 1: Enlace entre Elementos

El enlace entre elementos (Element Binding), presente en WPF, es una de las nuevas características que podemos encontrar en Silverlight 3 Beta 1 y que nos brinda una mayor potencia al crear nuestras aplicaciones en esta plataforma, ya que permite hacer atado de propiedades (binding) de manera directa entre elementos, sin tener que utilizar code-behind o alguna clase intermediario que controle esta relación (similar a lo que sucede con un ViewModel en el patrón MVVM).

Propiedad ElementName

El enlace entre elementos es logrado a través de la propiedad ElementName de la clase Binding.  En esta propiedad indicamos el nombre del elemento al que nos queremos atar, y complementamos el atado usando Path para indicar el nombre de la propiedad a la que nos queremos atar.

El siguiente fragmento de código muestra una implementación sencilla de esta característica:

En el código podemos observar un rectángulo, el cual su propiedad Width está enlazada con la propiedad Value del Slider llamado slider.  La extensión Binding hace uso de Path y ElementName (de hecho, podríamos quitar la invocación de “Path=” ya que precisamente es la propiedad por default).

La siguiente figura muestra esta sencilla aplicación en ejecución:

Un buen ejemplo: Enlace entre datos para controles maestro – detalle

Un lugar donde es benéfico utilizar esta característica es en las aplicaciones que tengan controles que muestren datos maestro – detalle.  Tal es el caso por ejemplo de una lista de datos, que al darle clic nos despliegue el detalle de ese elemento seleccionado en diferentes tipos de controles.

Veamos el siguiente ejemplo: una aplicación que muestra en un ListBox una lista de personas, y al darle clic en alguna de ellas se muestra el resto de datos en controles específicos:

Típicamente con Silverlight 2 tendríamos que crear un manejador para el evento SelectionChanged del ListBox, obtener el elemento seleccionado y establecerlo como DataContext del contenedor de los controles del detalle, es decir, algo similar a esto:

Ahora con esta característica de Enlace o Atado entre Elementos en Silverlight 3 Beta 1 podemos establecer dicha relación de manera declarativa:

Como podrán observar, la propiedad DataContext se está enlazando al elemento seleccionado (propiedad SelectedItem) del ListBox.

Resumen

El Enlace entre Elementos o Element Binding, existente en WPF e incorporado en Silverlight 3 Beta 1 nos permite establecer relación entre elementos de manera declarativa, ahorrándonos código en el code-behind de nuestras aplicaciones logrando así código más sencillo, claro y sobre todo mantenible.  El código fuente del ejemplo lo pueden encontrar en la sección “contenido” de La Liga Silverlight.

Silverlight 3 Beta 1: Conexión Local

April 18th, 2009 No comments

Silverlight 3 Beta 1: Conexión Local

Introducción

Nuevo en Silverlight 3 tenemos una nueva característica que permite comunicarnos entre diferentes aplicaciones dentro de la misma máquina.  Esta característica está bautizada como Conexión Local (Local Connection en inglés).  Si bien en Silverlight 2 tenemos la posibilidad de comunicarnos entre diferentes aplicaciones dentro de la misma página no es una tarea trivial; además tratar de hacerlo entre diferentes instancias de navegadores es prácticamente un infierno.

Esta nueva funcionalidad nos ofrece un mecanismo poderoso para poder complementar nuestros aplicativos que requieran tener comunicación entre sí, ya que implementar esta característica es bastante sencillo como lo demostraremos en este artículo.

System.Windows.Messaging

Todas las clases necesarias para la implementación de la conexión local entre aplicaciones están incluidas en el espacio de nombres System.Windows.Messaging

Clase LocalMessageSender

Esta clase permite el envío de mensajes a un receptor por medio del nombre especificado.  Además permite establecer el nombre del dominio en el que se encuentra el receptor.  Incluye el método SendAsync() el cual enviará el mensaje de manera asíncrona al receptor.  Una vez enviado el mensaje se disparará el evento SendCompleted, el cual incluye en sus argumentos la propiedad Error la cual nos indica si sucedió una excepción durante el envío del mensaje.

Clase LocalMessageReceiver

Análoga a la clase LocalMessageSender, esta clase nos permite recibir mensajes.  También aquí establecemos el nombre del receptor, que deberá concordar con el nombre establecido en el objeto de tipo LocalMessageSender.  Una vez recibido un mensaje se dispara el evento MessageReceived el cual incluye en sus argumentos la propiedad Message de tipo string, misma que contiene el mensaje enviado por la aplicación origen.

Además de esto podemos especificar los dominios válidos de los que puede recibir mensajes este objeto!

Modelo Publicador-Subscriptor

Es a través de este modelo publicador-subscriptor por el cual podemos implementar comunicación entre diferentes aplicaciones de Silverlight 3 en la misma página, o en diferentes pestañas del Navegador… incluso entre diferentes instancias de Navegadores, INCLUSO entre diferentes tipos de Navegadores (IE, FF, GC, etc.!).

Es importante mencionar además que una aplicación de Silverlight no está limitada a ser únicamente publicador o subscriptor, sino que puede ser ambos!  Esto es, podemos establecer una comunicación local bidireccional entre aplicaciones.  El único requisito es tener los objetos LocalMessageSender y LocalMessageReceiver en cada aplicación de manera correcta.

 

La Solución

La solución que crearemos estará compuesta de dos aplicaciones Silverlight.  La aplicación Origen permitirá la captura de contenido Xaml dentro de un TextBox e incluirá un botón para enviar el Xaml a la aplicación Destino.

La aplicación Destino por su parte estará escuchando nuevos mensajes que le envíe la aplicación Origen.  Cuando llegue efectivamente un mensaje, interpretará el Xaml convirtiendo todo el árbol de contenido en los elementos visuales correspondientes al código, y los dibujará dentro de un Grid llamado LayoutRoot.

Ambos proyectos de Silverlight estarán contenidos en una misma solución, la cual también incluirá una Aplicación Web para poder probar la funcionalidad.  Además ambos proyectos estarán relacionados a la misma Aplicación Web para que nos cree automáticamente las páginas de prueba.  La siguiente figura muestra la estructura de la solución:

Origen

La aplicación Origen contiene un TextBox para escribir una cadena de Xaml válida que se enviará al destino.  Además contiene un botón que hará efectivamente el envío del mensaje.  El siguiente fragmento de código muestra la implementación de la aplicación Origen:

Destino

La aplicación Destino recibirá el mensaje enviado por el Origen:

Noten cómo se establece el nombre del receptor como “SL3ConexionLocal”.  Posteriormente se comienza a escuchar por mensajes usando el método Listen() y cuando uno es recibido efectivamente se interpreta a un objeto de tipo UIElement a través del método XamlReader.Load().

Al ejecutar la aplicación Origen en un Navegador y la aplicación Destino en otro (usando las páginas de prueba creadas automáticamente para cada aplicación) podemos comprobar esta funcionalidad:

El siguiente ScreenCast muestra la solución construida en este artículo ejecutándose incluso usando un segundo publicador (aplicación Origen corriendo en FireFox).  También es notable el uso de tres diferentes tecnologías de Navegadores lo cual muestra la capacidad que tiene Silverlight para ejecutarse en múltiples ambientes.

Silverlight 3 – Conexión Local

Resumen

La Conexión Local incorporada en Silverlight 3 permite comunicarnos de una aplicación a otra a través de un mecanismo de publicación-subscripción.  Esta interesante y poderosa funcionalidad abre nuevos paradigmas en el desarrollo de aplicaciones RIA, ya que su modelo de programación es bastante sencillo y sus alcances en soluciones con Silverlight son innumerables.

Silverlight 3 Beta 1: Conciencia de Conexión

April 16th, 2009 No comments

Silverlight 3 Beta 1:  Conciencia de Conexión

El nuevo espacio de nombres System.Net.NetworkInformation de Silverlight, incorporado en Silverlight 3 Beta 1 nos permite implementar una funcionalidad de “conciencia” de conexión en nuestras aplicaciones, esto es, saber en un momento dado si la aplicación está ejecutándose en un ambiente conectado o ha perdido la conexión; para poder determinar un comportamiento correcto en cada uno de esos escenarios.  Esta funcionalidad nos sirve tanto para aplicaciones que se estén ejecutando dentro del Navegador como en aplicaciones Fuera del Navegador, es por eso que dejé este tema como un artículo por separado (ver el artículo Silverlight 3 Beta 1:  Fuera del Navegador para más información al respecto de este tipo de aplicativos).

Clase NetworkInterface

Esta clase abstracta incluye el método estático GetIsNetworkAvailable(), el cual nos indica si hay una conexión de red o no.

Es muy importate mencionar que este método NO indica si hay una conexión a Internet, es decir, no está directamente relacionado una conexión de red disponible a una conexión en Internet efectivamente.  Una manera para conocer si tenemos una conexión a Internet es hacer ping a un sitio conocido y con alta disponibilidad (ejemplo: www.microsoft.com, o www.yahoo.com) y/o utilizar las clase WebClient para descargar un archivo conocido en nuestro servidor donde esté hospedada la aplicación, por ejemplo: un archivo de texto pequeño que podamos descargar y leer para determinar si efectivamente tuvimos acceso a través de Internet.

El siguiente fragmento de código muestra cómo podemos utilizar NetworkInterface.GetIsNetworkAvailable() para determinar si tenemos una conexión de red:

Clase NetworkChange

Un paso más adelante en esta funcionalidad está la clase NetworkChange la cual incluye el evento NetworkAddressChanged.  Este evento es disparado cuando hay un cambio en el estado de la conexión de red y está basado en el delegado NetworkAddressChangedEventHandler.  Si lo usamos junto con NetworkInterface.GetIsNetworkAvailable() podemos tener un mecanismo para automáticamente saber si nuestra aplicación está ejecutándose en un ambiente con o sin conexión.

Nota: Este evento no se disparará si simplemente pones tu Navegador ‘Work Offline’

Construyendo la Clase NetworkChangeExtended

Gracias a que la clase NetworkChange no está marcada como sellada, podemos crear fácilmente una clase que extienda esta funcionalidad para determinar no solo si hay conectividad de red, sino determinar que exista realmente conexión a Internet.

A continuación les presento el código de una clase llamada NetworkChangeExtended, la cual efectivamente hereda de NetworkChange pero que incluye la funcionalidad para detectar si hay conexión de Internet o no, por medio del uso de un objeto de tipo WebClient para descargar un archivo de texto llamado Archivo.txt.  Archivo.txt deberá estar en el sitio de origen (/ClientBin de manera predeterminada) y deberá contener algo de texto.

Para usarla simplemente nos inscribimos al evento InternetAvailable, el cual se disparará cuando haya un cambio en el estado de la conexión a Internet:

El siguiente screencast muestra el uso de esta clase en una aplicación de Silverlight 3 beta 1.  El screencast muestra cómo inicialmente se cuenta con acceso a Internet, posteriormente se desconecta el cable de red logrando así que la clase detecte el cambio y despliegue en el TextBlock si hay conexión a Internet o no.  Finalmente se vuelve a conectar el cable para tener el estado inicial.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Resumen

La funcionalidad de Conciencia de Conexión presente en Silverlight 3 Beta 1 es un instrumento bastante útil para que nuestras aplicaciones puedan determinar si están ejecutando en un ambiente con conectividad de red o no.  Asimismo, vimos cómo es fácil extender dicha funcionalidad para incluir un mecanismo de detección de acceso a Internet, a través de una clase que extienda la clase NetworkInterface y que haga uso de un objeto WebClient para descargar asíncronamete un archivo del servidor, por lo tanto determinar la presencia de una conexión a Internet.

Silverlight 3 Beta 1: Aplicaciones Fuera del Navegador

April 13th, 2009 3 comments

Silverlight 3 Beta 1:  Aplicaciones Fuera del Navegador

Introducción

Una de las características nuevas incluidas en la última versión de Silverlight: Silverlight 3 Beta 1 es el soporte a que nuestras aplicaciones puedan ejecturse fuera del navegador (OOB por sus siglas en inglés Out Of Browser), esto es, que no tengas que navegar a página equis de sitio ye para poder correr dicha aplicación.  Más que un simple código que debemos agregar a nuestra aplicación, esta característica tiene muchos detalles que vale la pena explicar paso a paso.  El objetivo de este artículo es precisamente eso.

Elemento Deployment.ApplicationIdentity

Para que nuestra aplicación pueda ser ejecutada fuera del navegador necesitamos habilitar esta opción modificando el manifiesto (implementado en el archivo AssemblyManifest.xml) de nuestro proyecto de Silverlight 3 agregando el elemento ApplicationIdentity.  Con este elemento podemos establecer diversas propiedades para nuestra aplicación como el nombre, el título de la ventana, la descripción y los iconos a mostrar cuando esté la aplicación como acceso directo en el escritorio, en la barra de tareas, etc.

Cabe mencionar que las plantillas de Silverlight 3 Beta 1 para Visual Studio .NET 2008 ya incluyen el elemento ApplicationIdentity encerrado en un bloque de comentario, para simplemente “descomentarlo” y habilitar la opción de una manera sencilla.  Por el otro lado, si estás convirtiendo un proyecto de Silverlight 2 a Silverlight 3 Beta 1 –como es el caso de este artículo-, el Asistente de Conversión NO agregará de manera automática el elemento ApplicationIdentity y lo tendrás que agregar manualmente.  A esto debemos añadir que no hay actualmente soporte de Intellisense para este elemento cuando lo estamos editando en Visual Studio.

Ahora para que este artículo esté basado en una aplicación real voy a utilizar el ejemplo del Silverlight Fred (sencillo juego de memoria que asemeja al Fabuloso Fred: famoso juguete en la década de los 80) publicado hace algunos días y le agregaremos la característica de ejecutar Fuera del Navegador.

Iconos

El elemento Deployment.ApplicationIdentity soporta el subelemento ApplicationIdentity.Icons en el cual podemos establecer los iconos que nuestras aplicación requiera.  Podemos establecer cuatro tamaños para los iconos:

  • 128×128
  • 48×48
  • 32×16
  • 16×16

El tamaño de 128×128 es utilizado por la caja de diálogo cuando estemos “instalando” la aplicación Fuera del Navegador, el resto son utilizados por el Sistema Operativo para el acceso directo del escritorio (en Windows), el icono para la ventana de la aplicación, el taskbar, etc.)

El siguiente código muestra el manifiesto completo del proyecto de Silverlight 3 con el elemento ApplicationIdentity incluido:

En este caso estoy usando cuatro iconos, uno para cada tamaño en formato en PNG.  Es importante comentar que los iconos deberán estar marcados como “Content” en Visual Studio para que sean parte del .XAP y no como recursos adjuntos del ensamblado principal:

Instalación

Podemos instalar las aplicaciones Silverlight 3 Fuera del Navegador de dos maneras:

  1. Programáticamente, en respuesta a un evento lanzado por el usuario (el clic de un botón, el presionar una tecla, etc.) utilizando el método Application.Current.Detach()
  2. Haciendo clic secundario en la aplicación en el Navegador y seleccionar la opción de “Instalar <nombre de aplicación> en este equipo”

La siguiente figura muestra la opción en el menú contextual al hacer clic-secundario sobre la aplicación en el Navegador:

Ahora bien, sea cual fuese el mecanismo por el cual se instala la aplicación de Silverlight 3 Fuera del Navegador, se mostrará la siguiente caja de diálogo:

Es en esta caja de diálogo en donde determinamos si queremos un acceso directo en nuestro escritorio o en el grupo de programas, además podemos observar cómo es mostrado el icono de tamaño 128×128 anteriormente descrito en este artículo.

Una vez creado los o el acceso directo podremos ejecutar la aplicación tal y como si fuera una aplicación que haya sido instalada de manera local:

Ahora bien: ¿Cuál es la ruta de ese acceso directo? ¿A qué programa o archivo apunta?  Debemos recordar que las aplicaciones Silverlight son un archivo con extensión .XAP que no es más que un archivo .ZIP el cual incluye todo lo necesario para ejecutarse, pero NO es un ejecutable per sé, no es un tipo de archivo que el Sistema Operativo entienda como ejecutable.

 

sllauncher.exe

Si vemos las propiedades del acceso directo creado al instalar la aplicación Fuera del Navegador podemos observar que es un acceso al Microsoft Silverlight Offline Launcher o sllauncher.exe.  Este aplicativo permite la ejecución de aplicaciones .XAP de Silverlight ya que *emula* precisamente el comportamiento de un Navegador.

El sllauncher.exe recibe como parámetro el identificador de la aplicación a ejecutar, en el caso de este artículo “localhost.0” es el identificador.  El identificador de la aplicación o AppID está compuesto por <nombre del dominio>.<secuencia> en donde “secuencia” es el número de aplicaciones que has instalado de ese dominio, es decir, la siguiente aplicación Fuera del Navegador sería localhost.1 la siguiente localhost.2 y así sucesivamente.

Ejecutemos la aplicación Fuera del Navegador utilizando el acceso directo. 

Un hecho importante es que esa aplicación es una instancia diferente a la instancia que se está ejecutando en el Navegador, esto debido a que cuando “instalamos” una aplicación de Silverlight Fuera del Navegador esa aplicación es colocada en un fólder especial en la siguiente ruta:

C:\Users\<Nombre del Usuario>\AppData\LocalLow\Microsoft\Silverlight\Offline\<Identificador de la aplicación>

Asimismo no debemos perder de vista que aunque la aplicación esté ejecutándose afuera de un Navegador, la aplicación sigue estando en un sandbox de baja confianza.  Esto significa que si bien nuestras aplicaciones de Silverlight 3 están “viviendo” en el equipo del cliente no pueden tener acceso a recursos fuera de ese sandbox, por ejemplo no pueden tener acceso a los puertos del equipo, ejecutar ensamblados que requieran permisos especiales y un largo etcétera.  Esta característica es hoy en día motivo de polémica ya que muchas personas les gustaría ver a Silverlight 3 con todos los permisos como cualquier aplicación local.  En mi particular punto de vista esto sería contraproducente por motivos de riesgos en la seguridad así como también por el hecho que Silverlight está pensado para hacer aplicaciones tipo RIA, distribuibles a través de la Web.  En todo caso para eso tenemos al alcance de nuestra mano WPF y/o otras tecnologías, claro está, no son multi-plataforma como lo es Silverlight pero ese es tema de otro artículo.

Metadatos

Es en este fólder donde precisamente vamos a encontrar el archivo .XAP junto con otros archivos de metadatos creados automáticamente por el runtime de Silverlight 3 para poder ejecutar esa aplicación Fuera del Navegador.  El archivo metadata que encontramos en este fólder incluye información acerca de la aplicación como la fuente original del archivo .XAP, en qué archivo HTML hospedar la aplicación Silverlight, el título y descripción de la aplicación y el AppID:

Y hablando precisamente del archivo HTML que hospedará la aplicación .XAP, podemos darnos cuenta que no es más que un archivo HTML normal, que incluye el elemento <object> para instanciar el plugin de Silverlight.  La fuente del plugin de Silverlight tiene la sintaxis offline://<app ID> tal y como lo muestra el siguiente fragmento de código tomado del archivo index.html; generado automáticamente por Silverlight al “instalar” nuestra aplicación Fuera del Navegador:

Un punto que en lo personal espero ver en las próximas versiones de Silverlight 3 es la posibilidad de personalizar este archivo HTML y tener más control sobre él ya que por el momento es creado automáticamente sin intervención alguna del usuario o de los desarrolladores.  Esperemos que así suceda en un futuro.

Almacenamiento Aislado

Ya que la capacidad Fuera del Navegador de Silverlight 3 está pensada para un escenario de aplicaciones desconectadas o probablemente frecuentemente desconectadas el Almacenamiento Aislado de Silverlight 3 para las aplicaciones Fuera del Navegador es aumentado automáticamente de 1MB a 25MB, esto con el objetivo de permitir a nosotros los desarrolladores el tener más espacio para guardar datos para efectivamente permitir un escenario offline, sin necesidad de solicitar un incremento del tamaño del espacio al usuario final.  Nota:  Estos 25MB no son regresados a 1MB cuando *desinstalamos” la aplicación Fuera del Navegador.  Este es un comportamiento de la versión Beta 1 de Silverlight 3 y probablemente cambie en próximas versiones.

También debemos tomar en cuenta un punto muy importante:  tanto la aplicación Fuera del Navegador (fuera de línea) como su versión Dentro del Navegador (en línea) utilizan el mismo Almacenamiento Aislado, un hecho bastante importante para escenarios de sincronización una vez re-establecida la conexión de la aplicación, o para guardar configuración, estado, etc.

El Puente HTML y las aplicaciones Fuera del Navegador

Si tu aplicación de Silverlight 3 en el Navegador utiliza el Puente HTML (el componente de Silverlight que sirve para comunicarnos al DOM), esta característica está deshabilitada de manera predeterminada en las aplicaciones Fuera del Navegador de Silverlight 3 Beta 1.  Si ejecutan algún método del Puente HTML (implementado en la clase HtmlPage), causará una excepción con el siguiente mensaje de error:

AHORA bien, SÍ podemos habilitar el Puente HTML editando directamente el archivo index.html, agregando simplemente el parámetro enablehtmlaccess y establecerlo a true.  En este caso sllauncher.exe se comporta como cualquier Navegador ya que es capaz de entender la funcionalidad de los métodos que la clase HtmlPage expone; tanto navegar a una página Web por medio de HtmlPage.Window.Navigate() como crear elementos HTML de manera dinámica como la siguiente ilustración lo demuestra:

El código del botón para demostrar que sí podemos habilitar el Puente HTML si lo forzamos es el siguiente: