Silverlight 4 Beta – Brocha HTML
Posted on : 10-12-2009 | By : Rodrigo | In : Silverlight 4
Tags: HtmlBrush, Silverlight 4, WebBrowser
1
En un artículo anterior dimos a conocer el nuevo control WebBrowser, incluído como parte de Silverlight 4 Beta, el cual nos permite mostrar contenido HTML en nuestras aplicaciones Fuera del Navegador, siendo ese contenido un HTML creado de manera dinámica o incluso alguna página Web externa. En este artículo detallaremos el elemento HtmlBrush que nos brinda la oportunidad de ‘pintar’ nuestros elementos con el contenido cargado en el control WebBrowser.
El proyecto
Iniciaremos creando un nuevo proyecto de Silverlight 4 en Visual Studio 2010 Beta 2 y aceptaremos la opción predeterminada de crear una aplicación Web para probar la aplicación.
Clase HtmlBrush
La clase HtmlBrush es una clase derivada de TileBrush y nos permite usar un control WebBrowser con contenido HTML como fuente para poder pintar cualquier propiedad de tipo Brush en los elementos de Xaml. La clase tiene la propiedad SourceName la cual indica el nombre del control WebBrowser que deseamos utilizar como fuente. Asimismo, expone el método SetSource() para que programáticamente podamos establecer la fuente sobre este tipo de brocha. El siguiente fragmento de código muestra la utilización más básica de esta brocha en Xaml:
<Ellipse.Fill>
<HtmlBrush x:Name="htmlbrush"
SourceName="wb" />
</Ellipse.Fill>
…
El código anterior establece la propiedad SourceName al WebBrowser deseado, en este caso identificado con la variable wb.
HtmlBrush.Redraw()
La clase expone el método públic Redraw() el cual obliga a la brocha a dibujarse asimisma ya que no lo hace de manera automática. Por este motivo, si tenemos como contenido del WebBrowser alguna página Web que incluya alguna animación o video necesitaremos ejecutar este método de manera recurrente, tal vez a través de un DispatcherTimer. El siguiente fragmento de código muestra dicha técnica:
DispatcherTimer timer = new DispatcherTimer() { Interval = TimeSpan.FromMilliseconds(500) };
timer.Tick += (s, a) => htmlbrush.Redraw(); //Obliga a la brocha a dibujarse asimisma
timer.Start();
Cabe mencionar que esta brocha está disponible únicamente en Aplicaciones Fuera del Navegador, ya que ese es uno de los requisitos para el control WebBrowser.
Resultado
La siguiente figura muestra la aplicación aquí descrita finalizada, en donde podemos observar que la elipse del lado derecho es ‘pintado’ por medio de la brocha de tipo HtmlBrush. Asimismo, la aplicación incluye un control de tipo Slider enlazado a una Proyección en Perspectiva, para poder corroborar que el comportamiento de esta clase es similar al resto de brochas ya conocidas en la plataforma.
Puedes descargar el código aquí
Puedes ver el demo en vivo aquí (requiere Silverlight 4 y tener la aplicación Fuera del Navegador)
