Silverlight 2.0 para desarrolladores - PowerPoint PPT Presentation

benjamin
slide1 n.
Skip this Video
Loading SlideShow in 5 Seconds..
Silverlight 2.0 para desarrolladores PowerPoint Presentation
Download Presentation
Silverlight 2.0 para desarrolladores

play fullscreen
1 / 63
Download Presentation
Silverlight 2.0 para desarrolladores
464 Views
Download Presentation

Silverlight 2.0 para desarrolladores

- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

    1. Silverlight 2.0 para desarrolladores (Da 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 cdigo manejado Acceso a HTML desde un nuevo namespace:

    6. Accediendo al Cdigo Manejado desde Scripts Se debe marcar la propiedad, el mtodo el evento como Scriptable

    7. HTML Integration Otros escenarios de interesantes de integracin con HTML Links persistentes Integracin Forward/Back Seriacin JSON Interaccin HTML-Silverlight en los dos sentidos Creacin dinmica de elementos HTML

    8. Integracin con HTML

    9. OpenFile Dialog De momento es el nico recurso de este tipo accesible desde una aplicacin Silverlight Permite abrir ficheros mediante una tcnica 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 dilogo 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 solucin

    12. Open File Dialog -Uso estndar - 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 asncrona

    17. Trucos: carga dinmica de imgenes (aplicable a ficheros locales o a URIs) 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> Aadir la imagen a la IU: Map.Children.Add(image); Otra opcin 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 generacin 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 idntico 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 APIs que pone a disposicin del usuario Requiere de un fichero CrossDomain.xml en la raz 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 informacin 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 patrn 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 mtodos expuestos para manejar los datos

    24. ADO.NET Data Services

    25. Parte 4: Buenas Prcticas, instalacin de aplicaciones, y trucos tiles

    26. Gestin 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 sesin Guarda estados en el servidor solo cuando sea necesario y mejor en un nico punto B.D.

    27. Validacin Datos de entrada ActualmenteSilverlightno tieneun modelobuilt-in? de validacin La validacin se debe de hacer en el cdigo cliente Silverlight o bin via servicios web en el servidor Guas: Identifica fronteras de seguridad en las diferentes capas, valida los datos que cruzan dichas fronteras En las validaciones del lado cliente?, pon el cdigo de validacin de datos en rutinas separadas de la presentacin y de la lgica de negocio Si es mucho cdigo -> carga asncronamente No hagas eco? de datos de entrada en los que no se confa Valida en el servidor(Servicios-Web) los datos crticos. Validacin cliente -> Para experiencia de usuario Validacin servidor -> Aspectos reales de seguridad

    28. Cache Cache por defecto del Browser para componentes SL, imgenes y datos que no cambian durante la sesin Usa el almacn aislado? para guardar estados de aplicacin e informacin de configuracin que quieras persistir entre sesiones Comprueba la cuota del almacn aislado? antes de escribir informacin. Evitar errores Cuota == 1Mb inicial y 50Mb mximo. No guardes tipos de datos BLOB en el almacn 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 exposicin arbol? para UIA Nota UIA solo Windows, MacOX no soporta plug-ins accesibles Crtico en UE: Portales Administracin Pblica (por Ley en Espaa)

    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 autorizacin cross-domain. Consumo de Servicios-Web desde SL 2.0 Asncrono Evita consumir Servicios-Web sncronamente ->bloquea Si necesitas consumirWS sncronamente -> 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. Autenticacin y Autorizacin Los clientes RIA pueden utilizar mecanismos de autenticacin y autorizacin similares a los clientes web estndar. Tener en cuenta aspectos de autorizacin cross-domain con los ficheros crossdomain.xml clientaccesspolicy.xml (polticas de Silverlight) en el servidor web de servicios Internet: Usar Forms authentication? con el sistema ASP.NET Membership, y roles para Autorizacin. Intranet: Usar autenticacinWindows y roles Windows para autorizacin. La autenticacin Windows no funciona automticamente 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 comunicacin -> 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 Prevencin contra Falsificacin 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 travs 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=FechaExpiracin. 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. Aadimos 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 Tambin 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 Aadir 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 mtodo 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 parmetros: Uri (http://www.silverlight.net). String Nombre de la ventana HtmlPopupWindowOptions Varias opciones como Posicion, Tamao, 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 depuracin y el mantenimiento de la aplicacin Implementa (o permite hacerlo), tcnicas de IoC y Depedency Injection (D.I.) Algunas caractersticas recuerdan el modelo de Programacin orientada a aspectos (AOP), sobre todo en el tema de D.I. Disponible en www.codeplex.com

    46. Empaquetado & Arquitectura Componente del navegador Descarga pequea. 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 Hgglund, 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 Hgglund, 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 ingls) 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 ingls. Continuacin) 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 inters 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 Programacin 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 Envo de contraseas 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 alfabtico): 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 pgina 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 Programacin en Silverlight 2.0: primera obra sobre el tema publicada en castellano.