Marino Posadas Director de Tec. Desarrollo Solid Quality Mentors

Aplicaciones RIA (Rich Internet Applications) ¿Qué es Silverlight? Una aplicación real en Silverlight 1.0: Tafiti Características de la versión 1.0 Bases de la programación en Silverlight 1.0 Silverlight 2.0 Alojamiento Modelo de Objetos Objetos Silverlight Creación de elementos mediante código

Control de animaciones y multimedia Posicionamiento Manejo de eventos Soporte de estilos Personalización de controles Creación de controles Integración con el modelo DOM (HTML) Silverlight y los Servicios Web

Integración con el modelo DOM (HTML) Silverlight y los Servicios Web Silverlight y LINQ Silverlight y la integración con AJAX El objeto Silverlight downloader Personalización de controles Creación de controles

Son aplicaciones Web con las ventajas del modelo de escritorio. Beneficios: Balance cliente/servidor Eficiente comunicación asíncrona Reducción del tráfico de red Inconvenientes: Ejecución en SandBox (depende de la config. del cliente) Scripting deshabilitado Tiempo de descarga del script Pérdida de visibilidad en los motores de búsqueda Dependencia de conexión a Internet (sin conexiones puntuales)

Existen varias propuestas de esta clase en el mercado. Silverlight 1.0 y 2.0 Instalación única. Multi-plataforma y multi-navegador Soporte multimedia, interacción HTML, y lenguajes administrados Ejecución en sandbox por razones de seguridad La aparición de la versión 2.0 es inminente Adobe Flash Player y Adobe Flex Instalado en el 95% de los ordenadores mundiales Multiplataforma Lenguajes propietarios MXML y ActionScript

Plataformas AJAX Basadas en Javascript y el objeto XmlHttpRequest Los datos leídos pueden usar XML formateado Multinavegador sin necesidad de complementos (add-ins). Como otros RIAs no se adapta bien a la optimización de los motores de búsqueda Problemas con clientes con script deshabilitado Adobe AIR (Adobe Integrated Runtime) Runtime multi-plataforma No requiere conocimientos nuevos para un desarrollador Web No puede considerarse un sistema RIA completo

JavaFX Complemento de la familia de herramientas de Java Sirve para aplicaciones de escritorio, móbiles y aparatos electrónicos (con ese soporte) Toda la programación en Java (necesita, lógicamente, la JavaVM) Google Gears (en Beta) Acceso desconectado a servicios on-line Instala un motor de BB.DD. basado en SQLite en el cliente, para cachear información de la aplicación y permitir su uso posterior. Para cualquier operación, la actualización se difiere en caso de existir una conexión disponible. No es un RIA propiamente dicho pero las promesas es que se acerque mucho, al solventar el problema de las conexiones

Complemento de varios navegadores, multi-plataforma (1.37MB) Vista, XP, W. Server 2008, W. Server 2003, W. Server 2000, Mac Está siendo migrado a Linux Objetivo: RIA (Rich Internet Applications) Media, gráficos, interactividad, E/S Creación de aplicaciones tipo escritorio (pero para la Web) Reemplaza/Extiende las aplicaciones Web/AJAX existentes Modelo de programación al estilo ASP.NET: VB, C#, IronPython

Una aplicación Silverlight está centrada en torno a un fichero XAML Funciona sobre el runtime de dos formas: JavaScript (v 1.0) Administrado y con lenguajes dinámicos(v 2.0) Tremendo potencial La versión 1.0: capacidades multimedia La versión 2.0: capa de presentación Web

Tafiti.com (motor de búsquedas) Solicita la instalación de Silverlight 1.0

Animación/gráficos vectoriales 2D Soporte AJAX/JavaScript/DOM Media Códecs para estándares de video Soporte para formatos WMV y WMA Reconoce un subconjunto de WPF Controles ASP.NET para multimedia y XAML Actualmente, en ASP.NET 3.5 Extensions

Soporte de lenguajes administrados Visual Basic, Visual C#, IronRuby, IronPython Características propias de.NET Almacenamiento aislado, Servicios JSON, LINQ, excepciones, seguridad, lectura/escritura de XML, subconjunto de FX Amplio soporte de WPF Posicionamiento, Entrada/Edición, Estilos, Enlace a Datos

Silverlight no se salta las limitaciones estructurales de los navegadores, tales como la entrada/salida al sistema de ficheros. Sería parecido a un ActiveX dentro del CLR pero con seguridad habilitada El runtime realiza las acciones oportunas y expone un API al entorno del navegador Técnicamente correcto

Una página Silverlight incorpora una o más instancias del control Silverlight Instala el runtime y SDK de Silverlight El control Silverlight lo maneja un fichero XAML Gestiona el subconjunto XAML soportado

function pageLoad() { var parent = $get("host"); createSilverlightHost(parent); }

El fichero XAML dispone de una clase code- behind Compilado en un ensamblado Se descarga junto al fichero XAML El complemento final se espera que ocupe 20 MB Se descarga una sola vez Permite el código administrado en el cliente Comparado al código necesario en Javascript, se obtendría una razón de 1000:1 para una lógica relativamente compleja

Alojamiento de Silverlight Objetos Silverlight Control de animaciones y multimedia Posicionamiento Manejo de eventos Entrada/Edición de información Integración con el model DOM (HTML) Acceso a DOM desde código administrado Acceso a código administrado desde DOM Personalización de controles Creación de controles

… --> Silverlight.createObjectEx({ source: "Page.xaml", parentElement: document.getElementById("SilverlightControlHost"), id: "SilverlightControl",

properties: { width: "100%", height: "100%", version: "1.1", //o 2.0 enableHtmlAccess: "true" }, events: { //disponibles = On_Load y On_Error } }); // Y para inicializarlo al comenzar… document.body.onload = function() { var silverlightControl = document.getElementById('SilverlightControl'); if (silverlightControl) silverlightControl.focus(); }

El entorno de desarrollo de Visual Studio aporta nuevas capacidades Intellisense, tanto para JavaScript, como para el modelo de APIs de Silverlight

{Proyecto Silverlight 2.0 desde Visual Studio 2008} Marino Posadas Dir. Tecnologías de Desarrollo Solid Quality Mentors

Visual Studio 2008 aporta capacidades Intellisense, tanto para JavaScript, como para el modelo de APIs de Silverlight Otro sinfín de ayudas, incluyendo la integración de proyectos con Microsoft Blend <Rectangle Fill="Blue" Width="100" Height="50" Canvas.Left="150" Canvas.Top="125>

Silverlight 2.0 (Posicionamiento)

La programación de eventos sigue el patron conocido para ASP.NET: XAML … public void Page_Loaded(object o, EventArgs e) { InitializeComponent(); this.redRectangle.MouseLeftButtonDown += new MouseEventHandler(redRectangle_MouseLeftButtonDown); } void redRectangle_MouseLeftButtonDown(object sender, MouseEventArgs e) { // código de personalizado para cuando se hace clic en el rectángulo }

//También pueden declararse en el código XAML: <Rectangle x:Name="redRectangle" Fill="Red" Width="100" Height="50" Canvas.Left="100" Canvas.Top="100" MouseLeftButtonDown="redRectangle_MouseLeftButtonDown"> Aquí no se necesita usar el evento Page_Loaded Los eventos disponibles dependen del objeto a manejar Casos excepcionales: KeyDown, KeyUp, GotFocus, y LostFocus, solo pueden declararse para el primer contenedor,que, recogerá todas las entradas de teclado

//El código asociado sería algo así: //XAML <Canvas x:Name="parentCanvas" xmlns= xmlns:x= Loaded="Page_Loaded" KeyDown="Page_KeyDown"... //C# void Page_KeyDown(object sender, KeyboardEventArgs e) { // código personalizado para controlar las entradas del usuario. }

Silverlight 2.0 (Modelo de Eventos)

//A su vez, basado en el soporte HTML y los nuevos objetos: <Canvas xmlns=" xmlns:x=" Arial, 24pt, Bold, Blue Arial, 36pt, Light, Blue Times New Roman,24pt, Bold, Yellow

Silverlight 2.0 (Estilos)

{ Integración con DOM }

{ Acceso a Servicios Web}

ADO.NET Data Services (proyecto Astoria) pretende resolver el problema de acceso a datos desde Silverlight en forma similar a las aplicaciones de escritorio. El modelo está basado en los principios de Windows Communication Foundation, mediante entidades que apuntan a direcciones URL que hacen referencia a los datos. Soporte de lógica de negocio Usa los formatos definidos por JSON y/o Atom para la representación de los datos Permite programar comportamientos personalizados Soporte de LINQ: LINQ-to-ADO.NET Data services Es un paso más en la separación entre presentación y datos que caracteríza a esta nueva versión de la Web.

Ejemplos (Supongamos que estamos accediendo a la conocida BBDD de ejemplo NorthWind): Url de datos : Acceso a un registro: El valor de un campo dentro de un registro concreto: Los pedidos asociados al cliente ALFKI: E incluso, filtrar los resultados y ordenarlos: tive eq true&$orderby=OrderDate

El modelo Postback de ASP.NET se está quedando obsoleto día a día. Se avecina un nuevo paradigma Algunas herramientas nuevas llegan demasiado tarde Silverlight es un punto de inflexión Existe una convergencia entre ASP.NET y Silverlight respecto al modelo de AJAX.

Asesoría, Mentoring y formación sobre el tema: Mi sitio Web

© 2007 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Use this layout to show software code The font is Courier, a monospace font The slide doesnt use bullets but levels can be indented using the Increase List Level icon on the Home menu

{ demo title } Name Title Group