ALL DOT.BLOG Tome 7 DOT.BLOG Tome 7 XAML – Tout Profil Olivier Dahan [email protected] Tout...
Transcript of ALL DOT.BLOG Tome 7 DOT.BLOG Tome 7 XAML – Tout Profil Olivier Dahan [email protected] Tout...
-
ALL DOT.BLOG
Tome 7
XAML Tout Profil
Olivier Dahan [email protected]
Tout Dot.Blog mis jour par thme sous la forme de livres PDF gratuits ! Reproduction, utilisation et diffusion interdites sans lautorisation de lauteur
www.e-naxos.com Formation Audit Conseil Dveloppement
XAML (Windows Store, WPF, Silverlight, Windows Phone), C#
Cross-plateforme Windows / Android / iOS - Xamarin
UX Design
http://www.e-naxos.com/blogwww.e-naxos.com
-
P a g e 1 | 435
Table des matires
Prsentation du Tome 7 - XAML ................................................................................................... 16
XAML .......................................................................................................................................................... 17
XAML Les bases .................................................................................................................................. 21
Introduction la premire partie du livre ................................................................................ 21
10 bonnes raisons de choisir XAML ............................................................................................ 22
Introduction : Choisir XAML ? ................................................................................................... 23
Raison 1 : Le modle de contenu riche ................................................................................. 26
Raison 2 : La liaison aux donnes ............................................................................................ 28
Raison 3 : les DataTemplates .................................................................................................... 35
Raison 4 : Le templating des contrles ................................................................................. 39
Raison 5 : Les triggers et le VisualStateManager ............................................................... 51
Raison 6 : Les Styles ...................................................................................................................... 58
Raison 7 : Les validations ............................................................................................................ 62
Raison 8 : Le graphisme .............................................................................................................. 74
Raison 9 : Desktop et Web ......................................................................................................... 81
Raison 10 : Tout le reste ! ........................................................................................................... 81
Conclusion ....................................................................................................................................... 82
9 raisons de plus d'utiliser XAML ! .............................................................................................. 83
Raison 1 ............................................................................................................................................ 83
Raison 2 ............................................................................................................................................ 84
Raison 3 ............................................................................................................................................ 84
Raison 4 ............................................................................................................................................ 84
Raison 5 ............................................................................................................................................ 84
Raison 6 ............................................................................................................................................ 84
Raison 7 ............................................................................................................................................ 84
Raison 8 ............................................................................................................................................ 84
Raison 9 ............................................................................................................................................ 85
Conclusion ....................................................................................................................................... 85
Les proprits de dpendance et les proprits attaches ............................................... 85
-
P a g e 2 | 435
Quest-ce ? ....................................................................................................................................... 86
Des proprits avant tout .......................................................................................................... 87
et des dpendances ................................................................................................................. 87
Et les proprits attaches ? ...................................................................................................... 88
Comment a marche ?................................................................................................................. 89
Proprit de dpendance ou proprit attache ? ........................................................... 93
Le BINDING Xaml Matriser sa syntaxe et viter ses piges ......................................... 115
Rfrences ...................................................................................................................................... 116
Code Source .................................................................................................................................. 117
Prambule ...................................................................................................................................... 118
Le Binding Xaml : Ange ou Dmon ? ................................................................................... 118
Le Binding ...................................................................................................................................... 120
Les dangers du Binding............................................................................................................. 145
Dboguer le Binding .................................................................................................................. 147
Conclusion ..................................................................................................................................... 216
StringFormat : une simplification trop peu utilise ............................................................. 217
De Silverlight Windows Phone 8 et WinRT .................................................................... 217
Le code la Papa......................................................................................................................... 218
StringFormat la rescousse .................................................................................................... 218
Support multi langue ................................................................................................................. 219
Le mini langage dans le mini langage dun langage ...................................................... 221
Dautres rfrences ..................................................................................................................... 223
Conclusion ..................................................................................................................................... 223
L'Element Binding ............................................................................................................................ 224
Mthode 1 dite lancienne ............................................................................................ 225
Mthode 2 dite du certifi ................................................................................................ 225
Mthode 3 dite XAML ........................................................................................................ 228
Contrainte de proprits (Coercion)......................................................................................... 229
La Contrainte de valeur (value coercion) ............................................................................ 229
Coercition et proprits CLR ................................................................................................... 230
-
P a g e 3 | 435
Coercition et proprits de dpendances .......................................................................... 233
WinRT et Silverlight ne supportent pas la coercition ..................................................... 235
Les mauvaises rponses au problme ................................................................................. 236
Une solution ? ............................................................................................................................... 240
Conclusion ..................................................................................................................................... 243
Custom Control vs UserControl ................................................................................................. 244
A lorigine .................................................................................................................................... 244
Composants visuels crer non visuellement .............................................................. 245
Apparition de la dualit ............................................................................................................ 246
Et Dieu cra la flemme ........................................................................................................... 247
et Microsoft Blend ............................................................................................................... 248
Lintrt de crer des Custom Controls plutt que des User Controls ? ................ 249
La cration visuelle des Custom Controls .......................................................................... 255
Conclusion ..................................................................................................................................... 262
Ecrire un UserControl composite ............................................................................................... 263
Command Link quoi cela ressemble ? ............................................................................. 263
Crer le UserControl ................................................................................................................... 264
Crer le look .................................................................................................................................. 264
Utiliser les behaviors .................................................................................................................. 267
Le code ............................................................................................................................................ 269
Le fonctionnel ............................................................................................................................... 270
Conclusion ..................................................................................................................................... 273
La mer, les proprits de dpendance et les user controls... .......................................... 273
La base du UserControl ............................................................................................................. 275
Hritage et proprit de dpendance ................................................................................. 275
La Solution ..................................................................................................................................... 277
Ouf ! ................................................................................................................................................. 279
Ecrire des Behaviors (composants comportementaux) ..................................................... 279
Qu'est qu'un Behavior ? ............................................................................................................ 279
Crer un Behavior ........................................................................................................................ 280
-
P a g e 4 | 435
Un Behavior Exemple : RotateBehavior ............................................................................... 281
Le code exemple .......................................................................................................................... 283
Conclusion ..................................................................................................................................... 287
Un Behavior ajoutant un effet de rflexion (avec WriteableBitmap) ............................ 288
Behavior Collection ......................................................................................................................... 290
My Behavior Collection ............................................................................................................. 290
Portabilit ....................................................................................................................................... 290
Les behaviors ................................................................................................................................ 291
Le code ............................................................................................................................................ 293
Conclusion ..................................................................................................................................... 293
Utiliser des diteurs de valeurs dans les behaviors ............................................................ 294
Conclusion ..................................................................................................................................... 296
Xaml : lier des boutons radio une proprit Int ou Enum ............................................ 296
Le cas dutilisation ....................................................................................................................... 296
Le problme .................................................................................................................................. 297
Les convertisseurs sont nos amis .......................................................................................... 299
Que faut-il convertir ? ................................................................................................................ 300
Le rle des paramtres des convertisseurs ........................................................................ 300
La rversibilit ............................................................................................................................... 301
Le code XAML ............................................................................................................................... 302
Le code du convertisseur .......................................................................................................... 303
Et avec un Enum ? ....................................................................................................................... 304
Conclusion ..................................................................................................................................... 304
Deux rgles pour programmer XAML ...................................................................................... 305
Programmation par Templates .............................................................................................. 305
Programmation par Properties ............................................................................................... 307
Conclusion ..................................................................................................................................... 309
Style ou Template ? ........................................................................................................................ 309
Les Templates ............................................................................................................................... 309
Les Styles ........................................................................................................................................ 309
-
P a g e 5 | 435
Pourquoi cette confusion entre styles et templates ? ................................................... 310
Un Template dans un Style ...................................................................................................... 310
La cassure du templating ......................................................................................................... 311
Docteur Template Binding ....................................................................................................... 312
Retour au Style ............................................................................................................................. 312
Un Template qui a du Style ! ................................................................................................... 313
Conclusion ..................................................................................................................................... 313
Le DataTemplateSelector .............................................................................................................. 314
DataTemplateSelector ............................................................................................................... 314
Comment fait WPF ? .................................................................................................................. 316
Emuler la fonction WPF sous Silverlight et Windows Phone 7/8 ............................... 319
Code Exemple ............................................................................................................................... 322
Conclusion ..................................................................................................................................... 323
La Grid cette inconnue si populaire... ....................................................................................... 324
La Grid ............................................................................................................................................. 325
Conclusion ..................................................................................................................................... 338
Mise en page dynamique et transitions .................................................................................. 338
La mise en page dynamique ................................................................................................... 339
Donner vie au cycle de vie de linformation ...................................................................... 340
Le Design, un gadget ? .............................................................................................................. 341
Et XAML ? ....................................................................................................................................... 342
Un peu darchologie ! .............................................................................................................. 342
Lhistoire prsente (an 2013) ................................................................................................... 346
Plus fou ? ........................................................................................................................................ 355
Conclusion ..................................................................................................................................... 356
Les Pixel shaders (effets bitmap) ......................................................................................................... 356
Les Pixel Shaders ......................................................................................................................... 357
Composer des effets pixel shaders ........................................................................................... 359
Conclusion ..................................................................................................................................... 360
Largeur de DataTemplate et Listbox ........................................................................................ 360
-
P a g e 6 | 435
Masques dopacit (OpacityMask) ............................................................................................ 363
Une scne de jeu ......................................................................................................................... 363
Crer des transparences ........................................................................................................... 364
Pas seulement pour les jeux ! ................................................................................................. 364
OpacityMask ................................................................................................................................. 364
Quelques astuces ........................................................................................................................ 365
The sky is the limit ! .................................................................................................................... 366
Contrles et zone cliquable, astuce... .................................................................................................. 366
Un contrle trs basique pour commencer ....................................................................... 366
Ca se complique... ....................................................................................................................... 366
Qu'est-ce qu'il se passe ? ......................................................................................................... 367
Mais comment rgler le problme ? .................................................................................... 367
Une "fausse" brosse .................................................................................................................... 367
Xaml Dynamique ............................................................................................................................. 368
Blend et les ressources de Design ............................................................................................. 370
Design-Time Resource Dictionary ......................................................................................... 370
Hard ou Soft ? ................................................................................................................................... 371
La ListBox Hard et la ListBox Smooth .................................................................................. 371
Smooth Scrolling vs Rough Scrolling ................................................................................... 373
To be optimized or not to be ? .............................................................................................. 373
La souplesse de Xaml, lintelligence de Blend et la ruse du dveloppeur .............. 373
Un monde presque parfait ....................................................................................................... 375
Un peu dalatoire dans les mouvements .............................................................................. 376
La tremblante du bouton ......................................................................................................... 376
Utiliser un gnrateur de nombre alatoire ...................................................................... 377
Dautres utilisations .................................................................................................................... 378
Dautres liens................................................................................................................................. 378
Conclusion ..................................................................................................................................... 379
Lequel est le plus fonc : Gray ou DarkGray ? ...................................................................... 379
La taille du cul des vaches ........................................................................................................ 379
-
P a g e 7 | 435
Une histoire plus vraie qu'on le pense ................................................................................ 379
Les couleurs sous XAML ........................................................................................................... 380
Et le cul des vaches ? .................................................................................................................. 381
Des origines encore plus lointaines ...................................................................................... 382
Un gris plus fonc que le gris fonc ..................................................................................... 382
Incroyable non ? .......................................................................................................................... 383
Quels outils et quelle chane graphique XAML ? ................................................................. 383
Tour d'horizon des outils .......................................................................................................... 384
Partons de la fin ........................................................................................................................... 385
Etc ! ................................................................................................................................................... 387
Sauts de ligne dans un Content.............................................................................................. 388
Conclusion ..................................................................................................................................... 389
SVG to Xaml ...................................................................................................................................... 389
Dessiner des horloges, un peu de trigonomtrie ! ............................................................. 390
La multi-slection dans les ListBox ........................................................................................... 393
Styles Cascads (BasedOn Styles) .............................................................................................. 394
Un peu de design avec Blend ..................................................................................................... 396
Lexemple ....................................................................................................................................... 397
Les trucs .......................................................................................................................................... 397
Le planisphre .............................................................................................................................. 399
Conclusion ..................................................................................................................................... 401
138 sons gratuits pour vos applications ................................................................................. 402
Limportance du son .................................................................................................................. 402
Des sons rsolument lectroniques ..................................................................................... 403
Un choix adapt aux cas les plus frquents....................................................................... 404
Conception et copyrights ......................................................................................................... 404
Le fichier Zip .................................................................................................................................. 405
Animations, Sons, Synchronisation, Ease in/out sous Blend ........................................... 405
AnimatableSoundPlayer. Ou comment synchroniser du son sur une animation .... 408
AnimatableSoundPlayer............................................................................................................ 409
-
P a g e 8 | 435
Dtection de touches clavier multiples ................................................................................... 413
La classe KeyLogger ................................................................................................................... 415
Problmatique .............................................................................................................................. 415
Solution ........................................................................................................................................... 415
Le code ............................................................................................................................................ 415
Conclusion ..................................................................................................................................... 420
Dtecter les touches Alt, Ctrl .................................................................................................. 420
XML/XAML pretty printer gratuit ............................................................................................... 421
XAML pour WPF ................................................................................................................................... 423
WPF et le focus dentre ............................................................................................................... 423
A lancienne ................................................................................................................................... 423
A la page......................................................................................................................................... 424
Modern UI pour WPF ..................................................................................................................... 424
mahapps.metro ............................................................................................................................ 425
Le designer cest vous ! ............................................................................................................. 425
Des styles et des contrles ...................................................................................................... 425
O trouver mahapps.metro ..................................................................................................... 426
Conclusion ..................................................................................................................................... 426
Un menu gratuit Tuile pour WPF ou comment se donner un air Windows 8 en
bureau classique ........................................................................................................................... 426
Un menu tuile............................................................................................................................ 427
Paramtrable et personnalisable ........................................................................................... 428
La construction du Menu ......................................................................................................... 428
Les difficults ................................................................................................................................ 428
Les entres de menu .................................................................................................................. 429
Le reste, cest dans le code :-) ................................................................................................. 430
Conclusion ..................................................................................................................................... 430
Des transitions de page la Windows 8 pour WPF (et Silverlight) ............................... 431
Ah Modern UI ! ............................................................................................................................. 431
Un conteneur Anim .................................................................................................................. 432
-
P a g e 9 | 435
Et le control Anim ? .................................................................................................................. 432
Le principe ..................................................................................................................................... 432
Le cadeau ....................................................................................................................................... 433
Conclusion ..................................................................................................................................... 433
Avertissements ..................................................................................................................................... 434
E-Naxos ................................................................................................................................................... 434
Table des Figures
Figure 1 - Projet Wpf10-1 ......................................................................................................................................................... 27
Figure 2 - La classe Synthtiseur ............................................................................................................................................ 29
Figure 3 - Projet Wpf10-2 ......................................................................................................................................................... 31
Figure 4 - La page 2 avec ses trois sliders........................................................................................................................... 33
Figure 5 - Le Tooltip en action ................................................................................................................................................ 37
Figure 6 - Projet Wpf10-3 ......................................................................................................................................................... 37
Figure 7 - Projet Wpf10-4 ......................................................................................................................................................... 40
Figure 8 - Projet Wpf10-4b ...................................................................................................................................................... 41
Figure 9 - projet Wpf10-4c ....................................................................................................................................................... 42
Figure 10 - La cration d'un Data Binding sous Blend .................................................................................................. 44
Figure 11 - la cration d'un Data Template sous Blend ................................................................................................ 45
Figure 12 - L'onglet Ressources sous Blend ........................................................................................................................ 46
Figure 13 - Le panneau Objets et Animations de Blend ................................................................................................ 46
Figure 14 -Cration d'un template (mode copie) ............................................................................................................. 48
Figure 15 - Cration d'une ressource de style ................................................................................................................... 49
Figure 16 - Affichage de la ProgressBar relooke par templating ............................................................................. 51
Figure 17 - Projet Wpf10-5 ...................................................................................................................................................... 54
Figure 18 - Le cadre "dtail" n'est pas actif ........................................................................................................................ 56
Figure 19 - Le VisualStateManager sous Blend ................................................................................................................ 57
Figure 20 - La cration d'un nouveau dictionnaire de ressources ............................................................................. 59
Figure 21 - Projet Wpf10-6 ...................................................................................................................................................... 62
Figure 22 - Comportement par dfaut d'une rgle de validation .............................................................................. 65
Figure 23 - L'effet du template de validation personnalis .......................................................................................... 68
Figure 24 - Amlioration du template de validation ...................................................................................................... 69
Figure 25 - projet Wpf10-7 ...................................................................................................................................................... 70
Figure 26 - La prise en charge de la rgle de validation mtier ................................................................................. 71
Figure 27 - ZAM3D en action .................................................................................................................................................. 76
Figure 28 - Exportation XAML d'un projet 3D sous ZAM3D ......................................................................................... 77
Figure 29 - L'intgration de la source 3D dans une page WPF sous Blend (Projet Wpf10-8) ......................... 78
Figure 30 - Animation de l'objet 3D (timeline et story-board sous Blend) ............................................................. 79
Figure 31 - Une application WPF utilisant la 3D ............................................................................................................. 80
-
P a g e 10 | 435
Figure 32 - Cration d'un TextBlock ..................................................................................................................................... 90
Figure 33 - Animation d'une proprit attache .............................................................................................................. 95
Figure 34 - Cration d'un UserControl Jauge .................................................................................................................. 100
Figure 35 - La conception visuelle du contrle ............................................................................................................... 100
Figure 36 - La proprit de notre contrle sous Blend ................................................................................................. 106
Figure 37 - La proprit manipule en XAML sous VS ................................................................................................. 107
Figure 38 - L'animation de la jauge .................................................................................................................................... 109
Figure 39 - Cration de l'animation sous Blend ............................................................................................................. 110
Figure 40 - Schma de principe du Binding ..................................................................................................................... 122
Figure 41 - Exemple de Binding minimaliste ................................................................................................................... 123
Figure 42 - Le mode OneTime .............................................................................................................................................. 126
Figure 43 - Le mode OneWay ............................................................................................................................................... 126
Figure 44 - le mode TwoWay ................................................................................................................................................ 127
Figure 45 - Convertisseur de valeur en action ................................................................................................................ 140
Figure 46 - Excution de test avec bogue de binding ................................................................................................... 157
Figure 47 - Point d'arrt XAML de dbogue de Binding .............................................................................................. 160
Figure 48 - Fentre de sortie Visual Studio avec erreur de binding ........................................................................ 160
Figure 49 - Binding direct ....................................................................................................................................................... 164
Figure 50 - binding sur une proprit ................................................................................................................................ 164
Figure 51 - Accs une sous proprit du DataContext ............................................................................................. 166
Figure 52 - Element Binding .................................................................................................................................................. 166
Figure 53 - StringFormat en US ............................................................................................................................................ 172
Figure 54 - ContentStringFormat ......................................................................................................................................... 175
Figure 55 - ContentStringFormat corrig .......................................................................................................................... 175
Figure 56 - Binding XML ......................................................................................................................................................... 182
Figure 57 - Binding XML depuis un fichier en ressource ............................................................................................. 183
Figure 58 - Binding sur le rsultat d'une requte Linq To XML ................................................................................. 186
Figure 59 - Binding to Self ...................................................................................................................................................... 187
Figure 60 TemplatedParent Binding ............................................................................................................................... 188
Figure 61 - Binding sur recherche d'anctre .................................................................................................................... 189
Figure 62 - Binding sur recherche d'anctre avec niveau de profondeur .............................................................. 191
Figure 63 - Binding PreviousData ....................................................................................................................................... 193
Figure 64 - Template Binding Cration du template sous Blend .......................................................................... 200
Figure 65 - Template binding - application du template 1/2 .................................................................................... 201
Figure 66 -Template binding - application du template 2/2 ..................................................................................... 201
Figure 67 - Template binding - Essai de changement de Background .................................................................. 202
Figure 68 - Template binding - cration du lien sous Blend ...................................................................................... 203
Figure 69 - Le bouton correctement templat ................................................................................................................ 203
Figure 70 - Le Collection Binding......................................................................................................................................... 206
Figure 71 - Priority Binding - 1/3 ........................................................................................................................................ 209
Figure 72 - Priority Binding - 2/3 ........................................................................................................................................ 209
Figure 73 - Priority Binding - 3/3 ........................................................................................................................................ 209
Figure 74 - Element binding en action .............................................................................................................................. 224
Figure 75 - Exemple de coercion de valeurs .................................................................................................................... 237
Figure 76 - Visuel d'un Command Link ............................................................................................................................. 263
file:///D:/EnCours/AllDotBlog/AllDotBlogXAML.docx%23_Toc376109059
-
P a g e 11 | 435
Figure 77 - Cration d'un UserControl sous Blend ........................................................................................................ 264
Figure 78 - Dfinition du visuel d'un UserControl ......................................................................................................... 265
Figure 79 - Icne pour Command Link .............................................................................................................................. 265
Figure 80 - Finalisation du visuel du UserControl ......................................................................................................... 266
Figure 81 - L'aspect du Command Link ............................................................................................................................. 266
Figure 82 - Animation et Timelime ..................................................................................................................................... 267
Figure 83 - Mise en place des behaviors ........................................................................................................................... 268
Figure 84 - les proprits de notre UserControl sous Blend ....................................................................................... 269
Figure 85 - Capture cran de l'animation "la mer" ....................................................................................................... 274
Figure 86 - Capture cran du RotateBehavior ................................................................................................................ 281
Figure 87 - RotateBehavior sous Blend .............................................................................................................................. 282
Figure 88 - Proprits du RotateBehavior sous Blend .................................................................................................. 282
Figure 89 - Capture du behavior de rflexion visuelle ................................................................................................. 289
Figure 90 - CustomPropertyValueEditor ........................................................................................................................... 294
Figure 91 - Exemple de fiche saisie avec boutons radios lis un Int .................................................................... 297
Figure 92 - capture cran - Appliquer un flou en temps rel .................................................................................... 358
Figure 93 - capture cran - Flou appliqu, palette dplace ..................................................................................... 358
Figure 94 - Composition des effets visuels ....................................................................................................................... 360
Figure 95 - Liste avec items templats non cadrs ........................................................................................................ 361
Figure 96 - Liste avec items templats et cadrs ............................................................................................................ 361
Figure 97 - capture de scne de jeu fictif utilisant les masques d'opacit ............................................................ 363
Figure 98 - Application d'un masque d'opacit .............................................................................................................. 365
Figure 99 - capture du programme de test XAML Dynamique ................................................................................. 368
Figure 100 - Ajout d'un dictionnaire de ressources sous Blend ................................................................................ 370
Figure 101 - capture - listes "hard" et "smooth" position de dpart ....................................................................... 372
Figure 102 - capture - dplacement "smooth" de la liste de droite ........................................................................ 372
Figure 103 - Crer un ItemsPanelTemplate ..................................................................................................................... 374
Figure 104 - Mode modification de Template sous Blend .......................................................................................... 375
Figure 105 - capture -Insertion d'un retour la ligne dans le Content d'une CheckBox ................................ 389
Figure 106 - Dessiner des horloges ..................................................................................................................................... 391
Figure 107 - Cercle trigonomtrique et Radians ............................................................................................................ 391
Figure 108 - Cercle trigonomtrique .................................................................................................................................. 392
Figure 109 - Gloubiboulga et MultiSlection ................................................................................................................... 394
Figure 110 - Exemple de styles "based on" ....................................................................................................................... 395
Figure 111 - Un peu de design.............................................................................................................................................. 397
Figure 112 - Le logo original ................................................................................................................................................. 398
Figure 113 - Le vaisseau spatial va dcoller !.................................................................................................................. 403
Figure 114 - Simulation d'un oscilloscope ........................................................................................................................ 405
Figure 115 - capture de l'application exemple utilisant du son synchronis l'animation ........................... 409
Figure 116 - capture de l'application exemple dtection mutlti touche ................................................................ 414
Figure 117 - Exemple de contrles Metro / Modern UI ................................................................................................ 425
Figure 118 - Exemple du menu tuile pour XAML ....................................................................................................... 427
-
P a g e 12 | 435
Table des exemples XAML
XAML 1 - Binding simple .......................................................................................................................................................... 30
XAML 2 - Binding sur des listes .............................................................................................................................................. 30
XAML 3 - Trigger de Binding ................................................................................................................................................... 32
XAML 4 - Element Binding ....................................................................................................................................................... 32
XAML 5 - Navigation .................................................................................................................................................................. 33
XAML 6 - Multi-Binding ............................................................................................................................................................. 34
XAML 7 - Instanciation de convertisseur ............................................................................................................................. 34
XAML 8 - Spcification du champ dans un Binding ........................................................................................................ 35
XAML 9 - Item Template ........................................................................................................................................................... 36
XAML 10 - DataTemplate ......................................................................................................................................................... 38
XAML 11 - Dtournement d'une barre de progression .................................................................................................. 41
XAML 12 - Templating des items d'une liste ..................................................................................................................... 53
XAML 13 - DataTrigger ............................................................................................................................................................. 55
XAML 14 - Dictionnaire de ressources et styles ................................................................................................................ 60
XAML 15 - Dfinition d'une brosse ........................................................................................................................................ 60
XAML 16 - Dfinition d'un style.............................................................................................................................................. 61
XAML 17 - Validation des saisies par dfaut ..................................................................................................................... 65
XAML 18 - Personnalisation de l'affichage des erreurs de validation ...................................................................... 68
XAML 19 - Personnalisation des rgles de validation des donnes ........................................................................... 73
XAML 20- Proprit jointes ...................................................................................................................................................... 91
XAML 21 - Animation de proprit ....................................................................................................................................... 94
XAML 22 - Databinding sur un champ nomm d'un objet .......................................................................................... 96
XAML 23 - Dfinition d'un UserControl ............................................................................................................................. 101
XAML 24 - Databinding avec StringFormat ..................................................................................................................... 108
XAML 25 - Instanciation d'un objet timer ......................................................................................................................... 125
XAML 26 - Espace de nom local ........................................................................................................................................... 125
XAML 27 - Binding TextBox et objet timer ....................................................................................................................... 125
XAML 28 - Binding avec Trigger de type Explicit ........................................................................................................... 129
XAML 29 - Instanciation d'un convertisseur de valeur ................................................................................................. 139
XAML 30 - Utilisation d'un convertisseur de valeur ...................................................................................................... 140
XAML 31 - Utilisation d'un convertisseur dfini comme Singleton.......................................................................... 144
XAML 32 - Binding simple ...................................................................................................................................................... 163
XAML 33 - Cration d'instances de tout type en ressources locales........................................................................ 164
XAML 34 - Utilisation d'un convertisseur de valeur avec paramtre ...................................................................... 171
XAML 35 - Fixer la culture dans un binding .................................................................................................................... 174
XAML 36 - ContentStringFormat ......................................................................................................................................... 175
XAML 37 - TargetNullValue pour grer les NULL dans un binding avec format ............................................... 176
XAML 38 - Utilisation d'un convertisseur multiples valeurs ................................................................................... 180
XAML 39 - Binding multiples valeurs sans convertisseur de valeur .................................................................... 180
XAML 40 - XmlDataProvider ................................................................................................................................................. 181
XAML 41 - Listbox lie une source XML par XPath .................................................................................................... 181
XAML 42 - ObjectDataProvider ............................................................................................................................................ 184
XAML 43 - Templating et Binding Relatif ......................................................................................................................... 188
-
P a g e 13 | 435
XAML 44 - Binding Relatif ...................................................................................................................................................... 189
XAML 45 - Binding Relatif avec FindAncestor ................................................................................................................. 190
XAML 46 - MultiBinding et Binding Relatif de type PreviousData ........................................................................... 195
XAML 47 - Trigger de DataTemplate .................................................................................................................................. 198
XAML 48 - Template Binding ................................................................................................................................................ 204
XAML 49 - Default binding .................................................................................................................................................... 206
XAML 50 - Priority Binding .................................................................................................................................................... 212
XAML 51 - Mauvais code Xaml ............................................................................................................................................. 218
XAML 52 - StringFormat ......................................................................................................................................................... 218
XAML 53 - StringFormat paramtr ................................................................................................................................... 219
XAML 54 - Exemples de formatage par StringFormat .................................................................................................. 221
XAML 55 - StringFormat et les nombres ........................................................................................................................... 222
XAML 56 - Element Binding ................................................................................................................................................... 229
XAML 57 - Exemple de dfinition de Style dans un dictionnaire de ressources .................................................. 260
XAML 58- Dfinition des DataTemplates de l'exemple ................................................................................................ 316
XAML 59 - Cration de la ressource locale pour le Selector....................................................................................... 318
XAML 60 - Utilisation du TemplateSelector dans une ListView ................................................................................ 318
XAML 61 - Grid, placement simple Capture cran..................................................................................................... 326
XAML 62 - Code Xaml du placement simple dans une Grid ...................................................................................... 327
XAML 63 - Dfinition des colonnes d'une Grid ............................................................................................................... 331
XAML 64 - Taille automatique de colonne d'une Grid - capture cran ................................................................. 332
XAML 65 - Colonnes de Grid en taille automatique ..................................................................................................... 332
XAML 66 - Colonnes de Grid en mode "toile" ............................................................................................................... 333
XAML 67 - Colonnes de Grid en mode proportionnel .................................................................................................. 333
XAML 68 - Colonnes de Grid automatiquement proportionnelles .......................................................................... 333
XAML 69 - Effet visuel de MaxWidth et MawHeight dans les colonnes d'une Grid ........................................... 334
XAML 70 - MaxWidth et MinWidth dans les colonnes d'une Grid ........................................................................... 334
XAML 71 - Mlanger les dfinitions de colonnes dans une Grid .............................................................................. 335
XAML 72 - Importante du mode "auto" dans les dfinitions de colonnes de Grid ............................................. 335
XAML 73 - Placement hors cellules ..................................................................................................................................... 336
XAML 74 - Placement hors cellules via un ColumnSpan ............................................................................................ 336
XAML 75 - Visual State Manager dans Blend .................................................................................................................. 343
XAML 76 - Easin et Easout sous Blend ............................................................................................................................... 344
XAML 77 - Rglage d'une fonction de ease sous Blend ............................................................................................... 345
XAML 78 - Accs au FluidLayout sous Blend ................................................................................................................... 346
XAML 79 - Accder aux LayoutStates ................................................................................................................................. 347
XAML 80 - Les LayoutStates sous Blend, rglages des animations .......................................................................... 348
XAML 81 - Effet des LayoutStates - capture cran......................................................................................................... 349
XAML 82 - Pixel Shaders sous Blend ................................................................................................................................... 350
XAML 83 - Catpure d'une transition par Pixel Shader ................................................................................................. 351
XAML 84 - Capture FluidMoveBehavior ............................................................................................................................ 352
XAML 85 - Rglage du FluidMoveBehavior ...................................................................................................................... 353
XAML 86 - Les animations du FluidMoveBehavior ........................................................................................................ 354
XAML 87 - Effet d'un FluidMoveBehavior ......................................................................................................................... 355
XAML 88 - Correction du cadrage des items templats .............................................................................................. 362
-
P a g e 14 | 435
XAML 89 - Dfinition d'une couleur 24 bit RGB ............................................................................................................. 380
XAML 90 - Dfinition d'une couleur 32 bit ARGB .......................................................................................................... 380
XAML 91 - Notation d'une couleur en scRGB .................................................................................................................. 381
XAML 92 - couleurs nommes .............................................................................................................................................. 381
XAML 93 - Schma de la chane graphique XAML ........................................................................................................ 384
XAML 94 - Insertion d'un saut de ligne dans une proprit Content...................................................................... 388
XAML 95 - Dfinition d'un style pour la classe Button................................................................................................. 395
XAML 96 - Dfinition d'un style "based on" pour la classe Button .......................................................................... 396
XAML 97 - Autre dfinition de style utilisant "based on" ............................................................................................ 396
XAML 98 - Utilisation du FocusManager........................................................................................................................... 424
Table des exemples de Code
Code 1 - Tooltip ............................................................................................................................................................................ 28
Code 2 - Initialisation d'un DataContext ............................................................................................................................ 30
Code 3 - ValidationRule ............................................................................................................................................................ 72
Code 4 - Proprit attache ..................................................................................................................................................... 89
Code 5 - Dfinition d'une proprit de dpendance ..................................................................................................... 102
Code 6 - Proprit CLR sur proprit de dpendance .................................................................................................. 103
Code 7 - Gestion du changement de valeur d'une proprit de dpendance ..................................................... 104
Code 8 - Callback de validation sur proprit de dpendance ................................................................................. 104
Code 9 - Lancement d'une animation ............................................................................................................................... 110
Code 10 - Dclaration d'une proprit jointe .................................................................................................................. 111
Code 11 - Dclarations internes du framework pour les proprits jointes ......................................................... 112
Code 12 - Hritage de valeur d'une proprit de dpendance ................................................................................. 113
Code 13 - Dfinition d'un objet timer ................................................................................................................................ 124
Code 14 - Mise jour d'une proprit binde en Explicit ........................................................................................... 129
Code 15 - Exemple de convertisseur de valeur ............................................................................................................... 138
Code 16 - Cration d'un point d'accs global tous les convertisseurs ................................................................ 142
Code 17 - Accs un convertisseur de valeur global ................................................................................................... 142
Code 18 - Dfinition d'un convertisseur de valeur sous la forme dun Singleton .............................................. 143
Code 19 - Configuration d'une trace de dbogue WPF ............................................................................................... 150
Code 20 - Faux convertisseur de valeur pour aider au dbogue d'un binding ................................................... 152
Code 21 - Dfinition d'une classe de test simple ........................................................................................................... 154
Code 22 - Faux Mvvm avec DataContext sur this .......................................................................................................... 155
Code 23 - Initialisation d'une liste d'objets de test ........................................................................................................ 155
Code 24 - Dfinition d'un binding erron ......................................................................................................................... 159
Code 25 - Convertisseur de valeur Double vers Int ....................................................................................................... 168
Code 26 - Convertisseur de valeur avec paramtre ...................................................................................................... 170
Code 27 - Correction gnrique de l'erreur de localisation du framework .NET ................................................ 173
Code 28 - Dfinition d'une classe de test exposant 2 proprits .............................................................................. 178
Code 29 - Dfinition d'un convertisseur de valeurs multiples ................................................................................... 179
Code 30 - Source de donnes via LINQ to XML .............................................................................................................. 185
Code 31 - Source de donnes de test alatoire............................................................................................................... 194
-
P a g e 15 | 435
Code 32 - Multi convertisseur avec diffrentiel de donnes ....................................................................................... 197
Code 33 - Mettre en vidence les proprits de binding ............................................................................................. 212
Code 34 - Correction du problme de localisation ........................................................................................................ 220
Code 35 - Un code correct mais pas utile ......................................................................................................................... 226
Code 36 - Une proprit CLR avec contrle des valeurs ............................................................................................. 231
Code 37 - Dfinition dune proprit de dpendance .................................................................................................. 234
Code 38 - TemplateVisualState ............................................................................................................................................ 255
Code 39 - TemplatePart .......................................................................................................................................................... 256
Code 40 - OnApplyTemplate ................................................................................................................................................. 258
Code 41 - Une proprit de dpendance .......................................................................................................................... 270
Code 42 - Mthode de navigation du UserControl ....................................................................................................... 272
Code 43 - Binding par code ................................................................................................................................................... 278
Code 44 - RotateBehavior ...................................................................................................................................................... 286
Code 45 - Utilisation de l'attribut CustomPropertyValueEditor ............................................................................... 295
Code 46 - Utilisation du convertisseur de valeur avec paramtre ........................................................................... 302
Code 47 - Code du convertisseur de valeur ..................................................................................................................... 303
Code 48 - Sticky Note, capture ............................................................................................................................................. 306
Code 49 - Le code du DataTemplate Selector ................................................................................................................. 317
Code 50 - Simulation d'un DataTemplateSelector ........................................................................................................ 320
Code 51 - Crer des lments XAML par leur nom de classe .................................................................................... 369
Code 52 - Placer un lment sur un cercle ...................................................................................................................... 393
Code 53 - Extrait du code de SynchedSoundPlayer ...................................................................................................... 411
Code 54 - Code du KeyLogger .............................................................................................................................................. 419
Code 55 - Dtection des touches "modificateurs" .......................................................................................................... 421
Code 56 - Exemple d'excution de PrettyXML ................................................................................................................. 422
Code 57 - Prise de Focus par code ...................................................................................................................................... 423
Code 58 - Ecoute de "OnLoaded" ........................................................................................................................................ 424
-
P a g e 16 | 435
Prsentation du Tome 7 - XAML
Bien quissu principalement des billets et articles crits sur Dot.Blog au fil du temps, le
contenu de ce PDF a entirement t ractualis et rorganis lors de la cration du
prsent livre lautomne 2013. Il sagit dune version indite corrige et jour qui
tient compte des volutions les plus rcentes autour de XAML, apparition et fin de
Silverlight, naissance de WinRT, continuit de WPF, variations entre Windows Phone 7
et Windows Phone 8. Bien que largement inspir des billets de Dot.Blog le prsent
Tome est celui qui a demand le plus de travail la fois par sa taille et par la
rorganisation des thmes, la rcriture et la mise en conformit des informations
pour en faire non pas un recueil de textes morts mais bien un nouveau livre
totalement dactualit ! Un norme bonus par rapport au site Dot.Blog ! Plus dun
mois et demi de travail a t consacr la ractualisation du contenu. Corrections du
texte mais aussi des graphiques, des pourcentages des parts de march voques le
cas chant, contrle des liens, et mme ajouts plus ou moins longs, cest une
vritable dition spciale diffrente des textes originaux toujours prsents dans le
Blog !
Cest donc bien plus quun travail de collection - dj long - des billets qui vous est
propos ici, cest un vrai nouveau livre sur XAML qui offre une vision jour sa date
de parution. Mieux, aucun livre franais ni mme amricain ne traite de XAML sous un
tel angle. Ce livre contient parfois dautres mini livres, comme celui sur le Binding
XAML. Aucun texte existant nest all si loin sur un tel sujet ma connaissance et ce
nest quun exemple parmi prs de 440 pages A4 et 113 000 mots ! Le standard est
denviron 250 mots par pages pour un livre. Cest bien un livre gratuit denviron 452
pages sans les illustrations (et elles sont nombreuses) qui vous est offert (donc plus
proche de 500 pages) ! On considre quun roman comporte 40.000 mots, le prsent
livre quivaut ainsi prresque 3 romans Et ce nest quun Tome parmi la dizaine
publie dans la srie ALL DOT BLOG !
Astuce : cliquez les titres pour aller lire sur Dot.Blog larticle original et ses
commentaires, vous pourrez dailleurs vous amuser comparer les textes et prendre la
mesure des modifications ! Tous les autres liens Web de ce PDF sont fonctionnels,
nhsitez pas les utiliser (certains sont cachs, noms de classe du Framework par
exemple, mais ils sont fonctionnels, promenez votre souris).
-
P a g e 17 | 435
XAML
eXtensible Application Markup Language
Prononcer Zammel
XAML est un langage de description de mise en page utilisant un formalisme XML.
Les balises indiquent les instances de classes crer, les attributs fixant les
paramtres de ces instances. XAML se lit de haut en bas, quand une balise en
contient une autre la
premire est le
parent visuel de
linstance cre par la
seconde.
XAML a t cr pour
le framework de
cration
dapplications dites
riches WinFX qui deviendra officiellement .NET 3.0 associ WPF lors de la sortie
de Windows Vista.
Cet OS mal aim en raison de son exprience utilisateur assez lourde a fait quelque
peu capoter lentre en scne triomphale de WPF et XAML, avance pourtant
extraordinaire puisque XAML est un systme de description dUI entirement
vectoriel en 2D et 3D grant le data Binding et particulirement bien taill pour faire
face au dfi la fois des nouvelles interfaces, de limportance de lUX et du
support de tous les form-factors (le vectoriel tant sur ce point larme absolue).
Le dsamour de Vista a terni ce qui aurait d tre un raz-de-mare tellement XAML
et WPF associs .NET btissent une plateforme puissante pour dvelopper des
logiciels modernes. Cela tait vrai en 2006 la sortie de WPF 3.0 et cela reste vrai
avec WPF 4.5 sorti en 2012 tel point que XAML lui-mme est aujourdhui intgr
lOS au sein de WinRT sous Windows 8.x et suivants. Il se glisse mme au cur de
Windows Phone. Une nouvelle version de WPF serait en prparation dailleurs.
WPF/E, comprendre WPF Everywhere - cest--dire WPF Partout sera plus connu
sous le nom de Silverlight. Version allge de WPF, Silverlight utilise le principe dun
plugin pour browser Internet qui offre une portabilit transparente du mme code
-
P a g e 18 | 435
sous PC et Mac. Les normes avantages de Silverlight sur HTML font que sa
popularit deviendra vite suprieure WPF regard avec un peu de mfiance
lpoque par beaucoup de DSI qui ne comprenaient pas alors le changement de
paradigme quannonait XAML pour les applications, mme de bureau. En revanche
la mode de Flash sur le Web rendra plus vidente ladoption de Silverlight au sein des
mmes entreprises pour leurs Intra ou Extra Net.
Hlas Silverlight ne rsistera pas la fois la haine de Jobs ct Apple pour Flash et
les plugins de ce type, et celle de C#/XAML par Sinofsky ct Microsoft. HTML 5 ny
est pour rien dans tout a, car au moment o lui aussi croyait devenir universel ce
sont les units mobiles qui ont boulevers le march rendant les applications natives
les vraies reines de ce nouveau monde conqurir. Silverlight aurait pu tre la
technologie de ce dernier, Microsoft a dcid de la garder pour Windows Phone
uniquement.
En disparaissant Silverlight laisse un grand vide car aucune technologie vectorielle de
ce niveau nest disponible pour le Web. Toutefois il aura particip rendre plus
populaire XAML.
La fin de Silverlight en tant que plugin universel a nanmoins laiss XAML se
rpandre sur Windows Phone et sur WinRT o il est le meilleur choix pour crer des
applications sophistiques.
Mieux, la fin de Silverlight pourrait bien marquer le retour de WPF !
Car si Windows Phone et WinRT utilisent XAML, il sagit de plateformes dont le parc
est encore trs restreint ce jour. Pour balayer large il nexiste que WPF.
Car WPF est la seule plateforme moderne permettant de dvelopper des logiciels
sans contrainte, sans les taxes du Windows Store et surtout pouvant fonctionner sur
quasiment 100% du parc Windows.
Seul WPF peut couvrir les 31 % de Windows XP + les 4 % de Vista + les 47 % de
Windows 7 + les 9 % de Windows 8.x, soit 91 % du parc Windows fin 2013.
Cela cre une situation bien particulire, Microsoft dun ct axant toute sa
communication sur un OS qui pse moins de 10 % du parc plus dun an aprs sa
sortie, de lautre des entreprises et des utilisateurs ayant des besoins rels en total
dconnexion technique avec WinRT.
-
P a g e 19 | 435
On comprend alors la frilosit des dcideurs face un OS qui a du mal convaincre,
mme sur tablette ou smartphone, mis en place par un directeur qui a t mis la
porte (Sinofsky) sous les offices dun PDG (Ballmer) qui lui-mme a t pouss vers la
sortie mais qui est toujours l (jusquen aot 2014 au maximum)
Quels seront les dcisions du prochain PDG de Microsoft ? Quelles ruptures comme
celle de Silverlight ou de Windows Phone 7 devront-elles tre subies ? Personne nen
sait rien du tout. Et le doute engendre la peur lgitime de se tromper. Et cette
dernire engendre limmobilisme.
Pendant ce temps (perdu en choix discutables et en luttes intestines chez Microsoft)
Android a pris 80% du march des units mobiles, mais cest une autre
histoire (mme si elle nous oblige penser le dveloppement en cross-plateforme,
voir le Tome 5 de ALL DOT BLOG) !
La seule certitude qui merge de tout cela est que sous environnement Microsoft
XAML et C# restent des valeurs sres pour couvrir 100% du p