1 / 63

Silverlight 2.0 para desarrolladores

benjamin
Download Presentation

Silverlight 2.0 para desarrolladores

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

    1. Silverlight 2.0 para desarrolladores (Día 2) Marino Posadas MVP C#, MCAD, MCSD, MCT Alhambra-Eidos

    3. Parte 3: Comunicaciones fuera de la SandBox

    4. Modelo de acceso al DOM desde Silverlight

    5. Accediendo al HTML DOM desde el código manejado Acceso a HTML desde un nuevo namespace:

    6. Accediendo al Código Manejado desde Scripts Se debe marcar la propiedad, el método ó el evento como Scriptable

    7. HTML Integration Otros escenarios de interesantes de integración con HTML Links persistentes Integración “Forward/Back“ Seriación JSON Interacción HTML-Silverlight en los dos sentidos Creación dinámica de elementos HTML

    8. Integración con HTML

    9. OpenFile Dialog De momento es el único recurso de este tipo accesible desde una aplicación Silverlight Permite abrir ficheros mediante una técnica que simula el acceso remoto permitido Puede desencadenar procesos de espera indeseables si no se manejan los eventos de la IU con cuidado.

    10. OpenFile Dialog (1) Silverlight soporta la posibilidad de abrir un cuadro de diálogo para archivos locales Los desarrolladores pueden trabajar con el contenido de los archivos localmente, sin tener que subir primero todo el archivo al server

    11. OpenFile Dialog (2) Recordemos: Silverlight no permite al desarrollador tener el control o acceder al archivo original en la maquina local. Silverlight no puede tener el acceso directo al archivo sin primero obtenerlo por medio del cuando de dialogo “Abrir Archivo” Vamos a ver una demo para demostrar un posible problema y su solución

    12. Open File Dialog -Uso estándar - Uso mediante el evento CompositionTarget.Rendering

    13. Acceso a Datos (mediante Servicios Web)

    14. 4 formas de acceso: ASMX WCF REst ADO.NET Data Services

    15. Servicios Web (ASMX) El generador de proxy de Visual Studio permite un acceso fuertemente tipado Servicios de ASMX (SOAP), WCF, y REst ADO.NET Data Services utiliza estos modelos

    16. Servicios Web Siempre suponen una llamada asíncrona

    17. Trucos: carga dinámica de imágenes (aplicable a ficheros locales o a URI’s) Image image = new Image(); Uri uri = new Uri("images/myImage.png", UriKind.Relative); ImageSource img = new System.Windows.Media.Imaging.BitmapImage(uri); image.SetValue(Image.SourceProperty, img) Mostrar la imagen <Grid x:Name="MainGrid"> <Canvas x:Name="Map“/> </Grid> Añadir la imagen a la IU: Map.Children.Add(image); Otra opción consiste en declarar un elemento Image en el fichero XAML <Image Source="images/MyImage.png"></Image>

    18. Servicios Web ASMX (basados en SOAP)

    19. Servicios WCF Visual Studio dispone de una plantilla especial para la generación de este tipo de servicios EL mecanismo similar al anterior, pero los aspectos particulares del “binding” pueden configurarse mejor, caso de ser necesario Una vez reconocida la existencia del servicio (sistema de descubrimiento de servicios de VS 2008), el proceso es casi idéntico al ASMX Una de las razones para retocar el “binding” puede ser el rendimiento del servicio (cambiará en cada caso)

    20. Servicios WCF

    21. Servicios REst No tienen estado ni contrato, por lo que (al menos de momento) no pueden ser descubiertos por el sistema anterior Presupone el conocimiento de su existencia y las API’s que pone a disposición del usuario Requiere de un fichero “CrossDomain.xml” en la raíz del servicio donde se establezca el permiso de acceso Si el modelo es RSS nos valdremos de una clase de ayuda que formatee en lectura la información XML suministrada La clase es SyndicationFeed

    22. Servicios Rest (sin contrato)

    23. ADO.NET Data Services Propone un modelo similar a Entity Framework (basado en él, en realidad) Se genera un modelo de datos en el servidor y –a partir de ahí- un conjunto de clases .NET que ofrecen funcionalidad CRUD sobre ese modelo El modelo es modificable por el usuario Sigue un patrón de acceso parecido al de las declaraciones REst Sobre ese modelo, se crea un servicio WCF que expone la funcionalidad necesaria En el cliente Silverlight, se crea la referencia al servicio y sus métodos expuestos para manejar los datos

    24. ADO.NET Data Services

    25. Parte 4: Buenas Prácticas, instalación de aplicaciones, y trucos útiles

    26. Gestión de Estados Estados en aplicaciones RIA Cliente vs. Servidor Estados en Cliente: Usa el “isolated storage” para conseguir persistencia de estados durante las sesiones. Guarda en el cliente y sincroniza con el servidor en intervalos o al final de la sesión Guarda estados en el servidor solo cuando sea necesario y mejor en un único punto B.D.

    27. Validación Datos de entrada ActualmenteSilverlightno tieneun modelo„built-in? de validación La validación se debe de hacer en el código cliente Silverlight o bién via servicios web en el servidor Guías: Identifica fronteras de seguridad en las diferentes capas, valida los datos que cruzan dichas fronteras En las validaciones del “lado cliente?, pon el código de validación de datos en rutinas separadas de la presentación y de la lógica de negocio Si es mucho código -> carga asíncronamente No hagas “eco? de datos de entrada en los que no se confía Valida en el servidor(Servicios-Web) los datos críticos. Validación cliente -> Para experiencia de usuario Validación servidor -> Aspectos reales de seguridad

    28. Cache Cache por defecto del Browser para componentes SL, imágenes y datos que no cambian durante la sesión Usa el “almacén aislado? para guardar estados de aplicación e información de configuración que quieras persistir entre sesiones Comprueba la cuota del “almacén aislado? antes de escribir información. Evitar errores Cuota == 1Mb inicial y 50Mb máximo. No guardes tipos de datos BLOB en el “almacén aislado?

    29. ¿Accesibilidad? Silverlight 2.0 ha mejorado mucho la accesibilidad Soporte completo al teclado Decorar elementos XAML de IU con info de Accesibilidad Soporte de accesibilidad a controles “custom? Soporte de accesibilidad a lectores(AT) Accesibilidad “exposición arbol? para UIA Nota –UIA solo Windows, MacOX no soporta plug-ins accesibles Crítico en UE: Portales Administración Pública (por Ley en España)

    30. Comunicaciones en RIA (Capa Servicios) 2 ó 3 tipos Servicios Web: ASMX, WCF-Basic y REST Binding SOAP WCF soportado: basicHttpBinding (SOAP 1.1 compatible) Recuerda aspectos de autorización cross-domain. Consumo de Servicios-Web desde SL 2.0 Asíncrono Evita consumir Servicios-Web síncronamente ->bloquea Si necesitas consumirWS síncronamente -> En otro Thread en background para no bloquear el browser Opciones para comunicaciones “Push Data” con el servidor: WCF FullDuplexService basado en basicHttpBinding Sockets (Mucho mas escalable que HTTP simulando FullDuplex) Para escalabilidad: Usar sockets en lugar de polling para hacer push de datos desde el servidor al cliente

    31. Autenticación y Autorización •Los clientes RIA pueden utilizar mecanismos de autenticación y autorización similares a los clientes web estándar. •Tener en cuenta aspectos de autorización cross-domain con los ficheros crossdomain.xml ó clientaccesspolicy.xml (políticas de Silverlight) en el servidor web de servicios •Internet: Usar “Forms authentication? con el sistema ASP.NET Membership, y roles para Autorización. •Intranet: Usar autenticaciónWindows y roles Windows para autorización. La autenticación Windows no funciona automáticamente para usuarios no Windows (Apple MacOX, etc.) •Si se autentica contra servicios web (WCF p.e.), recuerda que Silverlight soporta solo basicHttpBinding(SOAP 1.1) •Para cifrado de la comunicación -> SSL (HTTPS)

    32. Cookies y Cross-Site Las Cookies en un mismo nivel de dominio miorg.com no puede acceder a las cookies foo.com… Mismo Dominio-> http://miorg.com es diferente de http://bar. miorg.com ó http://www. miorg.com Mismo Protocolo -> http:// miorg.com es diferente de https:// miorg.com MismoPuerto-> http:// miorg.com es diferente de https://miorg.com:8080 foo.com tiene que estar ”seguro? de los datos que guarda en sus cookies Prevención contra Falsificación “cross-site’

    33. ClientAccessPolicy.xml <?xmlversion="1.0" encoding="utf-8"?> <access-policy> <cross-domain-access> <policy> <allow-from http-request-headers="*"> <domain uri="*"/> </allow-from> <grant-to> <resourcepath="/" includesubpaths="true"/> </grant-to> </policy> </cross-domain-access> </access-policy>

    34. Trucos : Activar las “cookies” del navegador Se hace a través del objeto HtmlPage.Document Utiliza el namespace System.Windows.Browser. Para establecer la “cookie” se llama a SetProperty() con una cadena en la forma “Key=Valor;expires=FechaExpiración.” Ejemplo: private void SetCookie(string clave, string valor) { // Expira en 7 Dias DateTime expireDate = DateTime.Now + TimeSpan.FromDays(7);  string newCookie = clave+ "=" + valor + ";expires=" + expireDate.ToString("R"); HtmlPage.Document.SetProperty("cookie", newCookie); }

    35. Trucos : Activar las “cookies” del navegador Para leer la cookie recorremos la propiedad HtmlPage.Document.Cookies. private string GetCookie(string key){ string[] cookies = HtmlPage.Document.Cookies.Split(';');  foreach (string cookie in cookies) { string [] keyValue = cookie.Split('='); if (keyValue.Length == 2) { if(keyValue[0].ToString() == key) return keyValue[1]; } } return null; }

    36. Trucos: Centrar el control Silverlight en el navegador El control Silverlight va a una tabla con un sola celda o a un div. Añadimos un estilo a la tabla estableciendo los valores de margin-left y margin-right en auto. La altura y anchura del elemento <td> debe concordar con la del control Silverlight o el control no se mostrará. Ejemplo: <body> <form id="form1" runat="server" style="height: 100%;"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <table style="margin-left: auto; margin-right: auto;"> <tr> <td style="width: 600px; height: 300px;"> <asp:Silverlight ID="Xaml1" PluginBackground="Transparent" runat="server" Source="~/ClientBin/SilverlightDev.xap"                      MinimumVersion="2.0.30523" Width="100%" Height="100%" />          </td>         </tr>  </table> </form> </body>

    37. Trucos: Centrar el control Silverlight en el navegador También podemos usar: <div style="width: 100%; margin: 0"> <div style="margin: auto; width: 600px; height: 300px"> <asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/SilverlightDev.xap" MinimumVersion="2.0.30523" Width="100%" Height="100%" /> </div> </div>

    38. Trucos: escalado de elementos Demo On-line: http://silverlight.services.live.com/invoke/66033/Page%20Scaling/iframe.html Añadir un RenderTransform del tipo ScaleTransform al Grid o Canvas del control Silverlight <Canvas> <Canvas.RenderTransform> <ScaleTransform x:Name="CanvasScale" ScaleX=”1” ScaleY=”1” /> </Canvas.RenderTransform> </Canvas> Asignar ScaleX y ScaleY a “1” equivale a 100%. Establecer el valor de CanvasScale ScaleX y ScaleY a un porcentaje del navegador:

    39. Trucos: escalado de elementos namespace ScaleTransform { public partial class Page : UserControl { private int _startingWidth = 800; private int _startingHeight = 600;  public Page() { InitializeComponent();  App.Current.Host.Content.Resized += new EventHandler(Content_Resized); } void Content_Resized(object sender, EventArgs e) { double height = App.Current.Host.Content.ActualHeight; double width = App.Current.Host.Content.ActualWidth;  CanvasScale.ScaleX = width / _startingWidth; CanvasScale.ScaleY = height / _startingHeight; } } }  

    40. Trucos: lanzar una ventana “popup” Se soporta el método HtmlPage.PopupWindow(). Por seguridad, solo funciona como respuesta a una entrada de usuario. Referencia a System.Windows.Browser; La llamada a HtmlPage.PopupWindow() admite 3 parámetros: Uri (http://www.silverlight.net). String – Nombre de la ventana HtmlPopupWindowOptions – Varias opciones como Posicion, Tamaño, menubar, etc private void Button_Click(object sender, RoutedEventArgs e) { HtmlPopupWindowOptions options = new HtmlPopupWindowOptions();  options.Left = 0; options.Top = 0; options.Width = 800; options.Height = 600;  if (true == HtmlPage.IsPopupWindowAllowed) HtmlPage.PopupWindow(new Uri("http://www.silverlight.net"), "new", options); } *Note: Safari no lo sporta por que no implementa correctamente el contrato NPAPI .

    41. Mientras la URI sea la misma, el sistema usará la imagen de la caché Se pude soslayar este problema asignando la propiedad IgnoreImageCache a true. Ejemplo: Image img = new Image(); Uri uri = new Uri("http://YourServer.com/MyImage.png", UriKind.Absolute); BitmapImage bi = new System.Windows.Media.Imaging.BitmapImage(uri); bi.CreateOptions = BitmapCreateOptions.IgnoreImageCache; img.Source = bi; LayoutRoot.Children.Add(img);

    45. Como todos los modelos de Enterprise Services propuestos por “Patterns & Practices” no resulta trivial al inicio Requiere una curva de aprendizaje, pero minimiza los errores y facilita la depuración y el mantenimiento de la aplicación Implementa (o permite hacerlo), técnicas de IoC y Depedency Injection (D.I.) Algunas características recuerdan el modelo de “Programación orientada a aspectos” (AOP), sobre todo en el tema de D.I. Disponible en www.codeplex.com

    46. Empaquetado & Arquitectura Componente del navegador Descarga pequeña. Incluye video & audio Se instala a peticion.

    47. Silverlight .NET Framework

    48. Plataformas y fechas de disponibilidad Calendario de versiones (Roadmap) Silverlight 1 - September 2007 Silverlight 2 – Noviembre 2008 Moonlight (Linux/Unix) – Enero 2009 Silverlight Mobile – Mediados de 2009 Silverlight 3 – Finales de 2009

    51. Usage Restrictions: PR Ready San Diego Zoo Usage Restrictions: PR Ready San Diego Zoo

    52. Second largest travel company in Europe Fast Facts This leading international leisure travel group needed to create a community oriented travel experience VINGtm Results Travelers discuss travel plans with other passengers, and visualize vacation destinations on a world map. VINGtm is powered by Windows Live Messenger control, Spaces Photo, Microsoft Virtual Earth and Silverlight by Windows Live “The key benefit of using Live Services is a great reduction in development time, we can program with a modular approach, saving time and resources”. Johan Hägglund, Team Manager for web development Second largest travel company in Europe Fast Facts This leading international leisure travel group needed to create a community oriented travel experience VINGtm Results Travelers discuss travel plans with other passengers, and visualize vacation destinations on a world map. VINGtm is powered by Windows Live Messenger control, Spaces Photo, Microsoft Virtual Earth and Silverlight by Windows Live “The key benefit of using Live Services is a great reduction in development time, we can program with a modular approach, saving time and resources”. Johan Hägglund, Team Manager for web development

    53. Usage Restrictions: PR Ready Usage Restrictions: PR Ready

    56. Recursos en la Web Generales Principal: http://silverlight.net/GetStarted/  Primer vistazo: http://weblogs.asp.net/scottgu/archive/2008/02/22/first-look-at-silverlight-2.aspx Tutoriales: http://silverlight.net/learn/tutorials.aspx MSDN: http://msdn.microsoft.com/en-us/library/bb404700(VS.95).aspx  Arquitectura: http://msdn.microsoft.com/en-us/library/bb404700(VS.95).aspx Blogs sobre Silverlight (en inglés) Alvin Ashcraft: http://www.alvinashcraft.com/ Bill Reiss: http://www.bluerosegames.com/SilverlightBrassTacks/ Brad Adams: http://blogs.gotdotnet.com/BradA/ Dan Wahlin: http://weblogs.asp.net/dwahlin/default.aspx Dave Relyea - http://blogs.msdn.com/DevDave Delay: http://blogs.msdn.com/delay/ Einar Ingebrigtsen: http://www.ingebrigtsen.info Jeff Paries: http://designwithsilverlight.com/ Jessie Liberty: http://silverlight.net/blogs/jesseliberty/ Joe Stegman: http://blogs.msdn.com/jstegman/default.aspx

    57. Recursos en la Web Blogs sobre Silverlight (en inglés. Continuación) Karen Corby: http://scorbs.com/ Laurence Moroney: http://blogs.msdn.com/webnext/default.aspx Michael Palermo: http://weblogs.asp.net/palermo4/default.aspx Michael Sync: http://michaelsync.net/ Neo: http://www.silverlightexamples.net/ Nikhil Kothari: http://www.nikhilk.net Nikola: http://blogs.msdn.com/nikola/default.aspx  and http://www.nokola.com/ Peter Blois: http://www.blois.us/blog/ Pete Brown: http://community.irritatedvowel.com/blogs/pete_browns_blog/default.aspx Seema Ramchandani: http://blogs.msdn.com/seema  Scott Guthrie: http://weblogs.asp.net/scottgu/archive/tags/Silverlight/default.aspx Synergist: http://blogs.msdn.com/synergist/ SDK Team: http://blogs.msdn.com/silverlight_sdk/ The MossyBlog Times: http://blogs.msdn.com/msmossyblog/ Tim Sneath: http://blogs.msdn.com/tims/ Tim Heuer: http://timheuer.com/blog/ VectorForm: http://www.vectorform.com/silverlight/blog/ Web Services Team: http://blogs.msdn.com/silverlightws Wilco Bauwer: http://www.wilcob.com/Wilco/Silverlight.aspx

    58. Recursos en la Web Otros sitios Silverlight (Enlaces diarios Silverlight, etc.) http://www.silverlightshow.net/ http://www.silverlightcream.com/ http://mgalinks.wordpress.com/ http://www.shinedraw.com/ http://flexria.wordpress.com/category/silverlight/ Otros aspectos de interés para Silverlight Motores 3D: Kit3d: http://www.codeplex.com/Kit3D Balder 3D Engine: http://www.codeplex.com/Balder (Blog: http://www.dolittle.com/blogs/einar)

    59. Recursos en la Web Programación de juegos:                      Silverlight Games 101 by Bill Reiss Refactor by Joel Neubeck. Silverlight Game Programming Tutorial by Matthew Casperson 2D Game Development by Mike Gold. Andy Beaulieu Silverlight Games by Roger Guess Developer Fusion Envío de contraseñas seguras http://dnnsilverlight.adefwebserver.com/Samples/SilverlightXAML/tabid/56/Default.aspx Silverlight Nuggets: http://silverlightnuggets.com/ Sockets: http://www.flawlesscode.com/ Web Services: http://dnnsilverlight.adefwebserver.com/Silverlight20/SilverlightWebservice/tabid/66/Default.aspx

    60. Recursos en la Web Tutoriales sobre Silverlight (en orden alfabético): Andy Beauliue http://www.andybeaulieu.com/Home/tabid/67/Default.aspx Brad Adams http://blogs.msdn.com/brada/default.aspx Chris Hay http://www.screencast.com/users/chrishayuk DotNet Curry http://www.dotnetcurry.com/ Jesse Liberty http://silverlight.net/blogs/jesseliberty/ Joe Stegman http://blogs.msdn.com/jstegman/default.aspx Nikola Mihaylov http://blogs.msdn.com/nikola/default.aspx Page Brooks http://pagebrooks.com/ Pete Brown http://community.irritatedvowel.com/blogs/pete_browns_blog/default.aspx Shawn Wildermuth http://wildermuth.com/ Silverlight Learning Resources http://silverlight.net/learn/ SilverlightShow http://www.silverlightshow.net/ Terence Tsang http://www.shinedraw.com/ Tim Heuer http://timheuer.com/blog/ Timmy Kokke http://geekswithblogs.net/tkokke/Default.aspx Y una página sumario sobre blogs en Silverlight : http://www.netvibes.com/rboarman#Silverlight

    61. Recursos http://msdn.microsoft.com http://www.silverlight.net http://www.elavefenix.net Demo “on-line” de tipo general: http://www.elavefenix.net/AESS/aessTestPage.html “Programación en Silverlight 2.0”: primera obra sobre el tema publicada en castellano.

More Related