Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Silverlight 3.MSDays EPITA 11/06/2009

3,535 views

Published on

Présentation de Silverlight 3 Beta par Frédéric Queudret lors des MS Days organisés par l'EPITA les 10 & 11 juin 2009.
La présentation contient l'historique de Silverlight et son architecture ainsi que les nouveautés de Silverlight 3.

Published in: Technology
  • Hello David,

    J'ai rajouté le lien à ton blog. Etant donné la densité de la présentation, il y a certainement d'autres sites que j'ai pu omettre involontairement malgré la tonne de liens que je donne.

    Si c'est le cas n'hésite pas à me faire un post, je ne suis généralement pas timide à ce point :)

    Bye, Frédéric
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Hello Frédéric,

    Je vois que tu as récupéré des infos/ressources de mon blog: http://blogs.msdn.com/davrous . Ca fait plaisir ! :) Par contre, ne soit pas timide, n'hésites pas à le citer. ;-)

    Bye,

    David
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Silverlight 3.MSDays EPITA 11/06/2009

  1. 1. Silverlight 3 BêtaPrésentation EPITA 10/11 juin 2009<br />Frédéric Queudret – CEO/CTO<br />MPOWARE<br />http://www.mpoware.com<br />http://blogs.codes-sources.com/mpoware/<br />
  2. 2. Mpoware<br />Société d’édition de logiciels et prestation de services<br />Partenaire Microsoft & de l’Agile Training Center<br />http://msdn.microsoft.com/fr-fr/architecture/default.aspx<br />Experts & Architectes .NET<br />Frédéric QUEUDRET – SCIA ’96<br />Fondateur de la société Mpoware<br />Ex-Architecte du Microsoft Technology Center & MVP Client App Dev<br />LinkedIn: http://www.linkedin.com/profile?viewProfile=&key=1794819&trk=tab_pro<br />Articles Programmez.com 2009<br />Le développeur Agile / Dossier Méthodologies<br />La sécurité appliquée à .Net / Dossier Hacking, sécuriser votre code<br />Développer un gadget Skype pour Sideshow / Dossier Coding4Fun<br />Blog de Laurent Trébulle: http://blogs.ionis-group.com/epita/laurenttrebulle/2008/05/des_epiteens_qui_bougent_frede.html<br />
  3. 3. [11/06: 10h00 – 12h30] Agenda <br />Présentation <br />Historique<br />Architecture<br />Les principes de Silverlight<br />Nouveautés de Silverlight 3.0<br />Comparatif avec Flash, Moonlight<br />Beaucoup de démonstrations!!!<br />
  4. 4. Silverlight: Présentation<br />Plug-in cross-browsers & cross platform<br />Windows, MacOS X, Linux via Moonlight*<br />IE, Firefox, Safari, Konqueror*<br />Pour une nouvelle génération d’applications<br />Rich Internet Applications – RIA<br />Nouvelles expériences Media (Vidéo…)<br />Avec les mêmes principes que .NET<br />XAML (« à la » WPF) pour une séparation du Design et du Développement<br />Base Class Library (« à la » .NET Framework BCL en plus light)<br />Langages de développement .NET (C#, VB.NET, …)<br />Sandboxing garantit la sécurité (« à la » Code Access Security)<br />Outillage intégré (Visual Studio, Blend…)<br />Interaction avec Javascript et DOM<br />
  5. 5. Exemples d’applications en ligne …<br /><ul><li> SEAT Brochure commerciale en ligne (SL2): http://www.seat.co.uk/exeo/pagelife/
  6. 6. Jeu (SL2): http://www.joerassic.ch/
  7. 7. e-Commerce (SL2): http://www.lejardindelydie.com/
  8. 8. Publicité (SL2): http://streaming.live.com/
  9. 9. Accès aux ressources locales (SL3): http://smjenkins.members.winisp.net/slidentity/default.html</li></ul>Démos de Silverlight<br />
  10. 10. AOL Mail RIA<br />http://beta.aol.com/projects.php?project=webmailria&loc=0<br />
  11. 11. K2 blackpoint<br />http://www.k2.com/en/displaycontent.aspx?id=973<br />
  12. 12. Historique<br />[20/11/2008] - D&apos;après Guthrie, le plugin Silverlight 2 a été téléchargé et installé sur plus de 100 millions de machines au cours des 4 dernières semaines, et plus d&apos;un ordinateur sur 4 connecté à l&apos;Internet dispose désormais d&apos;une version de Silverlight…<br />MIX 2009<br />2007 - 2009<br />2006 - 2008<br />Source: http://www.generation-nt.com/silverlight-3-haute-definition-3d-flash-actualite-190551.html<br />
  13. 13. Architecture de Silverlight<br />
  14. 14. Poster Silverlight 2<br />Poster DeepZoom: http://joestegman.members.winisp.net/DeepZoom/<br />
  15. 15. Où se place Silverlight ?<br />Client Layer<br />(Browser <br />ou <br />Mode Out-of-browser)<br />HTML<br />Ajax<br />Silverlight<br />Integration Layer<br />Business Logic Layer<br />Presentation Layer<br />PHP<br />ASP.NET<br />SharePoint<br />@<br />Database Layer<br />Service Layer<br />SOAP, JSON, REST, …<br />.NET RIA Services<br />Silverlight Blueprint for SharePoint: http://msdn.microsoft.com/en-us/sharepoint/cc303301.aspx<br />
  16. 16. Navigateurs supportés par Silverlight<br />Silverlight: Supported Operating Systems and Browsers<br />Silverlight<br />-<br />based applications are c<br />ross<br />-<br />platform and run in most modern Web browsers. The following table shows the <br />compatible operating systems and browsers. <br />Compatible Operating Systems and Browsers<br />Windows Internet <br />Internet <br />Firefox 1.5, <br />Operating System<br />Safari<br />Explorer 7<br />Explorer 6<br />2, 3<br />Windows Vista<br />Yes<br />-<br />Yes<br />-<br />Windows Server 2008<br />Windows 7 (beta)<br />Windows XP SP2<br />Yes<br />Yes<br />Yes<br />-<br />Windows <br />2000 SP4 + all post<br />-<br />SP4 <br />-<br />Yes<br />-<br />-<br />hotfixes, updates, and security updates<br />Windows Server 2003 (excluding IA<br />-<br />64)<br />Yes<br />Yes<br />Yes<br />-<br />Mac OS 10.4.8+ (Intel<br />-<br />based)<br />-<br />-<br />Yes<br />Yes<br />Linux, FreeBSD or SolarisOS<br />Various browsers. For details, see Novell.<br />Minimal Requirements<br />Components<br />Requirement<br />X86 or x64 500<br />-<br />megahertz (MHz) <br />or higher processor with <br />Personal Computer running Windows<br />128<br />-<br />megabytes (MB) of RAM<br />Intel Core Duo 1.83<br />-<br />gigahertz (GHz) or higher processor <br />with 128<br />-<br />MB of RAM<br />Mac OS 10.4.8+ (Intel<br />-<br />based)<br />
  17. 17. <ul><li> XAML
  18. 18. Code-behind
  19. 19. Contrôles
  20. 20. Isolated Storage
  21. 21.
  22. 22. Les samples du SDK Browser: http://go.microsoft.com/fwlink/?LinkId=139798</li></ul>Exemple d’un projet Silverlight<br />
  23. 23. Développer pour Silverlight 3<br />Plugin Silverlight 3 pour les développeurs<br />http://go.microsoft.com/fwlink/?linkid=143433<br />Le SDK de Silverlight 3 Bêta 1<br />La documentation du framework Silverlight 3<br />Expression Blend 3 preview<br />http://www.microsoft.com/expression/try-it/blendpreview.aspx<br />Package complet : Silverlight 3 Tools for Visual Studio 2008 SP1<br />Visual Studio 2008 SP1<br />Attention aux développements Silverlight 2<br />http://www.jeff.wilcox.name/2009/03/sxs-sl2-sl3-building/<br />http://wildermuth.com/2009/04/06/Running_Silverlight_2_and_3_On_Same_Machine_-_Redux! <br />
  24. 24. Test.htm<br />
  25. 25. XAP (prononcer ZAP)<br />Fichier de déploiement d’un application Silverlight<br />Format ZIP<br />Généré par l’outil Chiron.exe <br />Compressé<br />Pour de meilleures performances<br />Ce fichier contient tous les éléments nécessaires à l’application<br />Pour utiliser les fichiers XAP, il faut rajouter un type mime à IIS (ou autre serveur Web)<br />Xap: application/x-silverlight-app<br />En standard dans Windows Server 2008<br />Contenu:<br />Les assemblies compilées<br />Le fichier AppManifest.xaml<br />Les fichiers ressources (images, …)<br />Etapes de chargement: http://community.irritatedvowel.com/blogs/pete_browns_blog/archive/2008/03/05/Xap_2100_-App_2100_-Pow_2100_-Packaging-and-Application-Startup-in-Silverlight-2-Beta-1-_2D00_-Part-2.aspx<br />
  26. 26. XAML<br />XAML est un langage déclaratif à base de tags<br />Utilisé pour définir l’interface d’une application Silverlight<br />MainPage.xaml dans un nouveau projet Visual Studio<br />Un layoutGrid par défaut nommé LayoutRoot<br />Équivalent à:<br />&lt;Rectangle Fill=&quot;Red&quot; Width=&quot;150&quot; Height=&quot;100&quot;/&gt;<br />Rectangle newRect = new Rectangle();<br />newRect.Width = 150;<br />newRect.Height = 100;<br />newRect.Fill = new SolidColorBrush(Colors.Red);<br />LayoutRoot.Children.Add(newRect);<br />
  27. 27. Layout<br />Disposition des éléments graphiques de l’IHM<br />Plusieurs possibilités<br />Grid<br />StackPanel<br />Canvas<br />DockPanel<br />WrapPanel<br />…<br />
  28. 28. Contrôles<br />Silverlight 3 étend le nombre de contrôles natifs<br />Voir Silverlight Toolkit<br />Template d’affichage par défaut<br />Customiser le look d’une application sans altérer son comportement<br />Styling (Styles)Changementsvisuelslégerssur un élément (Fonte, Couleur de fond, etc)<br />Skinning (Control Templates)Remplacer tout l’arbrevisuel d’un Elément<br />
  29. 29. Contrôles et Thèmes Visuels<br />
  30. 30. Contrôles nommés<br />Visual Studio définit systématiquement des attributs x:Name pour tous les éléments<br />Les contrôles nommés peuvent être référencés par code avec support Intellisense complet<br />
  31. 31. Le code<br />Support des langages .NET (C# ou Visual Basic)<br />Fichiers code-behind avec extension du langage<br />Exemple: MainPage.xaml.cs<br />Utilisé pour coder la logique applicative<br />Modèle de programmation événementiel<br />
  32. 32. Event handlers<br />Les Event handlers connectent les actions aux contrôles<br />Déclarésdans le XAML oubien au runtime dans le code-behind en C# au Page_Loaded<br />
  33. 33. Databinding<br />Le Databinding renforce la séparation entre la présentation des données et le code-behind « applicatif »<br />Avec tout objet implémentant IEnumerable<br />Arrays, Lists, Collections <br />DataTemplates contrôlent la présentation<br />Binding uni- ou bi-directionnel<br />
  34. 34. LINQ<br />Language INtegratedQuery apporte des capacités de requêtage natives à .NET<br />Requêter, projeter et filtrer des données issues de multiples sources<br />Mixé avec le code C#, VB, etc<br />Silverlight comprend System.LINQ et System.LINQ.Expression<br />
  35. 35. Intégration HTML<br />Silverlight permet la manipulation du DOM HTML et l’intégration JavaScript<br />Propose des « managedwrappers » pour le DOM et les éléments JS<br />Silverlight peut invoquer JS, JS peut invoquer du code managé<br />
  36. 36. Accès aux fichiers locaux<br />Silverlight peut prompter pour accéder à des fichiers locaux<br />Pas besoin d’upload vers le serveur<br />Contraintes de sécurité<br />Fichiers ouverts en mode read-only seulement<br />Accès en écriture dans le Isolated storage<br />
  37. 37. Open File Dialog<br />
  38. 38. Large choix d&apos;options réseau<br />Silverlight étend le networking<br />HTTP, WS*/SOAP, REST, RSS, JSON<br />System.Net.Sockets pour les protocoles non-HTTP tels que les serveurs de « chat »<br />Silverlight 3 apporte <br />l’encodage binaire (customBinding)<br />Transport de l’identité utilisateur (HTTPS)<br />Simplification du mode Duplex<br />REST in Windows Communication Foundation (WCF)<br />http://msdn.microsoft.com/en-us/netframework/cc950529.aspx<br />What&apos;s new with web services in Silverlight 3 Beta: http://blogs.msdn.com/silverlightws/archive/2009/03/20/what-s-new-with-web-services-in-silverlight-3-beta.aspx<br />
  39. 39. Deep Zoom<br />Permet de zoomersur des images de grandes dimensions<br />Chargementoptimisé des parties visibles<br />De basserésolutionvers haute résolution<br />
  40. 40. Deep Zoom<br />Deep Zoom Composer découpe les images en parties de 256 x 256 <br />Puisgénèreunepyramided’images de différentesrésolutions<br />Affichage via le contrôleMultiScaleImage<br />
  41. 41. Creating a Silverlight-Enabled WCF Service<br />http://reddevnews.com/articles/2009/05/20/creating-a-silverlight-enabled-wcf-service.aspx<br />Exemple d’appel à un web service <br />
  42. 42. Cross-Domain Policy Files<br />Silverlight supporte les requêtes « cross-domain »:<br />Silverlight policy: clientaccesspolicy.xml<br />Adobe Flash policy: crossdomain.xml<br />Déjà utilisés par: etc…<br />Tous les sites publics, qui fonctionnent avec Flash, fonctionnent avec Silverlight<br />Clientaccesspoilicy.xml vs. Crossdomain.xml<br />http://community.dynamics.com/blogs/cesardalatorre/comments/9579.aspx<br />
  43. 43. Cross Domain Policy Flow<br />
  44. 44. Sécurité Silverlight<br />Applications « Sandboxées »<br />Pas d’élévation de privilèges ni de prompts de sécurité (ActiveX) — juste un clic sur URL<br />Applications incapables de réaliser des actions malicieuses<br />Interactions locales limitées<br />« Safeisolatedstorage »<br />Contrôle de file upload client<br />Supporte les requêtes « Cross domain »<br />
  45. 45. Quels bénéfices avec Silverlight ?<br />ZeroDeployment<br />Cross Browser & Cross platform<br />Write once, Test once<br />Limite : Interactions avec le browser<br />Tirer parti de la puissance du client<br />Basé sur un moteur vectoriel graphique 2D<br />La meilleure résolution pour mon application ?<br />Architectures multi-tiers et orientées services<br />Mêmes outils, mêmes langages<br />Mêmes développeurs !<br />
  46. 46. http://silverlight.net/samples/sl3/toolkitcontrolsamples/run/default.html<br />Les nouvelles fonctionnalités de Silverlight 3.0<br />
  47. 47. + de 60 contrôles<br />Contrôles: Calendar, ChildWindow, DatePicker, DockPanel, Expander, GridSplitter, TabControl, TreeView, ViewBox, WrapPanel, …<br />Données: DataForm, DataPager, Validation, DataGrid, …<br />Charting: Area / Bar / Bubble / Column / Line / Pie / ScatterSeries, …<br />Input: AutoCompleteBox, ButtonSpinner, DomainUpDown, NumericUpDown, TimePicker, UpDownBase, …<br />Layout: Accordion, TransitioningContentControl, …<br />Navigation<br />Theming: ImplicitStyleManager, + thèmes, … (Thème dynamique)<br />Sans compter tous les composants tiers (VisiFire, ComponentArt, DevExpress, Infragistics, …)<br />Démonstration<br />http://silverlight.net/samples/sl3/toolkitcontrolsamples/run/default.html<br />
  48. 48. SaveFileDialog<br />Permet de sauver du contenu sur le disque local <br />Récupération d’un Stream pour écriture<br />L’enregistrement ne peut se faire que sur action utilisateur<br />privatevoidsaveButton_Click(objectsender, RoutedEventArgs e)<br /> {<br />SaveFileDialogdialog = new SaveFileDialog();<br />dialog.Filter = &quot;Text files (*.txt)|*.txt|All Files (*.*)|*.*&quot;;<br />dialog.FilterIndex = 1;<br />bool? ret = dialog.ShowDialog();<br /> if (ret == true)<br /> {<br /> using (Stream fs = (Stream)dialog.OpenFile())<br /> {<br />byte[] content = Encoding.Unicode.GetBytes(&quot;Hello World&quot;);<br />fs.Write(content, 0, content.Length);<br />fs.Close();<br /> }<br /> }<br /> }<br />
  49. 49. Local Messaging<br />Communication locale entre plusieurs applications Silverlight<br />Depuis la même instance du navigateur ou autre instance<br />La communication se fait à l’aide de named pipes et de sharedmemory<br />Classes pour les connexions locales:<br />LocalMessageSender (méthode SendAsync)<br />LocalMessageReceiver (événement MessageReceived)<br />Démonstrations<br />BoucingBalls<br />Source: http://blogs.msdn.com/jstegman/archive/2009/03/23/local-messaging-samples.aspx<br />
  50. 50. Bitmap/Pixel APIs<br />WriteableBitmap pour générer dynamiquement des images<br />http://www.interact-sw.co.uk/slapps/mandelbrot/<br />Exemple de code: http://community.irritatedvowel.com/blogs/pete_browns_blog/archive/2009/03/18/Silverlight-3-_1320_-The-Bitmap-API-_2F00_-WriteableBitmap.aspx<br />Pixel Shading pour les effets graphiques<br />DropShadow, Blur, …<br />Démonstration Chroma Key Pixel ShaderSample:<br />http://joestegman.members.winisp.net/Mix09/MoreEffects/<br />
  51. 51. Des animations plus naturelles<br />Animations de type « élastique », « balle rebondissante »… <br />Exemples<br />http://www.silverlightshow.net/items/Animation-Easing-in-Silverlight-3.aspx<br />Plus d’infos dans la documentation : http://msdn.microsoft.com/en-us/library/cc189019(VS.96).aspx section “EasingFunctions” <br />
  52. 52. HD & Support du RAW Audio/Video<br />Support Audio & Vidéo Haute Qualité<br />H.264/AAC, VC-1/WMA (.M4A)<br />Smooth Streaming, Full HD (720p+) playback<br />Support pour d’autres CODECs via Raw AV Pipeline<br />Support DRM<br />Vidéo en ligne: <br />Roland Garros 2009 en HD: http://roland-garros.france2.fr/?page=videos&type=direct<br />http://silverlight.fr.msn.com/cinema/age-de-glace-3/bande-annonce.aspx<br />http://www.innoveware.com/quakelight.html<br />
  53. 53. L’accélération matérielle via le GPU<br />L’activation de l’accélération matérielle se fait grâce au paramètre EnableGPUAcceleration<br />Utile pour les vidéos, les opérations graphiques couteuses, …<br />Fonctionnement:<br />Via DirectX sur PC<br />OpenGLsur MAC<br />QuakeLight: http://www.innoveware.com/ql3/QuakeLight.html<br />Un outil pour mesurer la performance: Xperf<br />http://blogs.msdn.com/seema/archive/2008/10/08/xperf-a-cpu-sampler-for-silverlight.aspx<br />Exemple<br />Sans l’accélération matérielle activée: http://www.andybeaulieu.com/silverlight/3.0/scrollmonster/DisabledGPUAcceleration.html<br />Avec l’accélération matérielle activée: http://www.andybeaulieu.com/silverlight/3.0/scrollmonster/EnabledGPUAcceleration.html<br />
  54. 54. Perspective 3D<br />Possibilité de projeter des objects 2D dans un espace 3D<br />Exemple en XAML:<br />&lt;Button Content=&quot;Button&quot;&gt; <br /> &lt;Button.Projection&gt; <br /> &lt;PlaneProjectionRotationY=&quot;-40&quot; /&gt; <br /> &lt;/Button.Projection&gt; <br />&lt;/Button&gt; <br />Démonstration: http://blogs.msdn.com/jstegman/archive/2009/03/22/perspective-3d-sample.aspx<br />Documentation: http://msdn.microsoft.com/en-us/library/dd470131(VS.96).aspx <br />
  55. 55. Mode déconnecté<br />Out of browser<br />Intégration au menu Démarrer & Bureau<br />Sandbox et stockage local isolé<br />Installation transparente<br />Auto-update<br />Détection de la perte de connexion<br />Démonstration: http://joestegman.members.winisp.net/Mix09/LocalChess/<br />
  56. 56. Applications Orientées Données<br />DeepLinking & Search Engine Optimization<br />BindingElement à Element<br />Template de projet VS Silverlight Navigation Application<br />Navigation Framework<br />Frame & Page<br />NavigationService<br />NavigationContext<br />Uri Routing<br />
  57. 57. .NET RIA Services (Preview)<br />Réduire la complexité de développement des applications RIA n-Tiers (notamment les application LoB)<br />Framework<br />Outils<br />Services<br />Bénéfices<br />Support end-to-end des applications orientées données<br />Unification des composantes clients et serveurs<br />Productivité accrue<br />Intégration avec les classes « DomainService » et « DomainContext »<br />Récupération des données, mise à jour, …<br />Logique de liaison aux données<br />Documentation<br />http://download.microsoft.com/download/F/B/8/FB8CA635-296B-487F-965C-8148F08B5319/riaservicesoverviewpreview.pdf<br />http://code.msdn.microsoft.com/RIAServices<br />
  58. 58. Silverlight et Windows Azure<br />Windows Azure<br />Plateforme de type « Cloud Computing » de Microsoft<br />Eq Amazon EC2, Google AppEngine<br />Enregistrer le type MIME dans la fabrique<br />Exemples<br />Avec stockage de vidéos: http://blogs.msdn.com/jnak/archive/2008/11/05/silverlight-mediaelement-playing-a-video-stored-in-windows-azure-blob-storage.aspx<br />SilverLining: http://azurecoding.net/blogs/icbtw/archive/2008/11/08/silver-lining-for-windows-azure-silverlight-2-sample-hosted-in-azure.aspx<br />http://www.tekigo.com/Downloads/TEKIGO%20-%20Windows%20Azure%20-%20Présentation%20Technologique.pdf<br />
  59. 59. Et encore…<br />Silverlight pour Mobile<br />http://silverlight.net/learn/mobile.aspx<br />Windows Mobile 7<br />Silverlight sur Linux = Moonlight<br />Projet OpenSource<br />Initié par Miguel de Icaza<br />http://www.mono-project.com/Moonlight<br />
  60. 60. Silverlight vs. Flash (1/2)<br /> <br />
  61. 61. Silverlight vs. Flash (2/2)<br /> <br />
  62. 62. Blend 3 Beta: Outilspour Designers et Développeurs<br />Visual Studio 2008<br />Expression Blend<br />Expression Design<br />Designers<br />Look, identité visuelle, marque,et connection émotionnelle<br />Développeurs<br />Fonctions, déploiement, données,sécurité, intégrité<br />XAML<br />Fichiers Projet VS<br />
  63. 63. Blend 3 SketchFlow<br />Télécharger la preview: http://www.microsoft.com/downloads/details.aspx?FamilyID=A04AA0AE-87BE-4201-A65E-E792859122FC&displaylang=en<br />
  64. 64. Silverlight 3 et Visual Studio 2010<br />Multi-targeting (SL2 ou SL 3)<br />Install Visual Studio 2010 Beta 1<br />Install Silverlight 2 SDK<br />Install Silverlight 3 Beta SDK<br />Install Silverlight 3 Beta Developer Runtime<br />Pas (encore) de support des .NET RIA Services<br />Designer Silverlight<br />
  65. 65. First Look @ Silverlight 3<br />Introduction téléchargeable en PDF: http://download.microsoft.com/download/3/0/5/3055A230-B06F-4A58-AC93-B7CFD2184A70/FirstLookSL3Moroney.pdf<br />
  66. 66. Références<br />Blog de David Rousset<br />http://blogs.msdn.com/davrous<br />Blog de Joe Stegman<br />http://blogs.msdn.com/jstegman<br />Blog de Tim Heuer<br />http://timheuer.com/blog/<br />Blog de Brad Abrams<br />http://blogs.msdn.com/brada<br />Le site Officiel<br />http://silverlight.net/<br />Référence MSDN<br />http://msdn.microsoft.com/en-us/library/cc838158(vs.96).aspx<br />Silverlight Toolkit<br />http://www.codeplex.com/Silverlight<br />
  67. 67. Merci!<br />

×