Dot.Blog

C#, XAML, Xamarin, UWP/Android/iOS

XAML Power Toys mis à jour pour WPF .NET 3.5 SP1 et Silverlight 2 !

Les XAML Power Toys sont des petits outils bien pratiques qui s'intègrent à Visual Studio 2008, leur mission : générer du code XAML pour des tas de situations et ainsi simplifier le codage.

Laissons l'auteur des XAML Power Toys dire à quoi ils servent :

"L'objectif principal de XAML Power Toys est de fournir des outils qui permettent aux développeurs de rapidement mettre en page et maintenir des formulaires de type business en utilisant les contrôles d'I.U. livrés avec Visual Studio."
(The primary goal of XAML Power Toys is to deliver tools that enable developers to quickly layout and maintain Line of Business Application forms using the UI controls that ship with Visual Studio.)
Bon, c'est pas forcément plus clair dit comme ça... Alors le mieux, vous savez quoi ? ... et bien c'est d'aller sur le site de ce bon Karl et de regarder les captures d'écran et les exemples qu'il y commente !
XAML Power Toys est en tout cas un add-in à posséder, il rend vraiment service lorsqu'on travaille sous VS. On préfèrera certainement l'aspect visuel de Expression Blend pour modifier du XAML mais lorsqu'on développe une application WPF ou Silverlight on a de toute façon VS et Blend ouverts en même temps, l'un pour le visuel, l'autre pour le code C# et quand on est sous VS, il est parfois plus rapide de modifier le code XAML "à la main" pour certaines choses que de switcher sur Blend. Donc même quand on travaille avec les deux EDI à la fois, ces petits "jouets puissants" (Power Toys !) sont des aides à ne pas négliger !
Bon XAML
... Et Stay Tuned !

Silverlight 2 Final est enfin là (sous-titré : Youpi!)

Bon, on l'attendait, on mitonnait des petites pages avec la beta 2, on rongeait notre frein, et on attendait... Mais voilà ça y est, enfin un vrai concurrent pour Flash est né : Silverlight 2.0 finale est enfin releasée !

Silverlight 2.0 c'est tout Silverlight 1.0 avec un petit plus qui tranforme un joujou sympa en une vraie bombe : SL 2 embarque un mini framework .NET et peut donc être programmé en C# et non en Javascript (beurk!) qui est à la programmation ce que les plats congelés sont à la gastronomie.

Si SL 1.0 était du même tonneau que Flash ou Flex avec leur ActionScript (enfant adultérin de JavaScript et d'un Basic des années 70), SL 2.0 relève le débat en proposant un plugin portable (PC/Mac) multi-browser (FireFox, IE, Safari..) doté d'un vrai langage de programmation et d'une vraie plateforme de développement. Adobe a un grand savoir-faire en matière de graphisme mais pour les outils de développement et les langages ils n'ont jamais réussi a dépasser le niveau des macros de Excel, - et encore c'est très puissant les macros de Excel !

Microsoft n'a, de ce côté là, aucun souci à se faire, ils disposent aujourd'hui de l'une des plus belles et plus cohérentes plateformes jamais créées (.NET) servie par des outils de luxe comme Visual Studio 2008, SQL Server 2008, la suite Expression, etc..., le tout piloté par C# 3.0 dont on ne fait plus l'apologie.

Il reste néanmoins que MS n'a pas vraiment encore l'expérience d'un Adobe en ce qui concerne le graphisme. Rome ne s'est pas faite en un jour. Il serait mentir qu'affirmer que SL 2 est aussi bien doté que Flash ou Flex à ce niveau. Potentiellement oui bien sûr, dans la pratique pas tout à fait. Par exemple SL 2 ne sait pas appliquer d'effets aux images, il faut "pré traiter" les images sous un autre logiciel (Design ou ... Photoshop) et exporter un PNG, juste pour faire un drop shadow par exemple c'est pas encore le top, il faut l'avouer.
[EDIT]Il faut malgré tout ajouter que Microsoft travaille sur un Pack de composants additionnels pour Silverlight, pack qui devrait compter à termes environ 100 contrôles supplémentaires, et, cerise sur le gateau, ce pack sera mis en ligne via CodePlex avec tout son code source ! Il ne faut pas oublier non plus que SL 2 ajoute à SL 1 des contrôles de base indispensables comme la Datagrid. SL 2 est, de par le fait, la vraie version 1 utilisable sérieusement de Silverlight[/EDIT]

Mais tout cela sera de l'ordre du souvenir d'ici quelques versions cela ne fait aucun doute. Et ne termissons pas ce jour de joie, on peut dès maintenant créer des applications graphiquement alléchantes avec SL 2 (dont la force est le vectoriel plus que le bitmap précisons-le), il suffit d'avoir un bon graphiste sous la main, le look c'est une question d'art bien plus que d'outil...

Il n'en reste pas moins vrai que le jour est historique car Silverlight 2 est une solution intelligente, puissante et crédible qui offre enfin une alternative à la domination de Adobe sur ce créneau et qui permet d'échapper aux usines à gaz de type Ajax ou Javascript juste pour avoir quelque chose de moins laid qu'une page HTML de base !

Longue vie à Silverlight !

L'annonce officielle pour les anglophones : http://www.microsoft.com/presspass/press/2008/oct08/10-13Silverlight2PR.mspx

[EDIT]Le site web pour télécharger tout ce qu'il faut pour développer est là, sur la page Get Started du site officiel de Silverlight, faites chauffer vos connexions ![/EDIT]

Bon Web tout animé et haut en couleurs avec SL 2 et Stay Tuned !

 

Upgrade du site blog

Je viens d'upgrader le blog qui fonctionne sous BlogEngine. Forcément cela ne se fait pas sans qu'il n'y ait quelques retouches à faire de ci de là...

Je m'excuse donc d'avance auprès des lecteurs qui pourraient connaître des petites perturbations de service durant les interventions de maintenance du site à venir.

Bonne lecture et Stay Tuned !

Améliorer le debug sous VS avec les proxy de classes

Visual Studio est certainelement l'IDE le plus complet qu'on puisse rêver et au-delà de tout ce qu'il offre "out of the box" il est possible de lui ajouter de nombreux add-ins (gratuits ou payants) permettant de l'adapter encore plus à ses propres besoins. Ainsi vous connaissez certainement les "gros" add-ins comme Resharper dont j'ai parlé ici quelque fois ou GhostDoc qui écrit tout seul la doc des classes. Vous connaissez peut-être les add-ins de debogage permettant d'ajouter vos propres visualisateurs personnalisés pour le debug. Mais vous êtes certainement moins nombreux à connaître les proxy de classes pour le debug (Debugger Type Proxy).

A quoi cela sert-il ?

Tout d'abord cela n'a d'intérêt qu'en mode debug. Vous savez que lorsque vous placez un point d'arrêt dans votre code le debugger de VS vous permet d'inspecter le contenu des variables. C'est la base même d'un bon debugger.

La classe à deboguer 

Supposons la classe Company suivante décrivant une société stockée dans notre application. On y trouve trois propriétés, le nom de la société Company, l'ID de la société dans la base de données et la date de dernière facturation LastInvoice :

public class Customer
        {
            private string company;
            public string Company
            {
                get { return company; }
                set { company = value; }
            }
 
            private int id;
            public int ID
            {
                get { return id; }
                set { id = value; }
            }
 
            private DateTime lastInvoice;
            public DateTime LastInvoice
            {
                get { return lastInvoice; }
                set { lastInvoice = value; }
            }
        }

 

Le debug "de base" 

Supposons maintenant que nous placions un point d'arrêt dans notre application pour examiner le contenu d'une variable de type Customer, voici que nous verrons :

Le debugger affiche toutes les valeurs connues pour cette classe, les propriétés publiques comme les champs privés. Il n'y a que 3 propriétés et 3 champs dans notre classe, imaginez le fatras lorsqu'on affiche le contenu d'une instance créée depuis une classe plus riche ! Surtout qu'ici, pour tester notre application, ce dont nous avons besoin immédiatement ce sont juste deux informations claires : le nom et l'ID de la société et surtout le nombre de jours écoulés depuis la dernière facture. Retrouver l'info parmi toutes celles affichées, voire faire un calcul à la main pour celle qui nous manque, c'est transformer une session de debug qui s'annonçait plutôt bien en un véritable parcours du combattant chez les forces spéciales !

Hélas, dans la classe Customer ces informations sont soit éparpillées (nom de société et ID) soit inexistantes (ancienneté en jours de la dernière facture).

Il existe bien entendu la possibilité de créer un visualisateur personnalisé pour la classe Customer et de l'installer dans les plug-ins de Visual Studio. C'est une démarche simple mais elle réclame de créer une DLL et de la déployer sur la machine. Cette solution est parfaite en de nombreuses occasions et elle possède de gros avantages (réutilisation, facilement distribuable à plusieurs développeurs, possibilité de créer un "fiche" complète pour afficher l'information etc).

Mais il existe une autre voie, encore plus simple et plus directe : les proxy de types pour le debugger.

Un proxy de type pour simplifier

A ce stade du debug de notre application nous avons vraiment besoin du nombre de jours écoulés depuis la dernière facture et d'un moyen simple de voir immédiatement l'identification de la société. Nous ne voulons pas créer un visualisateur personnaliser, mais nous voulons tout de même une visualisation personnalisée...

Regardons le code de la classe suivante :

public class CustomerProxy
        {
            private Customer cust;
 
            public CustomerProxy(Customer cust)
            {
                this.cust = cust;
            }
 
            public string FullID
            {
                get { return cust.Company + " (" + cust.ID + ")"; }
            }
 
            public int DaysSinceLastInvoice
            {
                get { return (int) (DateTime.Now - cust.LastInvoice).TotalDays; }
            }
        }

 

la classe CustomerProxy est très (très) simple : elle possède un constructeur prenant en paramètre une instance de la classe Customer puis elle expose deux propriétés en read only : FullID qui retourne le nom de la société suivi de son ID entre parenthèses, et le nombre de jours écoulés depuis la dernière facture.

Nota: Ce code de démo ne contient aucun test... dans la réalité vous y ajouterez des tests sur null pour éviter les exceptions si l'instance passée est nulle, bien entendu.

Vous allez me dire, c'est très joli, ça fait une classe de plus dans mon code, et comment je m'en sers ? je ne vais pas modifier tout mon code pour créer des instances de cette classe cela serait délirant !

Vous avez parfaitement raison, nous n'allons pas créer d'instance de cette classe, nous n'allons pas même modifier le code de l'application en cours de debug (ce qui serait une grave erreur... modifier ce qu'on test fait perdre tout intérêt au test). Non, nous allons simplement indiquer au framework .NET qu'il utilise notre proxy lorsque VS passe en debug... Un attribut à ajouter à la classe originale Customer, c'est tout :

#if (DEBUG)
        [System.Diagnostics.DebuggerTypeProxy(typeof(CustomerProxy))]
#endif
        public class Customer
        {
            //...
        }

Vous remarquerez que pour faire plus "propre" j'ai entouré la déclaration de l'attribut dans un #if DEBUG, cela n'est absolument pas obligatoire, j'ai fait la même chose autour du code de la classe proxy. De ce fait ce code ne sera pas introduit dans l'application en mode Release. Je vous conseille cette approche malgré tout.

Et c'est fini !

Le proxy en marche

Désormais, lorsque nous sommes en debug que nous voulons voir le contenu d'une instance de la classe Customer voici ce que Visual Studio nous affiche :

 

Vous remarquez immédiatement que le contenu de l'instance de la classe Customer n'est plus affiché directement mais en place et lieu nous voyons les deux seules propriétés "artificielles" qui nous intéressent : le nom de société avec son ID, et le nombre de jours écoulés depuis la dernière facture. Fantastique non ? !

"Et si je veux voir le contenu de Customer malgré tout ?" ... Je m'attendais à cette question... Regardez sur l'image ci-dessus, oui, là, le petit "plus" dans un carré, "Raw View"... Cliquez sur le plus et vous aurez accès au même affichage de l'instance de Customer qu'en début d'article (sans le proxy) :

 

Conclusion

Si ça c'est pas de la productivité et de la customisation aux petits oignons alors je suis à court d'arguments ! :-)

Bon debug !

... Et Stay Tuned !

le projet de test : DebugProxy.zip (5,55 kb)

Touchless : Microsoft Surface pour tous ! (un SDK open source)

Surface, vous connaissez ? Bien sur... C'est cette table que Microsoft a créée et qui reconnaît les objets qu'on pose dessus, qui permet de manipuler l'interface avec les mains, un doigt, etc... Le parfait objet que tout geek rêve d'avoir dans son salon !

Mais voilà Surface, c'est cher. Et c'est à peine diffusé dans certains casinos ou grandes chaînes d'hôtels aux US. Avant de pouvoir s'en payer une à la maison, il faudra attendre un peu...

Alors pourquoi ne pas se fabriquer sa propre Surface, voire un mur graphique (le principe de Surface se décline en table, en tableau mural et il existe même une version prototype en sphère !) ?

Là, ce n'est plus tant la question du prix mais celle du logiciel de commande et du matériel nécessaire... Pas tout à fait ! En effet, grâce à Touchless vous aussi vous pouvez jouez à faire bouger des objets virtuels au doigt et à l'oeil et pour pas cher !

Touchless est un projet Open Source sur CodePlex qui offre un SDK et une démo de celui-ci. A l'aide d'une simple WebCam (comme celle que vous avez chez vous ou intégrée dans votre portable) il devient possible de manipuler des objets virtuels avec les mains ou plutôt avec des objets réels que vous avez fait reconnaitre à Touchless. Par exemple votre tasse de café peut devenir un feutre : déplacez la en l'air pour écrire sur l'écran. Enregistrez deux objets et vous pouvez jouez à Pong, chacun controlant un pad, ou bien redimensionner une image par les coins opposés comme avec Surface...

Gros délire de geek ? C'est une évidence. Projet d'avenir ? ça ne fait aucun doute non plus.

C'est gratuit, ouvert, créez votre propre "Surface" pour pas un copek grâce à votre WebCam et à Touchless !

Bon Fun !

 

Créer des documents XAML directement depuis Word 2007

XAML, le langage de description graphique de WPF et Silverlight, est un format XML offrant une grande souplesse pour représenter aussi bien des graphismes en 3D que des fenêtres Windows et leur contenu en passant par les animations, les sites Web ou les flux vidéo et j'en oublie des tonnes... Tout comme HTML il est possible de taper les balises à la main. C'est formateur mais peu productif !

Je me rappelle d'une époque où un "vrai" développeur Web, "un dur, un tatoué", se devait de développer tout un site en HTML uniquement avec le bloc-notes, se servir de DreamWeaver ou autres logiciels de mise en page dédié était un truc de fillette ("les durs, les tatoués" utilisent bien entendu d'autres mots qui tombent sous le coup de la censure anti homophobie...). On retrouve ce réflexe de geek autiste avec toute nouvelle technologie et certains aujourd'hui mettent un point d'honneur à faire une application Silverlight ou WPF en tapant tout le XAML à la main... Même si l'aspect formateur de la chose que je soulignai plus haut possède un certain attrait, cette démarche est loin d'être la plus productive. Il existe en effet des logiciels comme Expression Blend ou même VS 2008 qui offre une approche visuelle de XAML, ce qui est le minimum pour une technologie justement basée sur le visuel !

De fait, qu'il s'agisse d'une application Silverlight ou d'une application desktop WPF ou XBap, il arrive souvent qu'on ait du texte à présenter. Et quitte à écrire des tartines à l'écran, autant que cela soit gracieux...

C'est là que ça se complique... Car bien entendu ni Blend ni VS 2008 ne sont des traitements de texte...

On se demande alors s'il n'y aurait pas une façon élégante d'utiliser Word puis de récupérer le document en XAML, bout de code qu'il n'y aurait plus qu'à coller dans son application.

Si, c'est possible ! ((c) Hassan Céhef, Les Nuls).

En utilisant Word 2007 et le plugin Word 2007 XAML Generator dont le code binaire et le code source .NET sont téléchargeables ici.

Ce plugin pour Word 2007 est intéressant à plus d'une titre. Outre sa fonction première qui est bien utile, le code source illustre la façon d'écrire des plugins pour Word 2007 ce qui donnera peut-être des envies à certains d'entre vous !

Partons d'un document Word (on voit l'onglet XAML, non affiché sur cette capture, en fin de ligne de la barre d'outils) :

 

Une fois le plugin installé, en appelant le menu "enregistrer sous" nous trouvons une option "XAML" (je vous fait grâce de la copie d'écran de ce menu). Il n'y a plus qu'à donner un nom de fichier et à valider. Nous voici maintenant en possession d'une fichier XAML qui contient notre document Word sous la forme d'un FlowDocument si on a choisi une exportation WPF ou un TextbBlock pour Silverlight.

Pour visualiser le résultat rapidement je vous conseille l'excellent freeware Kaxaml. La capture ci-dessous montre dans sa partie supérieure le FlowDocument contenant notre document Word "xamelisé" et, dans sa partie inférieure, le code XAML créé par le plugin. Une fois ce dernier copié/collé dans votre application vous aurez l'assurance d'un visuel de grande qualité. Tout d'abord le texte sera contrôlé (orthographe et grammaire de Word) limitant les coquilles (pas comme sur ce blog pour lequel je n'ai pas de correcteur!), mais il disposera aussi d'une mise en page riche avec des styles cohérents. Enfin, sa représentation à l'écran sera conforme à l'idée qu'on se fait d'une texte propre et professionnel affiché par une application de type WPF ou Silverlight.  Que des avantages donc.

 

On notera que le plugin affiche aussi une barre d'outil dans Word 2007 permettant de régler certains paramètres et d'effectuer le choix entre une exportation WPF ou Silverlight (qui utilise un TextBlock au lieu d'un FlowDocument). La fonction de preview qui est aussi disponible dans la barre d'outils est particulièrement appréciable.

Voici le FlowDocument intégré dans une fenêtre WPF:

Savoir faire fonctionner tous les outils ensemble pour produire des applications riches est une grande force, disposer de petits logiciels ou plugins tels que Word 2007 XAML Generator permet de combler le gap entre certains de ces outils, de faire un pont. Un pont c'est bête, parfois juste une petite planche posée au-dessus d'une tranchée de chantier. Mais qu'est-ce que ça change la vie !

Bon Dev

... Et Stay Tuned !