Introducción
Como mencionábamos en el artículo anterior, Silverlight puede ser hospedado en prácticamente cualquier tecnología Web del lado del Servidor. Asimismo podemos utilizar las características de la tecnología que estemos utilizando para poder crear Xaml de manera dinámica y enviar dicho contenido a la aplicación Silverlight ya sea a través de parámetros de inicialización (parámetro InitParams en <object>) o a través de un endpoint que podamos descargar por medio de un objeto de tipo WebClient. Es este último caso el que usaremos en este artículo para crear contenido dinámico con PHP.
Creación del proyecto
Siguiendo los mismos pasos que usamos en el artículo anterior para la creación de un Sitio Web en IIS y una aplicación Silverlight, crearemos un nuevo proyecto de tipo Silverlight Application en Visual Studio .NET con el nombre PHPDynamicXaml. Inmediatamente después de haber creado el proyecto borraremos los archivos Default.aspx y PHPDynamixXamlTestPage.aspx y sus archivos relacionados, dejando únicamente el archivo .html.
Agreguemos ahora un archivo llamado Content.php usando la plantilla de Archivo de Texto disponible al seleccionar la opción “Agregar nuevo elemento” en el menú contextual del proyecto. La siguiente figura muestra la ventana de Solution Explorer y la Solución actual:
Será en el archivo Content.php en donde escribiremos el código necesario para la creación dinámica de contenido Xaml. En nuestro ejemplo el contenido será una serie de rectángulos, el cual su número será definido por medio de un parámetro en el Querystring llamado r. El siguiente fragmento ejemplifica el código de PHP necesario para la construcción dinámica de contenido en Xaml:
|
1 |
<?php |
|
1 |
header('Content-Type: text/xaml'); |
|
1 |
|
|
1 |
$cuantos = 0; |
|
1 |
|
|
1 |
if ($_GET["r"]!=null) |
|
1 |
$cuantos = $_GET["r"]; |
|
1 |
|
1 |
echo "<Canvas xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' Width='800' Height='600'>"; |
|
1 |
for ($i=1; $i<=$cuantos; $i++) |
|
1 |
{ |
|
1 |
echo "<Rectangle Canvas.Top='" . $i * 10 . "' Canvas.Left='" . $i * 10 . "' Width='30' Height='30' Fill='Red' Stroke='Black' />"; |
|
1 |
} |
|
1 |
echo "</Canvas>"; |
|
1 |
?> |
Es importante resaltar en especial la siguiente línea:
header(‘Content-Type: text/xaml’);
la cual establece que el tipo de contenido que regresará la página .php será de tipo Xaml (también funciona con el content type text/xml ya que Xaml no es más que Xml). Lo anterior es de suma de importancia ya que estamos redefiniendo el comportamiento predeterminado que tiene PHP de regresar HTML.
Ahora bien, como podrán darse cuenta el código obtiene el número de rectángulos a crear por medio del parámetro r del Querystring. Lo que hacemos es simplemente hacer un bucle for para la creación dinámica del Xaml que represente el número buscado de rectángulos. Recuerden que cuando generamos Xaml dinámico es necesario incluir el xmlns por default en el contenedor raíz, si es que interpretaremos este código Xaml utilizando XamlReader.Load().
Lo que resta será escribir el código necesario en nuestra aplicación Silverlight para ejecutar la página php y obtener el resultado de su ejecución (lo cual será efectivamente contenido Xaml). El siguiente código muestra el manejador del evento Loaded del UserControl MainPage:
|
1 |
public partial class MainPage : UserControl |
|
1 |
{ |
|
1 |
public MainPage() |
|
1 |
{ |
|
1 |
InitializeComponent(); |
|
1 |
|
|
1 |
this.Loaded += new RoutedEventHandler(MainPage_Loaded); |
|
1 |
} |
|
1 |
|
|
1 |
void MainPage_Loaded(object sender, RoutedEventArgs e) |
|
1 |
{ |
|
1 |
WebClient client = new WebClient(); |
|
1 |
client.DownloadStringCompleted += (s, a) => |
|
1 |
{ |
|
1 |
if (a.Error == null) |
|
1 |
{ |
|
1 |
string result = a.Result; |
|
1 |
var newElement = XamlReader.Load(result) as UIElement; |
|
1 |
LayoutRoot.Children.Clear(); |
|
1 |
LayoutRoot.Children.Add(newElement); |
|
1 |
} |
|
1 |
}; |
|
1 |
|
1 |
int r = 0; |
|
1 |
try |
|
1 |
{ |
|
1 |
if (HtmlPage.Document.QueryString["r"] != null) |
|
1 |
{ |
|
1 |
r = int.Parse(HtmlPage.Document.QueryString["r"]); |
|
1 |
} |
|
1 |
} |
|
1 |
catch (Exception) |
|
1 |
{ |
|
1 |
|
|
1 |
r = 0; |
|
1 |
} |
|
1 |
string url = string.Format("/Content.php?r={0}", r); |
|
1 |
client.DownloadStringAsync(new Uri(url, UriKind.RelativeOrAbsolute)); |
|
1 |
} |
|
1 |
} |
La propiedad HtmlPage.Document.QueryString (parte del Puente HTML) permite leer el parámetro r que puede establecer el usuario en la página .html y que a su vez será utilizado para la invocación de la página Content.php. El resto del código se encarga de obtener el resultado de la descarga del endpoint (Content.php) e interpretar el resultado por medio del método XamlReader.Load().
La siguiente figura muestra el resultado de ejecutar la siguiente página:
http://localhost:9050/PHPDynamicXamlTestPage.html?r=12
Lo anterior demuestra que PHP, además de permitirnos hospedar las aplicaciones Silverlight, lo podemos usar para la creación dinámica de contenido Xaml.
