Pratique de Silverlight - Conception d'Applications Interactives Riches

506
          R           é            f           é        r        e        n        c        e Réseaux et télécom Sécurité Système d’exploitation Silverlight Pratique de Conception d’applications interactives riches Éric Ambrosi Programmation Développement   we b http://www.free-livres.com/

Transcript of Pratique de Silverlight - Conception d'Applications Interactives Riches

  • Rfr

    ence

    Rseauxet tlcom

    Scurit

    Systme dexploitation

    SilverlightPratique de

    Conception dapplications interactives riches

    ric Ambrosi

    Programmation

    Dveloppementweb

  • Pratique de Silverlight

    ric Ambrosi

    Avec la collaboration dAude Moussetet Thierry Bouquain

  • Pearson Education France a apport le plus grand soin la ralisation de ce livre afin de vous fournir une in-formation complte et fiable. Cependant, Pearson Education France nassume de responsabilits, ni pour son utilisation, ni pour les contrefaons de brevets ou atteintes aux droits de tierces personnes qui pourraient rsulter de cette utilisation.

    Les exemples ou les programmes prsents dans cet ouvrage sont fournis pour illustrer les descriptions tho-riques. Ils ne sont en aucun cas destins une utilisation commerciale ou professionnelle.

    Pearson Education France ne pourra en aucun cas tre tenu pour responsable des prjudices ou dommages de quelque nature que ce soit pouvant rsulter de lutilisation de ces exemples ou programmes.

    Tous les noms de produits ou marques cits dans ce livre sont des marques dposes par leurs propritaires respectifs.

    Publi par Pearson Education France47 bis, rue des Vinaigriers75010 PARISTl. : 01 72 74 90 00www.pearson.fr

    dition et et mise en pages : Dominique Buraud

    ISBN : 978-2-7440-4125-9Copyright 2010 Pearson Education FranceTous droits rservs

    Aucune reprsentation ou reproduction, mme partielle, autre que celles prvues larticle L. 122-5 2 et 3 a) du code de la proprit intel-lectuelle ne peut tre faite sans lautorisation expresse de Pearson Education France ou, le cas chant, sans le respect des modalits prvues larticle L. 122-10 dudit code.

    All rights reserved. No part of this book may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording or by any information storage retrieval system, without permission from Pearson Education, Inc.

  • Table des matires

    Prface IX

    Partie I

    Approche de Silverlight

    1. Introduction 11.1 Quest-ce que Silverlight ? 21.2 De .Net 1 Silverlight 31.3 Les avantages de Silverlight 41.4 La suite Expression Studio 61.5 Positionnement mtier 7

    1.5.1 Designer interactif 71.5.2 La chane de production 8

    1.6 Langages de dveloppement et choix 91.6.1 Langages accessibles 91.6.2 CLR, DLR et langages non compils 10

    2. Le couple XAML / C# 132.1 XML 13

    2.1.1 quoi sert le XML ? 132.1.2 La grammaire 142.1.3 Lambigut des relations familiales 15

    2.2 XAML, un langage dclaratif puissant 162.2.1 Lutilit du XAML 162.2.2 Comparaison XAML / C# 172.2.3 Afficher un visuel XAML 182.2.4 Espaces de noms 19

    2.3 Les fondamentaux du langage C# 202.3.1 C# et lAPI Silverlight 202.3.2 Introduction la programmation oriente objet 212.3.3 Une premire application en mode console 222.3.4 Les types 232.3.5 Dclarer des mthodes 312.3.6 Hritage et implmentations 34

    3. HelloWorld 373.1 Une premire application Silverlight 373.2 Architecture d'une solution 403.3 Le conteneur racine 42

  • IV Table des matires

    3.4 Ajouter du texte 423.4.1 Crer le champ texte 423.4.2 Alignement 43

    3.5 Tester et compiler 443.5.1 Premire compilation 443.5.2 Une application 100 % Silverlight 453.5.3 Fichiers gnrs 473.5.4 Processus de compilation 49

    4. Un site plein cran en 2 minutes 514.1 Les projets de type site Internet 514.2 Crer des conteneurs redimensionnables 53

    4.2.1 Crer le pied de page 534.2.2 Crer le menu du haut 554.2.3 Crer la grille centrale 60

    4.3 Le composant bouton 614.3.1 Dfinir un nom dexemplaire 614.3.2 Afficher une bulle dinformation au survol 624.3.3 Choisir un curseur de survol personnalis 634.3.4 La proprit Content 64

    4.4 Ajouter de linteractivit 674.4.1 Utiliser les comportements 674.4.2 Mode plein cran 694.4.3 Spcificits du mode plein cran 704.4.4 Dtecter le changement daffichage 71

    4.5 Fichiers dploys 72

    5. Larbre visuel et logique 735.1 Composants visuels 73

    5.1.1 Familles de composants 735.1.2 Arbre dhritage des classes graphiques 75

    5.2 Principe dimbrication 815.2.1 Ordre dimbrication 815.2.2 Accder aux objets de larbre visuel 835.2.3 Parcourir la liste des enfants 87

    5.3 Ajouter des enfants la liste daffichage 915.3.1 Mcanisme dinstanciation dobjets graphiques 915.3.2 Ajouter et insrer des objets dans larbre 925.3.3 Erreurs leves 945.3.4 Crer un menu dynamique 955.3.5 Affecter les proprits Child et Content 975.3.6 vnement diffus 98

    5.4 Supprimer des objets de larbre visuel 995.4.1 Les diffrentes mthodes 995.4.2 Leffondrement de la liste denfants 1005.4.3 Dsactiver des objets 1035.4.5 vnement diffus 104

    5.5 changes dindex 1055.5.1 change dindex du point de vue conception 1055.5.2 Une mthode dextension pour UIElementCollection 1065.5.3 change dindex du point de vue design 108

  • Table des matires V

    Partie II

    Interactivit et cration graphique

    6.Animations 1136.1 Introduction 114

    6.1.1 Quest-ce quune animation ? 1146.1.2 La cadence des animations au sein de Silverlight 1156.1.3 Une premire animation 1166.1.4 Les diffrents types danimation 1186.1.5 Les diffrents types dinterpolation 1206.1.6 La classe Storyboard 123

    6.2 Animer avec Expression Blend 1246.2.1 Les bonnes pratiques 1246.2.2 Crer une animation dintroduction 1256.2.3 Dclencher des animations 1286.2.4 Les transformations relatives 129

    6.3 Grer lacclration 1326.3.1 Les principes 1326.3.2 Une animation de rebond en une seule cl danimation 1336.3.3 Amliorer lanimation dintroduction 137

    6.4 Animer avec C# 1386.4.1 Lintrt danimer avec C# 1386.4.2 Instanciation dynamique de ressources Storyboard 1396.4.3 Affectation dynamique de Storyboards 1446.4.4 Dupliquer un Storyboard cr dans Blend via C# 146

    6.5 Les transformations relatives 1506.5.1 Principes 1506.5.2 Tester la prsence dune instance TransformGroup 1516.5.3 Affecter la proprit RenderTransform 1536.5.4 La bibliothque ProxyRenderTransform 1546.5.5 Effets antagonistes et complmentaires 158

    6.6 Animer des particules 1606.6.1 Exemples dun fond sous-marin 1616.6.2 Crer lanimation des bulles 165

    7. Boutons personnaliss 1697.1 Crer un lecteur vido 169

    7.1.1 Mettre en place le projet 1707.1.2 Insrer une image darrire-plan 1707.1.3 Le rle du composant Grid 171

    7.2 Style visuel 1727.2.1 Crer un style personnalis 1727.2.2 Naviguer entre style, modle et application principale 174

    7.3 Bouton gnrique 1777.3.1 La proprit Content 1777.3.2 Liaison de modles 178

    7.4 Le gestionnaire dtats visuels 1837.4.1 volution de lexprience utilisateur 1847.4.2 Au sein dun control 1877.4.3 Au niveau de lapplication 196

    7.5 Le bouton interrupteur ou ToggleButton 2017.5.1 Crer le bouton 2027.5.2 Le systme dagencement fluide 203

  • VI Table des matires

    8. Interactivit et modle vnementiel 2058.1 Les fondements du modle vnementiel 205

    8.1.1 Le pattern Observateur 2068.1.2 Introduction au couplage faible 2078.1.3 Souscrire un vnement en C# 2088.1.4 Cas pratique 209

    8.2 Supprimer lcoute dun vnement 2118.2.1 Principe 2118.2.2 Un cas concret dutilisation 212

    8.3 Le couplage faible en pratique 2158.3.1 Principe 2158.3.2 Simplifier le code du lecteur vido 2178.3.3 Affectation dynamique danimations 219

    8.4 Propagation vnementielle 2208.4.1 Principe 2218.4.2 Un exemple simple de propagation 2228.4.3 viter la diffusion dvnements 2238.4.4 Arrter la propagation vnementielle 2258.4.5 Glisser-dposer et capture des vnements souris 228

    8.5 Les comportements 2328.5.1 Comportements versus programmation vnementielle 2328.5.2 Les diffrents types de comportements 2328.5.3 Crer des comportements personnaliss 234

    9. Les bases de la projection 3D 2459.1 Lenvironnement 3D 245

    9.1.1 Introduction 2469.1.2 Le plan de projection 247

    9.2 Les proprits 3D 2499.2.1 Rotation 3D 2499.2.2 Laxe de rotation 2509.2.3 Les axes de translation 2519.2.4 Accs et modification via C# 253

    9.3 La camra 2579.3.1 Position de la camra dans lespace de projection 2589.3.2 Langle douverture 2599.3.3 Les conteneurs 3D 2609.3.4 Le point de fuite 262

    9.4 Introduction aux matrices 2639.4.1 Dfinition et principes 2639.4.2 Les matrices 3D 2679.4.3 Oprations sur les matrices 2699.4.4 Initialiser une vue perspective 272

    10. Prototypage dynamique avec SketchFlow 27710.1 Lenvironnement 277

    10.1.1 Le prototypage 27710.1.2 Quest-ce que SketchFlow ? 27910.1.3 Le flux de production 282

    10.2 Prototype simple 28310.2.1 Problmatique cliente 28310.2.2 Le projet SketchFlow 28410.2.3 La carte de navigation 287

  • Table des matires VII

    10.3 Le lecteur SketchFlow 29010.3.1 Navigation 29110.3.2 Collaboration transverse avec SketchFlow 292

    10.4 Interactivit 29810.4.1 Importer des fichiers PSD 29810.4.2 Navigation utilisateur 30010.4.3 Simuler un flux dutilisation 30210.4.4 tats visuels 303

    10.5 Interface riche 30410.5.1 cran versus composant 30510.5.2 Lexemple du configurateur riche 306

    Partie III

    Conception dapplications riches

    11. Ressources graphiques 31511.1 Quest-ce quune ressource 316

    11.1.1 Dfinition et types de ressources 31611.1.2 Les dictionnaires de ressources 31911.1.3 Appliquer des ressources 324

    11.2 Les pinceaux 32711.2.1 Couleurs et pinceaux 32811.2.2 Les pinceaux dimages et de vidos 336

    11.3 Les polices de caractres 34011.3.1 Afficher et mettre en forme du texte 34011.3.2 Polices personnalises 344

    11.4 Styles et modles de composants 34811.4.1 Les styles 34811.4.2 Affectation dynamique 35011.4.3 Organiser et nommer les ressources 35111.4.4 Les modles 353

    11.5 Le modle Slider 35511.5.1 Principes et architecture 35611.5.2 Un Slider personnalis 358

    11.6 Les liaisons 36011.6.1 Crer une liaison 36011.6.2 Les donnes fictives 36711.6.3 Le contexte de donnes 37111.6.4 Paramtres optionnels 374

    11.7 Le modle ListBox 37511.7.1 Structure et principes 37511.7.2 Modifier lapparence dune liste dlments 37711.7.3 DataTemplate versus ListBoxItem 379

    12. Composants personnaliss 38512.1 Contrle utilisateur 385

    12.1.1 Un hritage pertinent 38612.1.2 Navigation page par page 386

    12.2 Bote de connexion 39012.2.1 Conception visuelle 39012.2.2 Validation par liaison de donnes 393

  • VIII Table des matires

    12.2.3 Rafrachissement manuel de liaison de donnes 39812.2.4 Notification de changement de proprit 39912.2.5 vnements personnaliss 403

    12.3 Contrles personnalisables 40912.3.1 ColorChooser et ColorPicker 41012.3.2 Crer des contrles 41112.3.3 Le contrat de modle 41312.3.4 Les proprits de dpendance 423

    13. Mdias et donnes 42913.1 Chargement de mdias 429

    13.1.1 Chargement dynamique dimages 43013.1.2 Formats vido et modes de diffusion 43813.1.3 Un lecteur vido simple 44413.1.4 Chargement dynamique de vidos 449

    13.2 Conception MVVM 45213.2.1 Principes 45213.2.2 Modle 45413.2.3 Vue-Modle 457

    13.3 Chargement de donnes 45913.3.1 Lobjet WebClient 46013.3.2 Introduction LINQ 46313.3.3 Expression lambda 46713.3.4 Consommer du XML avec LINQ 46913.3.5 Charger un flux JSON 47213.3.6 Scurit interdomaines 477

    Index 481

  • Prface

    Cela fait maintenant trois annes que jutilise Silverlight et avant lui WPF. Lorsque lon me de-mande de qualifier Silverlight, le premier mot qui me vient lesprit est moderne. Moderne, lenvironnement de travail via Expression Blend, logiciel de conception, que lon pourrait qua-lifier dhyper contextuel, et via Visual Studio port en WPF pour sa version 2010. En tant que concepteur, cest pour moi ce jour le meilleur outil et produit cr par Microsoft. Moderne, le flux de production et les enjeux humains quil engendre dans celle-ci. Silverlight porte en lui une rflexion sur nous-mmes et sur la manire dont nous catgorisons les acteurs de la production et leurs comptences. Que lon soit dveloppeur, graphiste, designer, architecte, directeur technique ou artistique, il est impossible de rester insensible cette mutation qui sopre autour de nous. Jusqu rcemment, le design graphique ne concernait pas ou peu le monde du dveloppement applicatif, mais le Web et son volution ont servi de catalyseur et ont bouscul nos habitudes de production. Moderne enfin, parce que Silverlight reprsente le fer de lance des technologies dans ce domaine et quil chappe aux habitudes et aux clichs.

    Les applications voluent et, de ce fait, la communication qui a souvent fait dfaut dans le pass entre techniques et cratifs est remise en jeu. Les frontires seffacent diffrents niveaux. Ainsi, une application perue comme riche, lest indpendamment de son support ou de son contexte de diffusion, quelle soit bureautique ou Internet. Ainsi, dveloppeurs et designers prouvent au-jourdhui la ncessit de communiquer et de travailler de concert pour obtenir des applications de meilleure qualit. Lun sans lautre, ils ne peuvent plus rpondre au renouvellement constant des problmatiques clientes. Ainsi, les comptences de chacun ne sont plus enfermes et catgorises aussi simplement quauparavant. Silverlight offre, de ce point de vue, un environnement de d-veloppement performant, robuste et complet. Il ne se contente pas de porter lexistant .Net dans une application compile pour le Web ; il correspond pleinement lvolution des murs et des attentes des internautes et leur propose de nouvelles expriences enthousiasmantes.

    Ce livre est bti sur ces principes, cest une rfrence pratique de Silverlight qui vous accompa-gnera en production. Il sadresse aux designers interactifs, aux dveloppeurs ainsi qu tous les concepteurs souhaitant apprendre le framework Silverlight. Il expose les principes et concepts de cette plateforme et les illustrent par de nombreux exemples tlchargeables. Il sarticule autour des deux axes de conception que sont le design et le dveloppement, et les met en perspective lun par rapport lautre. Si vous tes designer interactif, ce livre vous donnera une meilleure comprhension des contraintes lies au dveloppement dapplications. Il vous immergera pro-gressivement dans lunivers du dveloppement orient objet tout en vous apportant les cls de la conception graphique propre Silverlight. Si vous tes dveloppeur, il vous sensibilisera aux contraintes nouvelles en matire de design, de prototypage et dexprience utilisateur. Il facilitera le dialogue et la communication avec les autres acteurs de la production. Quel que soit votre cas, cet ouvrage est conu pour fluidifier vos productions et tablir les bases dune rflexion interm-tiers respectueuse de chaque profil.

  • X Prface

    Prrequis

    Ce livre sadresse deux types de public diffrents : les designers et les dveloppeurs. La difficult est progressive. Toutefois, quelques sections peuvent sadresser lun de ces profils en particulier. Ainsi, ne vous formalisez pas sur certains termes utiliss car mme sans pratiquer le design ou le dveloppement, il est ncessaire dapprendre le vocabulaire propre ces mtiers pour communi-quer avec chacun des acteurs dune production.

    Dans cette optique, les copies dcran dExpression Blend sont en anglais. Il nest cependant pas ncessaire de connatre la langue de Shakespeare pour comprendre ce livre. De manire plus gnrale, il est conseill davoir des notions basiques en cration graphique ou en dveloppement quel que soit le langage et le niveau technique.

    Ce livre se positionne comme un ouvrage dapprentissage en mode pas pas. Les trois premiers chapitres ainsi que celui ddi SketchFlow (Chapitre 10) sont les seuls qui ne ncessitent a priori aucune des disciplines mentionnes prcdemment.

    Organisation de ce livre

    Cet ouvrage se compose de trois parties :

    Partie I, Approche. Cette partie du livre donne une vision globale de la technologie Silver-light et de son positionnement. Nous y dcouvrons larchitecture de la plateforme ainsi que son histoire. Nous crons notre premier projet Silverlight et nous y abordons les principes lmentaires de conception lis Silverlight. Nous la clturons par un tour dhorizon des com-posants fournis par la plateforme et nous concevons un premier site brut plein cran.

    Partie II, Interactivit et cration graphique. Cette partie saxe essentiellement sur le graphisme et linteractivit au sein de Silverlight. Lanimation, le modle vnementiel, la conception dinterfaces graphiques, la personnalisation graphique de composants ou encore la 3D, sont autant de sujets tudis. En fin de partie, nous abordons la conception de prototypes dynamiques via la technologie SketchFlow.

    Partie III, Conception dapplications riches. Le flux de production, le positionnement m-tier et larchitecture reprsentent les thmes de cette partie. Au cur de ceux-ci, nous tudie-rons notamment la conception de contrles, lorganisation et le rle des ressources respon-sables de la rpartition des tches de chacun, ainsi que le modle de conception MVVM et le chargement de donnes externes.

    Les exemples

    Ce livre contient de nombreux exemples sous forme dexercices, de projets et de fichiers divers dont la majorit est tlchargeable sur le blog ddi au livre ainsi que sur le site de lditeur Pear-son. Le blog est conu dans le but de mettre jour les projets et de garder un contenu vivant et cohrent. Il est disponible ladresse http://referencesilverlight.tweened.org. Certains projets doivent tre rcuprs sur ce dernier avant de pouvoir vous lancer. Il est organis sous forme de treize catgories dont chacune correspond un chapitre. Elles donnent accs diffrents articles contenant les sources, les projets et certains schmas tlchargeables. Plusieurs composants et autres classes sont en tlchargement libre et peuvent vous aider dans vos productions. Certains

  • XI Prface

    des contrles ont t rcemment ajouts la bibliothque SLExtensions ou fondus avec ceux dj existants. Dans tous les cas, ils sont accessibles sur mon blog http://www.tweened.org via la catgorie Composants.

    Conventions typographiques

    Les conventions typographiques adoptes dans ce livre sont les suivantes :

    Police fixe. Cette police met en valeur les lments du langage. Police fixe grasse. Dans les extraits de code, cette police met en exergue les modifications apportes aux programmes.

    Ce type de note fournit des prcisions en marge du texte.

    Cette icne vous met en garde sur un point prcis.

    propos de lauteur

    Issu dun cursus scientifique Paris VII, puis dune formation aux mtiers de la production audio-visuelle et de la post-production, ric Ambrosi est co-fondateur de lcole Europenne Suprieure dAnimation, rebaptise cole Mlis, dont il fut le responsable pdagogique de 1999 2003. Il devient par la suite concepteur dapplications Web 2.0 Flash / Flex et responsable technique sur les outils de mobilit pour la socit Atos Origin jusqu fin 2006. Il est aujourdhui responsable pdagogique et directeur technique chez Regart.net pour les plateformes Microsoft Silverlight et WPF. Il a t nomin deux fois MVP, une premire fois en tant que Client Application Developer pour lanne 2008-2009 et une seconde fois comme MVP Silverlight pour lanne 2009-2010.

    Remerciements

    Je remercie toutes les personnes qui ont cru en moi et mont accompagn tout au long de cet exer-cice prilleux et fastidieux dcriture. Je remercie galement mes parents et mes beaux-parents qui nous ont soutenus ma femme et moi tout au long de ce parcours.

    Je remercie tous mes collgues et ex-collgues de Regart.net. Merci donc Fatos et Guylaine, les deux prsences fminines de Regart.net. Un grand merci Vincent Maitray pour mavoir accord les droits de la vido Petit Pan (utilise au Chapitre 13), ralise avec talent en une journe par ses soins. Je remercie galement Matthieu Appriou pour ce joli visuel de premire de couverture que jai repris pour le lecteur multimdia du Chapitre 11. Merci mon collgue Nicolas pour son humour et son soutien durant ces dix derniers mois. Merci Thibault pour toute cette nergie quil diffuse atour de lui. Merci en vrac mes amis, Philippe et Samia, Cyril et Aurlie, Candice et Herv, et Num et Say qui jai pens ces derniers mois. Ils mont support durant tout ce temps

    NOTEINFO

    ATTENTION

  • XII Prface

    par leur prsence ou leurs coups de fil mme si je ne les ai vu que de manire entrecoupe. Merci toutes les personnes de Microsoft avec qui je collabore et qui me font confiance. Un grand merci mon ditrice Patricia Moncorg, qui ma permis dcrire ce livre, et ma relec-trice Dominique Buraud, avec qui il est vraiment agrable de travailler. Toutes deux forment une trs bonne quipe et mont permis daccomplir ce voyage jusquau bout. Merci mon relecteur ct dveloppement, Thierry Bouquain, compatriote MVP Siverlight qui ma apport beaucoup par ses conseils et le temps quil ma allou. Thierry est co-fondateur de lentreprise Ucaya qui sest illustre sur des projets de Smooth Streaming pour les vnements du Tour de France et de Roland Garros entre autres. Merci Aude Mousset, ma relectrice ct design interactif et amie depuis trois ans, merci donc pour avoir pris le temps de me relire et dtre une force de proposition. Aude est graphiste de formation, experte sur Blend et a travaill pour I-Breed et Microsoft durant ces dernires annes. travers son travail constant et de qualit, elle a ouvert la voie aux designers. Son aventure continue chez MPower en tant que Directrice artistique et Designer interactif. Merci donc vous deux, Aude et Thierry, sans qui le livre ne serait pas ce quil est aujourdhui.Pour finir, je remercie galement ma femme pour son soutien, pour mavoir pouss crire ce livre, et pour sa comprhension dans cette preuve. Merci de nous avoir donn cette jolie Gabrielle qui nous rend tellement heureux. Merci galement pour notre fils qui va natre dans les prochains jours et qui fait dj des siennes ds quil entend le rire de Gabrielle ou la musique autour de nous je vous ddie ce livre.

    Un mot des collaborateurs techniques

    "La lecture de cet ouvrage renforce ma vision de lvolution des sites Internet. La dimension interaction et design est de plus en plus prsente et devient incontournable pour des sites de qua-lit. Les bonnes pratiques de dveloppements dcrites ici permettent de bien dmarrer un projet o la mthode de travail et de collaboration entre designer, intgrateur et dveloppeur est un des lments cls du succs."

    Thierry Bouquain, directeur technique et fondateur de Ucaya."En tant que graphiste, Silverlight est un nouveau terrain de jeux explorer. Les possibilits sont multiples, la technologie est puissante, mais sans connaissances techniques cela peut savrer frustrant. Mme si vous ntes pas dveloppeur, faire un pas vers le ct obscur est un vrai plus dans le cadre de projets Silverlight. Que vous produisiez en solo ou en quipe, que vous soyez du ct Blend ou du ct Visual Studio, ce livre est un bon moyen dapprhender le workflow Silverlight. Vous rentrerez rapidement dans le vif du sujet : ric Ambrosi partage sa matrise de Silverlight et vous permet dapprhender des concepts dintgration et de dveloppement via de nombreux cas pratiques, pertinents et complets.

    Un ouvrage indispensable pour tous les devsigners1 !"

    Aude Mousset, Directrice Artistique et Designer Interactif pour MPower.

    1. Devsigner pour designer + dveloppeur.

  • Partie I

    Approche de Silverlight

    1

    Introduction

    Dans ce chapitre, vous dcouvrirez la nouvelle plateforme de diffusion plurimdias interactive Silverlight et les raisons qui ont pouss Microsoft sa conception. Vous apprendrez en quoi Sil-verlight hrite de la bibliothque .Net et propose un nouveau modle de conception avantageux. Nous voquerons galement la nouvelle suite doutils Expression Studio ddie aux graphistes et aux intgrateurs et comment ceux-ci se positionnent dans la chaine de production.

    Silverlight laisse aussi bien la place aux langages .Net C# quaux langages libres et dynamiques comme JavaScript. Prendre partie pour lun de ces langages est lune des tapes incontournables de sa prise en main. Nous listerons donc les critres qui orienteront votre choix parmi ceux-ci. De manire gnrale, Silverlight est fait pour amliorer notre quotidien de designer ou de d-veloppeur, ainsi que lexprience utilisateur sur Internet. Nous examinerons les moyens mis en uvre pour atteindre ces diffrents objectifs.

  • 2 PartieI Approches de Silverlight

    1.1 Quest-ce que Silverlight ?

    Silverlight est un lecteur Internet existant sous forme de plug-in, anciennement connu sous le nom de WPF/E, initiales de Windows Presentation Foundation Everywhere. Les applications lisibles par ce lecteur sont des fichiers au format xap. Bas sur un moteur vectoriel puissant, il permet dafficher du contenu dynamique et interactif pour le Web. Il facilite la conception et la diffusion dapplications riches sur Internet. Il fait partie de la plateforme de dveloppement .Net (prononcer "dotte net") propose par Microsoft, mais ne ncessite quune fraction hrite de celui-ci pour tre excut, autrement dit, linstallation du lecteur seul suffit. Cette particularit lui permet dtre diffus au sein de nombreux navigateurs sur Mac OS, Windows ou Linux (via le projet Moonlight pour Linux, voir Tableau 1.1).Tableau 1.1 : Navigateurs et systmes supports.

    Systme dexploitation

    Internet Explorer 8

    Internet Explorer 7

    Internet Explorer 6 Firefox 2 / 3 Safari 3 / 4

    Windows 7 Oui - - Oui -

    Windows Vista Oui Oui

    Windows XP SP2 Oui Oui Oui Oui -

    Windows 2000 SP4 - Oui - -

    Windows Server 2003 / 2008 Oui Oui Oui Oui -

    Mac OS 10.4.8+ (PowerPC) - - Oui Oui

    Mac OS 10.4.8+ (Intel) - - Oui Oui

    Linux, FreeBSD, SolarisOS

    Support par le projet Moonlight dvelopp par Novell

    Les applications .Net traditionnelles reposent sur la notion de client lourd, cest--dire quelles ncessitent linstallation de la bibliothque .Net. Celle-ci peut peser jusqu 195 Mo pour la ver-sion 3.5. Le lecteur Silverlight chappe ce type de fonctionnement peu souple car cest un environnement dexcution pour les applications de type client lger. Cela signifie que son poids est suffisamment ngligeable (de 4 Mo 7 Mo selon les systmes dexploitation) lors du tlchar-gement, pour que son installation soit rapide et les applications excutes trs lgres (souvent infrieure 1 Mo). Sous Vista et Windows 7, les droits ncessaires son installation sont moins contraignants pour lutilisateur de la machine cliente. Bien que lon puisse avoir limpression quil sagit dun dtail, les rseaux dentreprises actuels sont souvent constitus de centaines, voire de milliers dordinateurs, et les dploiements qui en dcoulent ncessitent dimportants moyens hu-mains et techniques. Dans ces conditions, le dploiement de clients lgers est une stratgie efficace court et moyen termes puisque les applications dveloppes pour ces plateformes sont de plus

  • 3Chapitre1 Introduction

    en plus performantes et puissantes. Malgr un poids ngligeable, Silverlight apporte un environ-nement de dveloppement complet.

    1.2 De .Net 1 Silverlight

    Comme nous lavons vu prcdemment, Silverlight est la fois une volution parallle et un hritage de la plateforme de dveloppement .Net (prononc "dotte nette"). Quest-ce que .Net ? Quel est son but et comment est-elle ne ? Rpondre ces questions nous permettra de mieux comprendre les orientations prises par les quipes dingnieurs ayant particip sa conception et nous permettra plus facilement denvisager les amliorations possibles dans le futur.

    Il faut remonter le temps jusqu fvrier 2002 pour voir la sortie de .Net 1.0, livr avec le Ser-vice pack 1 de Windows XP. Visual Studio.Net est cette poque, loutil de prdilection pour dvelopper ce type dapplications. .Net est n des besoins dinteroprabilit (entre ancienne et nouvelle technologie) et de portabilit (valable pour les langages et les systmes). Les objectifs sont simples :

    Proposer une meilleure plateforme de dveloppement. Apporter un environnement indpendant du rseau ou du langage choisi quels quils soient Visual Basic, C# ou C++, etc.

    Dlivrer un unique modle de conception quelle que soit la version de Windows : XP, 2000, Windows CE, etc.

    Concurrencer Java. Faciliter la cration de services web. Accompagner les dveloppeurs et assouplir la mthodologie de dveloppement avec en point de mire lindustrialisation des processus.

    Microsoft propose de nombreux systmes dexploitation et .Net uniformise le dveloppement dapplications. Les applications dveloppes en .Net ciblent essentiellement lOS Windows. Par ailleurs Microsoft ralise une premire perce significative pour scinder le design des interfaces et le code logique, grce aux formulaires Windows, surnomms Winforms. Avec ce type darchitec-ture, apparat la notion de code "behind". Un fichier va contenir le code ncessaire pour fabriquer linterface visuelle. Celle-ci sera simplement cre par de simples glisser-dposer de composants dans la fentre de prvisualisation sous Visual Studio. Un autre fichier contient dsormais le code logique, ou code "behind", sans lequel linterface ne rpondrait pas aux interactions utilisateurs et ne possderait aucune logique. Sorti fin 2005, .Net 2 est une vritable amlioration mais napporte que peu de nouveauts. Il faut attendre janvier 2007 pour dcouvrir .Net 3 qui rvolutionne le dveloppement dapplications sous Windows.

    .Net 3 nest pas une refonte, mais une extension de .Net 2. Cette version apporte, en plus de C# 3 ou de technologies comme Linq, de nombreux bnfices rpartis en quatre modules :

    WCF (Windows Communication Foundation) facilite la communication entre les applications, les domaines ainsi que partage de bas de donnes.

    WCS (Windows CardSpace) pour lauthentification des utilisateurs.

  • 4 PartieI Approches de Silverlight

    WWF (Windows Workflow Foundation) pour lamlioration des flux de production. WPF (Windows Presentation Foundation) comme couche de prsentation.

    WPF est la technologie qui nous concerne : Silverlight en est un dveloppement la fois hrit et parallle. On peut considrer que WPF reprsente le futur de la technologie Winforms. Tout en conservant les capacits prcdentes, il intgre les profils du designer et de lergonome qui, dans 90 % des cas, taient soit mis lcart, soit relgus au second plan. Microsoft comprend en effet que la fonctionnalit nest plus la seule garantie dune russite commerciale ou technique. De plus en plus dapplications voient le jour et beaucoup sont fonctionnelles. Toutefois, seules trs peu dentre elles y ajoutent lergonomie et lesthtisme, deux facteurs que lon retrouve pourtant dans lindustrie automobile, les tlphones portables et de nombreux autres secteurs. Grce lenvi-ronnement WPF, vous pourrez changer le visuel dune application dans sa globalit. Modifier le design dune barre de dfilement ou dune liste dlments se rvlera trs simple. Tout ceci est ralisable grce WPF et au langage XAML (eXtensible Application Mark-up Language). Le XAML permet de formaliser nimporte quel dessin vectoriel ou composant visuel sous forme de balises XML. Un client peut dornavant configurer le visuel dune application en modifiant des feuilles de styles XAML et y apposer ainsi sa charte graphique sans faire appel lditeur. Certes, ces oprations sont ralisables depuis longtemps en important des bibliothques entires de classes, mais autant dire que les graphistes ntaient pas vraiment prsents dans le processus de cration. Exit donc les interfaces grises, rectangulaires, hrites de Windows 3.1.

    WPF aborde donc avec succs lun des grands chantiers de linformatique moderne : la sparation complte du fond et de la forme, elle dpasse de loin les Winforms sur ce point. Dautres techno-logies ont galement essay de rpondre cette problmatique : XUL, de la fondation Mozilla, ou encore le langage FXG bas sur SVG du ct dAdobe. WPF a pris de lavance, mais concerne les dveloppements sur systme Windows pour les langages de hauts niveaux. partir de ce constat, une nouvelle problmatique apparat. De manire gnrale Microsoft est avant tout diteur de so-lutions, quel que soit le systme dexploitation, cest l son cur de mtier. Il se doit donc proposer des solutions indpendantes du systme. Afin de supprimer le couplage existant entre lenvironne-ment de dveloppement et les systmes dexploitation Windows cibls, WPF/Everywhere voit le jour. Cest lancien nom de code de Silverlight. Lobjectif est clair : puisque lon cre des solutions autant faire en sorte quelles ciblent le plus de systmes dexploitation possibles. Le moyen le plus efficace consiste alors proposer un lecteur Internet sous forme de plug-in. Les navigateurs les plus courants sont cibls en premier, et Silverlight voit finalement le jour en novembre 2007. Cette initiative de Microsoft rpond avant tout aux attentes du march actuel qui volue rapidement vers les applications en ligne et rpond au quasi monopole de la plateforme Flash.

    1.3 Les avantages de Silverlight

    Dvelopper avec Silverlight apporte beaucoup davantages, dont certains ne lui sont pas forc-ment propres, mais sont plutt relatifs lensemble des technologies asynchrones prsentes sur le Web comme Shockwave, Flash, Silverlight et Ajax. Silverlight est avant tout orient applications interactives riches et, dans ce cadre, il bnficie galement de toute lexprience de Microsoft en matire de dveloppement. Ce serait une erreur de penser que les graphistes sont dlaisss car des efforts importants ont t raliss pour fournir des outils de design et danimations performants. Lors du rachat de Macromedia par Adobe, de nombreux acteurs de talent furent recruts par Mi-crosoft pour atteindre ces objectifs. Voici les avantages les plus significatifs de Silverlight :

  • 5Chapitre1 Introduction

    Comportement asynchrone. Ajax est la premire technologie asynchrone au sein du navi-gateur, mais cest aussi la plus ancienne. Apparu avec Internet Explorer 5 en 2001, cette tech-nologie, rapidement adopte, provient dun objet en particulier (Xml HttpRequest) permettant deffectuer des requtes client serveur. La spcificit des technologies asynchrones rside dans le fait quelles ne ncessitent pas le rechargement complet de la page du navigateur la r-ception des donnes serveur. Lutilisateur peut mme continuer utiliser le reste de linterface sans provoquer derreur. Silverlight possde de nombreuses mthodes asynchrones, plus mo-dernes quAjax permettant non seulement les changes dans un format texte, mais galement dans un format binaire. Ainsi, lchange dimages, de flux vido, de donnes types est pos-sible ; le mode peer-to-peer est galement support.

    Il ne dpend pas dune technologie serveur spcifique. Il vous suffit dun simple client FTP et le tour est jou. Vous navez pas besoin dune configuration serveur spcifique ou propri-taire. Un serveur Apache traditionnel fera trs bien laffaire pour diffuser votre site ou votre application Silverlight.

    Ouvert aux technologies du Web. Les langages dynamiques, comme JavaScript, ont la ca-pacit de communiquer avec une instance de plug-in Silverlight de manire transparente. La communication est en ralit possible dans les deux sens. De plus la lecture, lcriture ou len-voi de donnes sont ralisables dans des formats courants, comme XML, ou JSON, de mme que laccs nimporte quel type de technologie ct serveur. On peut ainsi interfacer sans problme une application Silverlight avec des services, ct serveur, cods en PHP, ASP, etc.

    Il bnficie dune compatibilit multi-environnement. Comme nous lavons dit au dbut de lintroduction, Silverlight est accessible en tant que lecteur sur Mac OS, Windows et Linux (Moonlight) et sur les navigateurs Chrome, Firefox, Internet Explorer 6, 7 et 8, Safari. Votre application, bien que dveloppe avec Visual Studio, Expression Blend ou mme Eclipse, sera donc visible et accessible au plus grand nombre.

    Les applications ne ncessitent pas de dploiement. Autrement dit, une fois accessible une adresse donne, lapplication est lisible et excutable au sein des navigateurs par les in-ternautes. Cela est peut tre anodin ou normal si vous travaillez actuellement sur le march du Web, mais la philosophie actuelle (en mutation) consiste encore dployer des clients lourds et des applications locales poste par poste. Dans des rseaux comprenant des milliers de postes clients, le dploiement de telles applications est extrmement coteux en ressources humaines et techniques. Les applications Silverlight apportent une rponse efficace ces problmatiques de diffusion.

    Les langages logiques .Net supports sont grs. Le code gr (dit aussi manag) est lop-pos du code interprt. C# ou VB sont des codes compils, JavaScript, PHP, HTML sont interprts. Cela signifie quils sont lus par le logiciel dune machine cliente ou serveur dans le cas de PHP. Pour un langage comme JavaScript, cela se traduit par des diffrences de perfor-mances flagrantes selon le navigateur, mais aussi par des diffrences dinterprtations. Dans un site web traditionnel, laspect visuel, ainsi que la version du langage, peuvent donc varier fortement selon les navigateurs (IE, Firefox ou Safari par exemple). Au sein de Silverlight, toutes ces problmatiques sont rsolues, laffichage sera le mme quelle que soit la plateforme, la version du langage reste constante. On obtient galement beaucoup de performances car le langage est gr. la compilation, il est transform et optimis en langage intermdiaire. Par la suite, selon la machine cliente, le systme dexploitation et le navigateur, le lecteur sadap-tera pour loptimiser en un langage machine adapt chaque navigateur (voir Chapitre 3).

  • 6 PartieI Approches de Silverlight

    Il contient un moteur daffichage vectoriel puissant. Lensemble des composants ou ob-jets visuels sont vectoriels. Ils sont donc affichs grce au moteur vectoriel Silverlight. De nombreuses problmatiques, comme le poids des fichiers dploys ou encore la gnration dobjets de manire dynamique, sont ainsi rsolues. Les animations vectorielles sont non seu-lement possibles, mais galement simples raliser. Laffichage de texte avec des polices de caractre embarques, des vidos ou des images est ais mettre en uvre. Les visuels ne sont pas figs sous forme de bitmap ce qui facilite grandement la mise jour des applications et le travail collaboratif.

    Il amliore la collaboration entre designers et dveloppeurs. Hritant de WPF, Silverlight bnficie de la mme architecture de production. Cela signifie que le langage XAML est pr-sent pour formaliser lensemble des lments visuels dune application. Tout ce que le gra-phiste va produire gnre du XAML, de la mise en forme jusquau moindre pictogramme visuel. La consquence directe est que la cration dun composant (ou contrle) personnalis, comme une mire de connexion par exemple, seffectue en deux tapes distinctes complte-ment autonomes. Les designers interactifs ou les intgrateurs crent les lments visuels et les animations. Le dveloppeur ajoute le code logique. Cest une vision un peu simplifie de la ralit, mais cependant assez proche. Lavantage rside dans le fait que les graphistes par-ticipent pleinement la conception. De plus, ce quils produiront sera fidlement rutilis par les dveloppeurs et non recr ou retraduit par ceux-ci. tout moment, les designers pourront mettre jour le visuel sans mettre en danger laspect fonctionnel ou modifier le code logique.

    1.4 La suite Expression Studio

    La gamme Expression Studio fait partie de la stratgie WPF. Cette suite de logiciels apporte un confort jamais atteint pour le dveloppement dapplications Microsoft. Les objectifs de la gamme Expression Studio sont :

    Permettre la cration dapplications riches connectes (Rich Desktop Application) ou dap-plications riches pour navigateur (Rich Internet Application) via Expression Web ou Blend intgrant Silverlight.

    Amliorer la qualit graphique et lergonomie des applications en proposant de nouveaux outils aux profils de type graphiste, intgrateur ou designer dans lenvironnement .Net et Sil-verlight, tout cela en scindant le fond et la forme. Ces outils facilitent la mise en place de un flux de production reposant sur la collaboration intermtiers.

    Proposer de nouvelles solutions aux besoins de la "vido la demande" trs prsents sur le Web grce Silverlight, Expression Encoder et au format wmv.

    Rpondre aux problmatiques traditionnelles propres la cration de site Internet via Expres-sion Web.

    Pour rappel, Visual Studio est loutil de dveloppement phare de Microsoft. Du point de vue dun dveloppeur et concernant des projets standard, Visual Studio peut tre utilis seul. En effet, il est possible de btir un projet Silverlight sans besoin de logiciels de la gamme Expression Studio (Blend ou Design). Toutefois, cela ne serait pas pertinent, on pourrait en effet se demander quelle serait la valeur ajoute de telles applications ? La gamme Expression facilite justement laccs au dveloppement de nouveaux acteurs. Ces nouveaux profils, que sont lintgrateur, lergonome et

    NOTEINFO

  • 7Chapitre1 Introduction

    le graphiste, par leur apport, enrichissent de manire considrable lapproche et le ressenti dune application pour lutilisateur. La gamme Expression Studio apporte une ouverture exceptionnelle au monde du graphisme qui, jusque-l, tait laisse de ct. Blend et Design ont donc pour mission de fournir du contenu graphique et interactif, ainsi quune ergonomie accrue en comparaison des applications bureautiques ou Internet standard.

    Voici une liste des outils compris dans la suite :

    Expression Web pour la cration de sites Internet ; Expression Blend pour la conception dinterfaces riches ; Expression Design pour la conception graphique vectorielle ; Expression Encoder pour lencodage des fichiers au format wmv en haute dfinition ; Expression Media pour lorganisation et la lecture des mdias ; Visual Studio pour la conception, le dveloppement et larchitecture dapplications.

    Pour notre part, nous couvrirons la conception dapplications interactives riches via lutilisation dExpression Blend et de Visual Studio.

    1.5 Positionnement mtier

    Comme nous le voyons, WPF et les outils de la gamme Expression sont sur le point de boulever-ser les modes opratoires existant. La tendance actuelle repose sur un besoin devenu essentiel qui consiste formaliser le graphisme grce des langages dclaratifs de type XML. Il est intres-sant de noter que ce mouvement, initi par Mozilla avec le XUL et par Adobe avec le SVG il y a quelques annes, est aujourdhui concrtis par Microsoft. Cependant, nous parlons bien de ten-dance, ce qui signifie que dautres acteurs comme Adobe reprennent la mme direction. Le FXG est la version Adobe du XAML, les deux langages se ressemblent fortement. Lenseignement que lon peut tirer de cette situation est que les modes et flux de production suniformisent et sont en pleine mutation. Les prochaines annes seront riches tous points de vue. Les capacits de Silver-light, Flash et Ajax (et nouvellement XHTML 5) proposer des langages performants et diffuser du contenu innovant seront dcisives. Ce qui est abord dans cette section est donc valable pour tous les acteurs du march quelle que soit leur provenance.

    1.5.1 Designer interactif

    Au sein de lenvironnement .Net, trois logiciels de la gamme sont le thtre de cette volution : Expression Blend, Expression Design et Visual Studio :

    Expression Design concerne essentiellement les graphistes. Il contient lensemble des outils ncessaires la cration vectorielle. Cependant il joue aussi le rle de passerelle et permet dimporter nativement de nombreux types de fichiers dont le format Adobe Illustrator ou le format Photoshop psd.

    Expression Blend cible avant tout les designers interactifs, les intgrateurs et les designers deXprience Utilisateur. Les ergonomes peuvent aussi dans une certaine mesure crer des maquettes et prototype en partie rutilisables (voir Chapitre 10).

  • 8 PartieI Approches de Silverlight

    Visual Studio comme outil de dveloppement principal est conue pour les dveloppeurs et possde un puissant outil de dbogage que Blend ne fournit pas. ce jour, il est considr comme lun des meilleurs produits dlivrs par Microsoft.

    Le tableau 1.2 indique la localisation de Blend / Design dans la chane de production, ainsi que linvestissement prvoir en fonction du rle de chacun. On remarque que chacun peut lutiliser, Blend tant un outil polyvalent et multiforme.

    Tableau 1.2 : Positionnement de Blend au sein de la chane de production.

    RleOutils et niveau dutilisation

    Expression Design Expression Blend Visual Studio

    Graphiste Fort Moyen AucuneDesigner interactif Moyen Fort Faible moyenDveloppeur Aucune Faible moyen Fort

    Comme on peut sen rendre compte, un nouveau profil merge : le designer interactif. On peut considrer ce profil comme un nouveau genre de designer web. Dans la majorit des cas, cest un graphiste ayant volu et acquis une relle culture de dveloppeur ainsi quune connaissance aigu de lergonomie. Lintgrateur HTML reprsente en partie ce type de profil. Il est la fois confront des langages comme JavaScript, PHP (ralisation de modles) et CSS, tout en conjuguant cette technique une sensibilit de graphiste. La diffrence entre intgrateur et designer interactif re-pose essentiellement sur la partie animations et transitions. On peut voir le flasher comme designer interactif. Son objectif principal est de coupler le visuel, lergonomie, lanimation et les transi-tions. Il considre la logique applicative et la fonctionnalit comme importantes, mais coulant de source et plutt dvolues aux dveloppeurs.

    Au sein des environnements WPF et Silverlight, le designer interactif tient un rle crucial puisquil fait le lien entre les profils situs chaque extrmit de la chane de production. Cest un lment fdrateur. Silverlight et WPF proposent un modle qui facilite la collaboration, mais cest le profil de designer interactif qui formalise et permet cette communication. On pourrait y voir un mlange des genres douteux, mais sans lui, on se retrouverait dans une situation dlicate o les graphistes nauraient finalement que peu dinfluence sur la production.

    1.5.2 La chane de production

    Tout projet conu avec Blend sinscrit dans le cadre WPF, les applications Silverlight sont un sous-ensemble de WPF. Cependant, au contraire des applications WPF bureautiques, les applications Silverlight sont multi-plateformes et multi-navigateurs. Les projets Silverlight suivent la logique classique de tout dveloppement applicatif avec un renforcement singulier de la collaboration entre chaque ple mtier. Voici le dtail de chaque tape et son impact mtier :

    Cahier des charges. Profils concerns : client, D.A. / D.T., chef de projet, graphistes, dve-loppeurs, ergonomes et utilisateur final

  • 9Chapitre1 Introduction

    Maquette fonctionnelle et story-boards. Profils concerns : 50 % dveloppeurs et 50 % gra-phistes ou ergonomes. Rflexion papier commune sur la disposition des objets de linterface et sur lergonomie de lapplication. La navigation et la cinmatique doivent tre penses ce stade.

    Squelette technique et maquettage. Les collaborateurs du projet sont dans le mme bureau et travaillent ensemble :1 llaboration du squelette technique, profils concerns : 95 % dveloppeurs et D.T., 5 % graphistes ou ergonomes

    1 la cration de plusieurs maquettes sous Expression Design ou Illustrator "Look & Feel", profils concerns : 5 % dveloppeurs et 95 % graphistes ou D.A.

    Cette phase se termine lorsque lune des maquettes est valide par le client. Production. Cycle de "va et vient" dit itratif entre chaque ple mtier qui est une interaction continue entre les profils. Durant cette phase chaque ple mtier fournit lautre les lments dont il a besoin afin davancer dans le dveloppement du projet.1 Dveloppement de la partie logique de lapplication, profils concerns : dveloppeurs et directeur technique ;

    1 Intgration graphique des lments composant lapplication, profils concerns : graphistes, designers interactif ou intgrateurs, directeur artistique.

    Figure1.1

    Le cycle itratif de production.

    Un designer interactif est toujours ncessaire. Toutefois, si le projet ncessite peu de ressources et quil est de faible envergure, ce rle est dvolu un graphiste ou un dveloppeur, ou encore aux deux tour de rle selon les besoins.

    1.6 Langages de dveloppement et choix

    Choisir un langage de dveloppement nest pas seulement un choix pragmatique, cette dcision est troitement lie la sensibilit et lhistoire personnelles de chacun. Nous allons toutefois lister les langages, et essayer de nous dcider pour lun deux de manire impartiale.

    1.6.1 Langages accessibles

    Plusieurs langages sont accessibles aux dveloppeurs dans la gamme Expression Studio, ils sont catgoriss en trois types distincts. La premire catgorie concerne les langages manags propres la CLR (Common Language Runtime). On y compte :

    Dveloppeur Designer interactif

  • 10 PartieI Approches de Silverlight

    Le langage dclaratif XAML. XAML signifie eXtensible Application Mark-up Language. Ce langage permet de formaliser le graphisme : les courbes vectorielles, les dgrads de cou-leurs ou les couleurs unies, les styles, les composants visuels, les animations, les modles de composants qui correspondent la forme et au graphisme de ceux-ci.

    C#. Le langage logique que nous utiliserons tout au long du livre (voir Chapitre 2). Visual Basic. Langage de haut niveau, comme C#, mais plus spcifique dans son criture, nous ne lutiliserons pas dans ce livre.

    La deuxime catgorie concerne les langages manags dynamiques grs par la DLR (Dynamic Language Runtime). Ils ne seront pas couverts ici. Parmi eux on trouve : IronPython. Cest le portage du python pour la plateforme .Net, vous trouverez plus dinfor-mations ladresse suivante : http://www.codeplex.com/IronPython.

    IronRuby. Cest la version du langage Ruby propre .Net, vous trouverez plus dinformations ladresse suivante : http://www.ironruby.net/.

    JScript. Cest un langage cr par Microsoft qui jouit de la norme ECMA. JavaScript. Version spcifique du langage du mme nom mais compile par la DLR

    La troisime catgorie fait rfrence au langage non compil (donc interprt) JavaScript, cela engendre moins de possibilits et daccs au lecteur Silverlight, mais laccs est transparent.

    Le XAML est le seul langage dont vous aurez besoin quel que soit le code logique que vous choi-sirez. Celui-ci est orient prsentation, cest un langage dclaratif de type XML (voir Chapitre 2).

    1.6.2 CLR, DLR et langages non compils

    Nous aborderons en dtails les notions de CLR et de DLR au Chapitre 3. Sachez simplement que la CLR est le compilateur grant les langages natifs de la plateforme .Net, donc de lenvironne-ment Silverlight. Au sein de Silverlight, deux langages sont grs par dfaut dans les projets : Visual Basic et C#, mais la CLR donne accs dautres langages moins connus comme F# par exemple. Dune toute autre manire, la DLR ouvre et enrichie Silverlight dautres langages dy-namiques qui ne sont pas forcment hrits de ou propres .Net. Un langage dynamique est un langage capable de faire voluer sa structure lexcution, autrement dit un langage dont il est facile dtendre les capacits des classes ou objets natifs dynamiquement. Ce type de langage nest pas rellement dans la culture originelle de Microsoft mais les anciens dogmes provenant des annes 80 sont en cours de mutation. Lvolution de C# en est un flagrant exemple. La DLR est en ralit une surcouche la CLR, elle permet des langages dynamiques daccder au lecteur Silverlight en communiquant avec la CLR. JavaScript est un cas particulier, il peut tre gr de deux manires, soit par la DLR, soit de manire transparente. Lorsquil est gr par la DLR, sa mise en production est, au dpart, plus complexe mais dans ce cas, il accde entirement la CLR et bnficie des avantages lis cette dernire. Dans le cas dune utilisation transparente, il donne directement accs une petite partie des capacits du lecteur Silverlight, mais les performances lexcution sont beaucoup moins leves puisquil ny a pas de compilation.

    Le choix du langage dpendra essentiellement de votre culture de dveloppeur. Cependant, d-cider dutiliser ou non directement JavaScript comme langage non compil est un peu moins vident, vous devrez vous poser deux questions :

  • 11Chapitre1 Introduction

    Quel type de projet souhaitez-vous construire ?1 Si vous souhaitez construire un projet Silverlight faible interactivit, comme des ban-nires ou de petits sites vnementiels, JavaScript parat plus adquat car sa mise en uvre, ainsi que larchitecture projet, est moins complexe. Le plus logique sera alors de crer un site web Silverlight dans lequel JavaScript assurera la logique.

    1 Si vous souhaitez au contraire crer une application riche ayant une forte interactivit utili-sateur, optez pour C#, Visual Basic ou nimporte quel langage gr par la DLR (selon votre culture). Tous ces langages ont accs lensemble des fonctionnalits du lecteur Silverlight et permettent des performances bien suprieures lintgration simple de JavaScript. Bien que cela soit rellement possible, raliser une bannire avec C# est sans aucun doute dis-proportionn.

    Quel est votre corps de mtier ?1 Si vous tes intgrateur HTML ou que vous cumulez les expriences dans ce secteur, vous avez sans doute dj dvelopp avec JavaScript et vous connaissez peut-tre AJAX. Vous naurez donc pas deffort de reformation dans un premier temps. Vous vous apercevrez ce-pendant que certaines interactions seront moins faciles, voire impossibles mettre en place en JavaScript. Je vous encourage envisager un apprentissage C# moyen terme. Visual Basic est un trs bon langage bnficiant dune grande communaut, mais sa syntaxe est trs spcifique. C# est tout de mme plus proche de ce que nous connaissons.

    1 Si vous tes un dveloppeur Java ou .Net, C# parat tout dsign, la puissance de ce lan-gage, son confort dutilisation, son orientation vers des langages fonctionnels, surtout dans sa version 3 (avec les infrences de type par exemple) sont sans gales.

    Pour notre part, nous utiliserons de faon significative le XAML et opterons pour le langage C#, assez proche de la norme ECMA (les origines de lauteur) sur de nombreux points. JavaScript ne nous servira qu lintgration de Silverlight au sein dune page HTML. Ce livre sadresse en partie aux designers web, dans ce cadre et pour diverses raisons, nous naborderons pas Visual Basic, IronRuby, IronPython ou JScript.

    Au Chapitre 2, afin de commencer notre apprentissage de Silverlight, en douceur, nous ferons un rapide retour sur les bases du langage XML et XAML, ainsi que sur C#. De cette manire, vous les assimilerez plus facilement par la suite.

  • 2Le couple XAML / C#

    Lapparition du XAML constitue lune des grandes nouveauts de .Net 3. Ce langage repose sur XML. Dans ce chapitre, nous reviendrons donc brivement sur lcriture et la grammaire XML. Puis nous verrons en quoi certains processus de cration sont facilits grce XAML, et comment afficher un document XAML valide au sein dun navigateur ou dun diteur de code simple.

    Au mme niveau que XAML, le langage C# permet dajouter de la logique nos applications Silverlight. Nous dresserons donc un rcapitulatif succinct de lcriture afin de vous familiariser avec C# et la programmation oriente objet. Si vous dveloppez avec un autre langage, comme JavaScript ou PHP, ou si vous tes intgrateur, ce chapitre vous concerne. Ainsi, inutile de consa-crer des heures la lecture dun ouvrage sur C#, dans un premier temps. Si vous tes vous-mme dveloppeur .Net, vous pouvez passer votre chemin ou revoir les fondamentaux du langage.

    2.1 XML

    Le XAML repose sur XML. Connatre les rgles dcriture du XML revient donc respecter celles du XAML. XML est lacronyme de eXtensible Mark-up Language, cest un langage dcla-ratif balises.

    2.1.1 quoi sert le XML ?

    Le XML na quun seul objectif : prsenter dune manire structure et universelle des donnes. Il ny a pas de vocabulaire li ce langage, seule la grammaire est importante. Celle-ci est trs simple et ne connat que quelques rgles importantes. XML se veut donc le plus gnrique pos-sible. Au contraire du XAML qui est conu pour afficher un visuel et qui possde un vocabulaire spcifique, le XML ne possde pas de vocabulaire spcifique. crire ou comprendre la structure dun fichier XML est la porte de tous, dveloppeurs ou non. Les noms des balises ne sont donc pas prdfinis ou figs, mais arbitrairement choisis par le dveloppeur ou le fournisseur de la source XML. Le transit de fichier XML est indpendant du rseau, de la plateforme ou de la connaissance pralable du fichiers XML. Cest aujourdhui le format de communication le plus utilis sur Internet. Vous connaissez sans doute les fameux flux RSS bass sur XML. Les flux RSS

  • 14 PartieI Approches de Silverlight

    ne sont rien dautre que des fichiers de donnes XML respectant la norme RSS. Cest pour cette raison quun lecteur de flux RSS est capable de lire nimporte quelle source do quelle provienne tant que la norme RSS est respecte. Voici un exemple de contenu au format XML :

    Borntobealive YouTurnmeOn ItComesSoEasy ...

    Vous remarquez que les donnes sont structures suivant des relations familiales. Ainsi la ba-lise INTERPRETE contient plusieurs balises ALBUM qui contiennent elles-mmes plusieurs balises CHANSON. Les balises ALBUM sont surs les unes par rapport aux autres car elles sont situes sur le mme niveau dimbrication : elles sont toutes contenues par la balise mre INTERPRETE. Nous pouvons donc comparer une structure XML un arbre gnalogique. Toutefois les noms des ba-lises sont arbitraires et ne relvent pas du langage proprement dit. Nous allons maintenant tudier les rgles dcriture du XML qui sappliquent galement aux langages drivs tels que XAML.

    2.1.2 La grammaire

    Le langage XML est constitu de balises et dattributs. Les balises peuvent tre ouvrantes, fer-mantes ou auto-fermantes. Les attributs sont dfinis au sein des balises ouvrantes ou auto-fer-mantes. Ils sont suivis de loprateur daffectation = et leurs valeurs sont toujours entre guillemets (voir Figure 2.1).Figure2.1

    Structure

    dun fichier XML.

    Nud racine

    Valeur de l'attribut nom

    Balise auto-fermante

    Balise fermante

    Balise fermante du nud racine

    Nud texte

    Nud lment

    Attributs de balise

  • 15Chapitre2 Le couple XAML/C#

    Bien que les balises soient dfinies arbitrairement, il existe des rgles dcritures respecter sous peine que le fichier ne soit pas lisible :

    La balise xml est proscrite. Cest une balise rserve, utilise uniquement pour dcrire lenco-dage du fichier XML.

    Les balises ne doivent pas commencer par un chiffre ou par un caractre spcial. Le seul caractre spcial autoris est _. Les autres ne doivent pas tre contenus dans un nom de balise. Attention donc viter les caractres avec accent dont la langue franaise fourmille.

    Il doit y avoir un unique nud racine. Dans le code XML prcdent, la balise racine est DISCOGRAPHIE.

    Une balise ouverte doit imprativement tre suivie dune balise de fermeture qui commence par "

  • 16 PartieI Approches de Silverlight

    Pour les langages comme le XAML, les diffrentes approches dimbrication de balises permettent une souplesse de conception unique. Nous allons donc nous intresser davantage au XAML afin de comprendre en quoi ces relations peuvent engendrer des visuels diffrents et innovants.

    2.2 XAML, un langage dclaratif puissant

    2.2.1 Lutilit du XAML

    Comme nous lavons expliqu au Chapitre 1, le XAML, driv de XML, est le nouveau langage apport par .Net 3. Ce langage permet simplement un graphiste de formaliser nimporte quel vi-suel. Crer des lments graphiques, grce ce langage, peut donc tre ralis de deux manires :

    La premire consiste crire du XAML via nimporte quel traitement de texte ou diteur de code. Cest lapproche que va adopter le dveloppeur. Un outil comme Note Pad suffit, mais Visual Studio est recommand car le dveloppeur bnficie de lIntelliSense. Ce concept faci-lite grandement la programmation en vitant aux concepteurs de connatre le vocabulaire dun langage dans sa totalit. Cela suppose que le graphiste code le visuel, ce qui nest pas lidal car concevoir du graphisme de cette manire se rvle tre une dmarche abstraite et indirecte, qui fait appel peu de sensibilit. Lapprentissage technique du langage est tel que le coder directement dans un premier temps nuit la cration graphique.

    La deuxime mthode passe par lutilisation dun outil ddi aux graphistes ou aux designers interactifs. Dans ce cas, deux logiciels de la suite Expression rpondent cette problma-tique : Expression Blend et Expression Design. Avec ces deux logiciels, les graphistes peuvent concevoir le design dlments visuels ou dune application. Ces logiciels ont la capacit de traduire le visuel en XAML. Une fois le design cr, le dveloppeur peut non seulement en avoir un aperu, mais aussi rcuprer le code XAML gnr de manire transparente. Si vous travaillez avec des outils tels que Adobe Illustrator ou Photoshop, il est tout fait possible dimporter les fichiers produits par ces logiciels au sein dExpression Design ou Expression Blend directement. Dans ce cas, les fichiers psd ou ai sont transforms en bitmap ou au for-mat vectoriel XAML selon le type du fichier import.

    Le code gnr est directement rutilisable au sein dune production, le dveloppeur ne le mo-difiera que trs peu et laissera la place au designer interactif. Le travail de ce dernier est donc rellement respect. Voici une liste de ce qui peut tre formalis en XAML par le graphiste :

    les tracs vectoriels ; les couleurs unies ; les dgrads de couleurs ; Les animations ; les composants visuels ; lagencement dune interface visuelle ; les styles de composants ; les modles de composants ;

  • 17Chapitre2 Le couple XAML/C#

    les filtres ; la 3D.

    Comme nous pouvons le voir, le XAML est un formidable outil de communication conu pour chaque acteur dune production. Lergonome, le directeur artistique, le graphiste, le designer in-teractif, lintgrateur, le dveloppeur et le directeur technique peuvent participer pleinement la cration dune application sans empiter sur le travail des uns ou des autres.

    2.2.2 Comparaison XAML / C#

    Ces deux langages sont de mme niveau. Cela signifie que tout ce qui est cr en XAML peut ltre via C#, bien quil ne soit pas adapt la cration graphique. Linverse nest pas vrai, XAML est orient visuel avant tout, ainsi il nest pas possible de crer dalgorithmes quelconques sans C# ou un autre langage logique, comme VB.

    Voici lcriture dun bouton en C# :

    ButtonmonBouton=newButton();monBouton.Width=156;monBouton.Height=80;monBouton.Content="Hello";Canvas.SetTop(monBouton,50);Canvas.SetLeft(monBouton,75);monBouton.Background=newSolidColorBrush(Color.FromArgb(0xFF, 0xC3,0x02,0x02));monBouton.Click+=newRoutedEventHandler(button_Click);monCanvas.Children.Add(monBouton);

    Voici la mme criture en version XAML :

    Dans ces exemples, nous instancions un bouton lintrieur dun conteneur de type Canvas. Comme nous le constatons, le XAML est bien plus simple crire. Par exemple, affecter une cou-leur se rvle trs facile. De mme, dfinir le bouton comme enfant dun autre objet est trs intuitif et moins verbeux quen C#. Cela provient de la nature mme du XAML qui mane du XML. Vous pouvez avoir un aperu du rsultat la Figure 2.2.

    Figure2.2

    Visuel dun bouton gnr par XAML ou C#.

  • 18 PartieI Approches de Silverlight

    La proprit Content du bouton permet dans ce cas dafficher le mot Bonjour. Cette proprit ne sappelle pas Label car elle a la capacit dafficher autre chose quune chane de caractres. Grce son criture, trs souple, sappuyant sur le langage XML, le XAML permet dimbriquer des objets complexes aisment. Pour cela, il suffit de dfinir lobjet imbriqu comme nud lment enfant du bouton (voir la section 2.1.2 pour plus dinformations sur XML). Par exemple, on peut afficher une case cocher dans le bouton au lieu dun mot (voir Figure 2.3) :

    Figure2.3

    Visuel dun bouton gnr par XAML avec case cocher.

    Lexemple de la Figure 2.3 ne serait pas rellement ergonomique pour lutilisateur, imbriquer une case cocher au sein dun bouton na pas de relle utilit, toutefois cela montre quel point le XAML sappuie sur les relations familiales hrites du XML. Vous pourrez donc imaginer toutes sortes dinterfaces visuelles et de nouvelles ergonomies pour vos applications. Ce nest quun aperu de ce dont le XAML est capable. Vous allez maintenant crer votre premier visuel XAML.

    2.2.3 Afficher un visuel XAML

    Lexemple prcdent est illustratif, mais nous ne bnficions daucun moyen pour le moment den avoir un aperu. Bien sr, vous pourriez utiliser Expression Blend ou Visual Studio, mais ces logiciels sinscrivent dans une logique de projet. Vous souhaiterez souvent avoir laperu vi-suel dun code XAML sans pour autant crer un projet ou une solution (voir Chapitre 3). Pour cela, il existe quelques diteurs de XAML dont lun sappelle Kaxaml. Il a t conu par Robby Ingebretsen, vous pouvez le tlcharger cette adresse : http://www.kaxaml.com. Comme le dit son concepteur, lobjectif est de vous proposer une IntelliSense pousse tout en fournissant un aperu de nimporte quel fichier XAML prsent sur votre disque dur. Vous trouverez un fichier de dmonstration, preview.xaml, dans le dossier chap2 des exemples du livre.

    Cependant Kaxaml nest pas obligatoire. Il existe une autre solution si vous souhaitez envoyer votre travail un collgue ou votre directeur artistique, mais que ces derniers ne possdent pas dditeur XAML. En ralit, ils nen ont pas forcment besoin tant quaucun code logique nest li au code dclaratif. Tout fichier XAML que vous crez est lisible par votre navigateur, si le lecteur Silverlight est install, et si ce fichier est correctement format. Dans ce dernier cas, le lecteur Silverlight compile directement le fichier XAML lexcution et laffiche dans le navigateur (voir Figure 2.4).

  • 19Chapitre2 Le couple XAML/C#

    Figure2.4

    Fichier preview.xamldirectement lisible par Internet Explorer ou Kaxaml.

    Mme si Kaxaml est pratique pour lire des fichiers, il ne permet pas rellement un graphiste dlaborer des lments visuels complexes. Nous utiliserons donc exclusivement Expression Blend et Visual Studio pour concevoir nos projets.

    2.2.4 Espaces de noms

    Pour visualiser correctement un code dclaratif XAML, vous devez imprativement utiliser les espaces de noms conformes au dveloppement XAML. Voici une portion du code o vous pouvez apercevoir les espaces de noms dans les lignes en gras ; il permet dafficher la Figure 2.4 :

    Vous remarquez que le code prcdent rpond bien au standard XML. Outre de nombreuses balises permettant de gnrer du contenu graphique, il sy trouve un nud XML racine UserControl. Ce-lui-ci reprsente le premier objet visuel de lapplication Silverlight. Au sein de cette balise, deux attributs nous intressent particulirement : xmlns et xmlns:x. Les initiales xmlns signifient XML NameSpace. Ces attributs sont des espaces de noms, cest--dire quils font rfrence des dic-tionnaires ncessaires au dveloppement dapplications bases sur WPF et XAML. Ces espaces de noms doivent toujours se situer dans le conteneur XAML racine. Le premier fait rfrence la bibliothque WPF (Window Presentation Foundation) dont Silverlight mane. Cest lespace de noms par dfaut. Grce lui, nous avons accs aux objets complexes de cette bibliothque, comme Border, Grid ou TextBlock. En interne, cette bibliothque est base sur le langage XAML. Cest pourquoi on a besoin dun deuxime espace de noms, xmlns:x, qui fait pour sa part rfrence au

  • 20 PartieI Approches de Silverlight

    langage XAML proprement dit. chaque fois que nous ferons rfrence cet espace de noms, les balises ou attributs devront tre prfixs de x:. Cest, par exemple, le cas de lobjet grille qui contient lattribut x:Name :

    Pour adjoindre un comportement logique aux objets visuels, il vous faudra une classe dite par-tielle. Celle-ci devra tre rfrence au sein du nud racine de cette manire (voir Chapitre 3 pour les classes partielles) :

  • 21Chapitre2 Le couple XAML/C#

    garder des donnes sur le poste client local. Il sagit de la bibliothque IsolatedStorage. Celle-ci contient plusieurs classes qui permettent datteindre cet objectif.

    2.3.2 Introduction la programmation oriente objet

    La programmation oriente objet soppose la programmation procdurale. Jusquau dbut des annes 1980, avec les langages bas niveau proche de la machine, le code tait organis de manire linaire : il tait lu de haut en bas la manire dune procdure que lon suit. Par la suite, avec des langages comme C++, puis des langages de haut niveau, la programmation oriente objet sest impose. La POO part du principe que la plupart des fonctionnalits ou composants dune application peuvent tre dcrits sous forme dobjets. Par exemple, si lon cre une application de gestion de parc automobile, on peut considrer les voitures comme un composant essentiel de lapplication, les voitures seront donc envisages comme des objets. Les objets sont en ralit des exemplaires de modles dobjets appels classes. Chaque exemplaire de la classe Voiture sera diffrenci par les valeurs de ses proprits et de ses champs (voir la section 2.3.4.6). Par convention, on privilgie la notation Pascal o chaque nom de variable ou de mthode commence par une majuscule : MaFonction, MaProprit, MonChamp. Pour les paramtres de mthode, on utilise plutt la notation Camel : monParametre. Le modle de Voiture, appel classe, permet de dcrire tout ce que peut faire une voiture, ainsi que tout ce qui la dfinit. Le mot-cl class permet de crer une nouvelle classe. Voici en C# comment gnrer une classe Voiture :

    classVoiture{//champsdelaclassevoiturepublicstringMarque;publicstringModele;publicstringImat;publicdoubleLongueur;publicstringTypeCarburant;

    //mthodequipermetlavoiturederoulerpublicvoidRoule(){//permetdetracerlavoiturerouledansuneconsoleConsole.WriteLine("lavoitureroule");//permetdelaisserlaconsoleafficheConsole.ReadLine();}

    //mthodequipermetlavoituredesarrterpublicvoidStop(){Console.WriteLine("lavoiturestoppe");Console.ReadLine();}}

    Comme nous le voyons, tous les exemplaires manant de la classe auront des champs et des m-thodes (ou fonctions) propres au modle Voiture. Toutefois, les valeurs affectes aux proprits et aux champs pourront tre diffrentes pour chacun deux, cest cela qui permet de les diff-rencier. Toutes les voitures ont une proprit couleur, mais celle-ci pourra possder plusieurs valeurs : rouge, verte ou bleu selon lexemplaire. Le mot-cl new permet de crer un nouvel exem-plaire de la classe Voiture. Voici comment vous pouvez crer des exemplaires (galement appels instances) du modle Voiture :

  • 22 PartieI Approches de Silverlight

    //voiciunexemplairedelaclasseVoitureVoitureMaPorsche=newVoiture(){Marque="Porsche", Longueur=1.95,Modele="Carrera4",TypeCarburant="essence"};//voiciunautreexemplaireVoitureMaSuper5=newVoiture(){Marque="Renault", Longueur=1.2,Modele="Super5",TypeCarburant="diesel"};

    On se rend bien compte que chaque voiture instancie possde les mmes champs mais que ceux-ci contiennent des valeurs diffrentes. La dclaration et laffectation de variables seront abordes la section 2.3.4.

    2.3.3 Une premire application en mode console

    Nous allons maintenant mettre en pratique notre apprentissage rcent en crant une petite appli-cation en mode console. Ouvrez Visual Studio 2008 et choisissez Fichier > Nouveau projet C# > Application console. Entrez le nom de solution : ParcAuto. Voici le code que Visual Studio gnre par dfaut :

    usingSystem;usingSystem.Collections.Generic;usingSystem.Linq;usingSystem.Text;

    namespaceParcAuto{classProgram{staticvoidMain(string[]args){}}}

    Toute application console possde une classe par dfaut qui sappelle Program, contenue dans un espace de noms correspondant au nom du projet. Celle-ci contient une mthode qui sexcute par dfaut : Main. Nous allons tracer un message dans la console Windows. Pour cela, ajoutez les lignes suivantes au sein de la mthode Main :

    staticvoidMain(string[]args){Console.WriteLine(Bonjourtoutlemonde!!); //cecitracelemessageConsole.ReadLine(); //ceciempchelafermeturedelaconsole}

    Pour compiler notre premire application et lexcuter, rien de plus simple : appuyez sur la touche F5. Lorsque vous utilisez ce raccourci, vous lancez le mode Debug. Ce dernier vous permettra de corriger et de comprendre les dysfonctionnements de votre application lorsque vous compilerez ou durant son excution. Si vous nutilisez pas ce mode, votre application chouera en silence si elle contient des erreurs. Pour compiler et excuter sans dboguer, il suffit de laisser appuyer sur les touches Ctrl et F5 en mme temps. Si vous souhaitez uniquement compiler sans lancer votre application, vous pouvez utiliser le raccourci Ctrl+Maj+F5.

  • 23Chapitre2 Le couple XAML/C#

    2.3.4 Les types

    2.3.4.1Variablesetchampsdobjets

    Une variable permet de stocker des donnes. Voici comment dclarer une variable au sein dune classe, dans ce cas la variable est un champ dobjet (en C#, on diffrencie champ de proprit) :

    classProgram{intmonEntier=13;}

    Vous remarquez que le type est toujours prcis en premier, dans notre cas int signifie entier. Il vous faut, cependant, faire la diffrence entre la dclaration et laffectation. Ce sont deux tapes distinctes et laffectation peut tre ralise plus tard. Nous aurions tout aussi bien pu crire :

    classProgram{intmonEntier;monEntier=13;}

    Il arrivera souvent de dclarer une variable sans pour autant laffecter. Par exemple, dans un jeu la variable score sera affecte ds son initialisation mais durant lexcution du programme. Lorsquune variable de type entier est dclare sans tre affecte, sa valeur par dfaut est 0. Ce comportement est d au fait que le type int est un type primitif numrique.

    2.3.4.2Lestypesprimitifs

    Il est ncessaire de typer les variables dune part par obligation due au langage, et dautre part parce que cela permet damliorer les performances de vos applications. Le choix du type est trs important dans ce contexte car cest lui qui dterminera loccupation mmoire alloue par dfaut pour stocker la valeur. Parmi tous les types existants, on trouve les types primitifs. Ceux-ci accep-tent des valeurs simples. Ils sont la base de tous dveloppements, sans eux aucune conception ne verrait le jour. Voici quelques types primitifs importants : sbyte. Il contiendra une valeur entire comprise entre 128 et 127. Son nom vient du fait que la valeur pourra tre ngative (s pour signed) et que le nombre de possibilits correspond un octet soit 28 (256 chiffres). Il ne faudra pas confondre Byte, en anglais, et bit, qui signifie 0 ou 1.

    byte. Ce type peut accepter un entier entre 0 et 255. uint. Il accepte un entier entre 0 et 232, soit 4 294 967 295 possibilits. Le u de uint signifie que la valeur sera toujours non signe (u pour unsigned), donc toujours positive.

    int. Il reprsente le mme nombre de possibilits mais contient la moiti des chiffres en des-sous de 0. Soit entre 2 147 483 648 et 2 147 483 647.

    decimal. Il contient des valeurs virgule. La plage des valeurs admises se situe entre 1028 et 7.91028.

    double. Ce type contient galement des valeurs virgule. Comme pour decimal le stoc-kage des donnes est assez complexe, mais le nombre de valeurs acceptes est beaucoup plus grand : entre 510324 et 1.710308.

  • 24 PartieI Approches de Silverlight

    bool. Il est le digne reprsentant de la logique de Mr George Boole. Ce mathmaticien bri-tannique est lorigine dune rvolution des mathmatiques et de la philosophie au XIXme sicle. On en trouve aujourdhui de nombreuses utilisations dans lindustrie ou dans le secteur informatique. Ce type ne peut contenir que deux valeurs : vrai ou faux (true ou false) ; le bit de donne repose sur cette logique.

    string. Il reprsente une chane de caractres. La valeur est toujours spcifie entre guille-mets. La chane de caractres contenue peut-tre infinie, la mmoire utilise sera alloue au fur et mesure des besoins. Toutefois le type string nest pas comme les autres types simples (voir la section "Le tas et la pile" dans ce chapitre).

    2.3.4.3Lestypescomplexes

    Stocker des valeurs simples ne suffit pas. Bien souvent, vous aurez besoin dune variable ayant la capacit de contenir plusieurs donnes. Voici les types complexes :

    Les numrations notes enum. Elles vous permettent de stocker un choix de valeurs arbitrai-rement. Si lon reprend lexemple de la voiture, nous pourrions par exemple proposer une numration pour le type de carburant au lieu dune chane de caractres. Nous pourrions crire ceci :

    classProgram{VoitureMaDeLorean=newVoiture(){TypeCarburant= Carburant.Detritus,Marque=DeLorean,Modele=volante};}enumCarburant{Diesel,Essence,propane,Detritus,Ethanol}classVoiture{publicstringMarque;publicstringModele;publicCarburantTypeCarburant;}

    Vous remarquez que lnumration est en dehors de la classe, elle se suffit elle-mme. Elle pourrait galement en faire partie. Au sein de la classe Voiture, nous dclarons un nouveau champ public de type Carburant. Le mot-cl public est un modificateur daccs, nous ver-rons les modificateurs daccs plus loin dans ce chapitre. Laffectation se produit au niveau de la classe Program, linstanciation dune nouvelle voiture grce cette ligne :

    VoitureMaDeloreane=newVoiture(){TypeCarburant=Carburant.Detritus,Marque=DeLorean,Modele=cellequivole};

    Il faut savoir quune valeur dnumration possde toujours un type sous-jacent. Par dfaut ce type est int mais vous pourriez le changer.

    Les structures notes struct. Il sagit de lquivalent dune classe, mais elle est gre diff-remment en mmoire. Il faut envisager une structure comme une dfinition dobjets. Dans la majorit des cas, ce seront des objets simples. Par exemple, un point gographique est dfini

  • 25Chapitre2 Le couple XAML/C#

    grce deux coordonnes : la latitude et la longitude, toutes deux exprimes en degrs. Nous pourrions ainsi dfinir la position de notre voiture grce une structure qui sappellerait-PositionGPS :

    classProgram{//ceciestunecriturepratique//pourcrerunnouvelexemplairedevoitureVoitureMaDeloreane=newVoiture(){TypeCarburant=Carburant.Detritus,Marque="DeLorean",Modele="volante",MyPlace=newPositionGPS(){DegreLat=180,DegreLong=176}};}structPositionGPS{publicintDegreLat;publicintDegreLong;}classVoiture{publicstringMarque;publicstringModele;publicCarburantTypeCarburant;publicPositionGPSMyPlace;}

    Les tableaux nots Array et []. Ce sont des objets diffrents de ceux que nous venons de citer en cela quils sont faits pour stocker de multiples donnes sous forme dlments indexs nu-mriquement partir de 0. Il faudra toujours prciser le type des objets stocks. Pour initialiser un tableau, il existe deux mthodes. La premire consiste utiliser le mot-cl new et indiquer le nombre dlments quil pourra contenir. Dans dautres langages comme Java ou Action-Script 3, ce type correspond la classe Vector (vecteur). Voici un exemple dinstanciation :

    Voiture[]MesVoitures=newVoiture[3];

    Par la suite, on affecte une voiture chaque index numrique du tableau comme ceci :

    MesVoitures[0]=MaDeLorean;MesVoitures[1]=MaPorsche;MesVoitures[2]=MaSuper5;

    Voici la seconde mthode appele "criture littrale" :

    Voiture[]MesVoitures={MaDeloreane,MaPorsche,MaSuper5};

    Il nous suffit maintenant daccder aux voitures du tableau. Pour cela, nous pouvons utiliser une boucle qui nous permettra de tracer le nom de chaque voiture dans une console Windows. La boucle foreach est la mieux adapte ce type de situation. Voici comment lutiliser :

    voidTraceMesVoitures(){//PourchaquelmentdetypeVoituredansletableauMesVoituresforeach(VoitureVinMesVoitures){//cettelignepermetdafficherlersultatdansuneConsoleConsole.WriteLine("jaiune{0}",V.Marque);}//celle-cipermetdefigerlaffichagedelaconsolepourlalectureConsole.ReadLine();}

  • 26 PartieI Approches de Silverlight

    Concrtement, la boucle parcourt le tableau MesVoitures, rcupre un exemplaire de Voiture chaque index et trace une phrase en fentre de sortie. Cette boucle sarrte delle-mme lorsque le tableau est entirement parcouru. Les tableaux possdent la proprit length qui permet de connatre le nombre dlments contenus en leur sein. Lobjet List, en C#, est plus souvent utilis que lobjet tableau (Array) en raison des nombreuses capacits quil offre. Un tableau possde une longueur (ou nombre dlments) fixe. La classe List possde pour sa part des mthodes lui permettant dajouter ou de supprimer des lments sans avoir besoin dinitialiser la longueur. Vous la trouverez dans lespace de noms System.Collections. Generic.

    2.3.4.4Lesmodificateursdaccs

    Vous avez sans doute remarqu le mot-cl public prsent devant la dclaration de certains membres de classe. Cest un modificateur daccs. Ces derniers permettent de rendre accessible ou non des champs, des proprits et des mthodes de classe. Le mot-cl public permet de rendre un membre de classe accessible depuis lextrieur de la classe. Cest cela qui nous a permis dins-tancier des voitures tout en initialisant leurs champs publiques depuis lextrieur. Voici un cas concret :

    classProgram{//ceciestunecriturepratique//pourcrerunnouvelexemplairedevoitureVoituremaDeLorean=newVoiture();maDeLorean.marque="DeLorean";}classVoiture{publicstringmarque;GuidnumeroSerie=newGuid();}

    La proprit numeroSerie nest dfinie avec aucun modificateur daccs. En fait, lorsque rien nest prcis cest le modificateur private qui est utilis la compilation pour un membre de classe. Pour une classe ce sera le mot-cl internal. Un champ de classe, dfini avec private, nest pas accessible en dehors de la classe, mais seulement en son sein. La meilleure pratique consiste toujours laisser le moins de champs ou de mthodes visibles depuis lextrieur. Votre classe doit toujours tre ferme la modification et toujours ouverte lextension. Seules les proprits et mthodes utiles doivent tre accessibles celui qui instancie ou utilise votre classe. Dans le cas prcdent, il est logique que le numro de srie reste priv et ne soit pas accessible au quidam de base. Le type Guid est en fait une valeur unique car le nombre de possibilits est quasi illimit. De plus, on affecte la valeur lors de linstanciation de la classe Voiture. Voici la liste des modificateurs daccs utilisables :

    public. Permet laccs depuis nimporte quel endroit du code. private. Dfinit un membre de classe accessible uniquement depuis la classe contenant ce membre.

    internal. Autorise laccs toutes les classes de lespace de noms dans lequel est la classe et aux espaces de noms amis.

    protected. Permet laccs au code situ au sein de la classe ou dans une de ses sous-classes.

  • 27Chapitre2 Le couple XAML/C#

    2.3.4.5Conversiondetypeimpliciteetexplicite

    Il vous arrivera souvent dans un langage orient objet de transformer le type dune valeur en un autre type. Catgoriser des objets est une dmarche qui permet doptimiser les performances des applications. Toutefois catgoriser est une dmarche rigide, mme dans la vie courante. Il est tou-jours dangereux et rarement vrai long terme quun objet soit dun seul type. La classification des espces, bien que ncessaire dun point de vue scientifique, est remise en question chaque fois quune espce sortant du cadre est dcouverte. Lornithorynque est le cas le plus flagrant qui d-montre que classifier des espces est hasardeux. Celui-ci pond des ufs, allaite ses petits, possde un bec de canard, sappuie sur des pattes aux cinq orteils palms. Bref, il regroupe de nombreux aspects que lon croyait uniques au mammifres, aux reptiles et aux ovipares. Il ne rentre dans aucune catgorie simple et prsente certains aspects de plusieurs dentre elles (depuis la thorie de Darwin, la classification des espces a volu, il sagit bien ici dun exemple mettant en vidence la dangerosit de cette manire de raisonner). Pour cette raison et de nombreuses autres, il vous arrivera donc souvent, si vous commencez la POO, dutiliser un type la place dun autre ; davoir un jour besoin dun entier la place dun dcimal ou de transformer un boolen en chiffre. Pour transformer un type en un autre type, vous utiliserez une opration de conversion implicite ou explicite appele transtypage ou casting en anglais.

    La conversion implicite est ralise par le compilateur sans que vous ayez besoin de lui indiquer un mot-cl. Pour que le compilateur puisse russir cette opration, il suffit juste que le type de destination accepte la valeur que lon souhaite dfinir avec ce type. Par exemple, il est facile de transformer un type byte en type uint car un byte est toujours positif et la plage de valeurs pos-sibles est contenue dans la plage de valeurs possibles de uint :

    intMonEntier;byteMonByte=113;MonEntier=MonByte;//Danscecas,letypedebseraconvertienintlacompilation,//cequiestfaisable,puisarecevralavaleurdeb.

    Il est donc trs facile de dduire les conversions implicites pour les types primitifs numriques. Le deuxime type de transtypage est un peu plus dlicat manier car il vous faudra prciser vous-mmes la conversion souhaite. Nous allons reprendre le mme exemple, mais en affectant la valeur de type byte un entier not int :

    byteMonByte2;intMonEntier2=113;MonByte2=(byte)MonEntier2;Console.WriteLine(typedeMonByte2::+MonByte2.GetType());

    Dans ce cas, vous devrez mettre le type de destination entre parenthse devant la valeur convertir. Tout type possde une mthode GetType renvoyant le type. Si jamais vous oubliez de convertir explicitement, Visual Studio vous surligne la valeur affecte dans notre cas, cela serait monEntier2. Lorsque vous passez la souris au-dessus du surlignage, Visual Studio vous indique que vous avez peut-tre oubli une conversion et vous prcise quune conversion explicite existe. Cela nest pas toujours le cas. Que se passe-t-il si jamais une valeur numrique sort de la plage de valeur admise par le type de destination ? Par exemple, que se passerait-il si monEntier3 tait gal 312 ? Le rsultat corres-pond la valeur convertir, modulo (%) la longueur de la plage des valeurs du type de destination.

  • 28 PartieI Approches de Silverlight

    Modulo est un oprateur mathmatique qui permet de calculer le reste dune division entire. Dans notre exemple "312 modulo 256" nous renverra 56. 312 divis par 256 est gal 256 divis par 256 (qui est nombre entier) plus 56 divis par 256. 56 est bien le reste de la division. Ce sera donc la valeur affecte notre variable de type byte :

    intMonEntier3=312;byteMonByte3=(byte)MonEntier3;Console.WriteLine(typedeMonByte3::+MonByte3.GetType()+- valeur::+MonByte3);

    Un autre moyen de convertir explicitement une valeur est dutiliser la classe Convert. Celle-ci possde des mthodes de conversion. Nous pourrions par exemple crire :

    byteMonByte4;intMonEntier4=312;MonByte4=Convert.ToByte(MonEntier4);Console.WriteLine(typedeMonByte4::+MonByte4.GetType());

    Lavantage de cette mthode est quelle gnre par dfaut une erreur lexcution si jamais la valeur convertir ne correspond pas la plage du type de destination. Dans lexemple prcdent, nous aurons donc une erreur leve.

    2.3.4.6Diffrencierleschampsetlesproprits

    Jusqu maintenant nous navons utilis que des champs de classe. Une proprit est un membre de classe stockant une valeur au mme titre quun champ de classe. Cependant lavantage dune proprit est quelle permet lajout de logique lorsquelle est mise jour ou lue. Dfinir une pro-prit est simple avec Visual Studio, il suffit de taper prop, suivi de deux tabulations pour gnrer automatiquement le code :

    publicstringmodele{get;set;}

    Ceci est la nouvelle criture courte des proprits depuis C# 3. Vous remarquez le mot-cl get qui signifie obtenir et le mot-cl set qui signifie tablir. Ces termes reprsentent deux mthodes qui vont nous permettre de contrler les accs notre proprit. En rgle gnrale, une proprit est toujours accompagne dun champ priv, donc non accessible, qui est mis jour par ces deux mthodes. Nous allons maintena