Les nouveautés dans la personnalisation du texte en WPF

23. October 2010 by Regis.NIOX

I- Introduction

          Dans les nombreuses nouveautés du WPF, nous retrouvons une série d’améliorations visuelles ainsi que diverses possibilités de configurations.

Nous verrons qu’elles sont ces améliorations en détails et comment les configurer ou les personnaliser.

Nous commencerons par le mode ClearTypeHint pour l’aspect visuel puis nous verrons les autres nouveautés en ce qui concerne l’amélioration de l’affichage du texte.

 

II- Le mode ClearTypeHint

          Le mode ClearTypeHint permet de lisser les polices et de permettre ainsi un affichage plus net. Nous avons donc la possibilité d’activer ce mode afin d’améliorer la qualité visuelle du texte.

Pour cela nous n’avons besoin que d’activer la propriété « RenderOptions.ClearTypeHint » correctement.

La classe « RenderOptions » nous permettra de contrôler le rendu du ou des objets :

clip_image001

clip_image003

 

III- Le bindable Run

          Dans le WPF 4, un « Run » pourra être binder afin d’éviter certains dysfonctionnements tel qu’un décalage d’une partie d’un texte, ou encore l’apparition d’espaces non voulus.

Un « Run » est un contrôle qui possède les mêmes caractéristiques qu’un « TextBlock » (mais qui ne peut pas être positionné). Pour ce faire nous l’imbriquerons donc dans un « TextBlock ».

Ce contrôle permet grâce à la propriété « Text » de spécifier le texte à afficher.

clip_image005

 

clip_image006

 

IV-Le mode TextFormating

          Le mode « TextFormating » améliore l’affichage des petites polices de caractères. Il est rattahcé à la propriété « textOptions » (il s’agit d’une classe qui permet de contrôler le comportement du rendu texte grâce à une série d’options).

Nous avons le choix entre deux propriétés pour ce mode :

· Ideal : il s’agit du rendu texte par défaut.

· Display : il s’agit du mode qui permet d’améliorer la qualité de l’affichage du texte (le texte sera plus propre une fois affiché)

clip_image007

 

clip_image009

 

V- SelectionBrush et SelectionOpacity

          Les propriétés « SelectionBrush » et « SelectionOpacity » peuvent être utilisées pour des TextBox, Rich TextBox, FlowDocumentPageViewer, FlowDocumentScrollViewer, FlowDocumentReader et PasswordBox.

La propriété SelectionBrush sert à définir la couleur du surlignement du texte. Nous pourrons également changer, si nous le désirons, le gradient du surlignage.

La propriété SelectionOpacity sert simplement à définir l’opacité du surlignage. En ce qui concerne l’étalonnage de l’opacité, avec une opacité de 1 nous ne verrons plus le texte.

· SelectionBrush :

clip_image010

clip_image011

· SelectionOpacity :

clip_image013

clip_image014

 

VI-Le CaretBrush

          Le CaretBrush est une propriété qui permet de changer la couleur du curseur d’insertion (la tickbar qui est par défaut noire). Cette propriété peut être utilisée sur une « TextBox », « RichTextBox », et une « PasswordBox » :

clip_image015

clip_image016

 

VII-Conclusion

          Ces petites nouveautés en ce qui concerne l’affichage peuvent s’avérer très utile lorsque nous avons besoin de manipuler du texte. Cela permet d’éviter certains dysfonctionnements d’affichage.

Ainsi, avec le WPF 4, nous pouvons maintenant aussi personnaliser certains petits détails tels que la tickbar ou encore la couleur ou même l’opacité d’un sur lignage, afin de personnaliser au maximum notre

application.

WPF, Visual Studio 2010

Comment imprimer une application en Silverlight ?

3. September 2010 by Regis.NIOX

 

     Comme prévu, dans les nombreuses nouveautés de Silverlight 4, nous retrouvons le support de l’impression. Cette fonctionnalité, qui n’était pas présente avant, est tout de même importante pour des applications métiers et souvent incontournable pour un client, qui a souvent besoin d’imprimer des rapports, graphiques ou même encore des plannings. Cette option indispensable est assez simple à implémenter. Nous verrons comment imprimer tout l’écran, puis comment définir la zone à imprimer. Tout ceci se fera grâce à la classe « PrintDocument » qui nous permettra d’ouvrir notre boîte de dialogue et d’imprimer.

Tout d’abord pour commencer, voici un aperçu de notre application de test :

     - Une Grid contenant notre bouton, notre StackPanel.

     - Deux images, contenues dans le StackPanel.

     - Un bouton « Imprimer » pour lancer l’impression.

image

 

Comment imprimer l’application ?

Pour commencer n’oubliez pas d’indiquer l’espace nom adéquat : « System.Windows.Printing».

Voici le code XAML de notre application :

Capture

En ce qui concerne notre code behind, nous devrons dans le « MainPage » nous abonner à l’évènement « PrintPage » (pour définir ce que nous voulons imprimer) :

Capture1

     Pour l’évènement « PrintPage », nous définissons la zone à imprimer (ici l’ensemble de notre application) et le nombre de pages à imprimer. En mettant « e.HasMorePages » à « false » nous indiquons à notre application qu’il n’y a pas de pages en plus à imprimer. Si nous attribuons à cette propriété la valeur « true », l’évènement « PrintPage » se reproduira jusqu’à ce que « HasMorePages » passe à « false ».

     En ce qui concerne le bouton, vous n’avez plus qu’à appeler la méthode « Print » pour lancer l’impression et définir en même temps le nom de votre document (pour tester l’impression vous pouvez utiliser  « PDFCreator » ou d’autre logiciel similaire).

image

 

 

 

 

 

     Comme vous le voyez la zone que nous avons définie pour l’impression est l’application entière (c’est pourquoi ces horribles couleurs étaient là depuis le début). Cela nous a donc imprimé notre « Grid » entière contenant le « StackPanel », le bouton et nos images.

 

Comment personnaliser notre impression ?

     Affiner notre impression est tout aussi simple : il suffit juste de changer la zone à imprimer. Si nous voulons imprimer nos images, nous n’aurons qu’à changer la valeur de « e.PageVisual ».

Capture2

Ainsi nous aurons juste nos images d’imprimées et sans le bouton « Imprimer ». La couleur saumon du StackPanel est là pour montrer que le fond est tout de même imprimé. Il suffira de définir la couleur du fond à blanc pour n’avoir que nos images sur une feuille blanche.

image

Dans le cas où nous ne voulons pas garder la disposition de l’écran, il nous suffira juste de créer plusieurs « UIElement » dans l’évènement « PrintPage » et de renseigner à la propriété « PageVisual » le nom de notre « UIElement » racine.

Ainsi dans notre cas, les images seront aligner comme nous le souhaitons, et nous n’aurons plus nos fond apparent ainsi que notre bouton.

Capture3

image

Et voici le résultat : nos images correctement placées sans fond coloré et avec un titre. Si notre contenu est trop grand pour être correctement placé dans la « PrintableArea », il sera découpé (ce qui est le cas plus haut).

Nous avons également à notre disposition l’évènement « BeginPrint » qui nous permet de mettre en place d’autres tâches à effectuer avant d’imprimer (ouverture d’une fenêtre pour faire patienter ou visualiser l’envoi du document à l’imprimante). Avec l’évènement « EndPrint » vous pourrez mettre en place d’autres tâches une fois que l’impression sera terminée (comme par exemple envoyer un signal si l’imprimante n’a plus de papier).

 

Conclusion

     L’apparition de cette fonctionnalité avec la sortie de Silverlight 4 nous permet de rendre les applications Silverlight plus accessible pour les clients. En effet beaucoup d’entre eux trouvaient cette fonctionnalité indispensable.

     Même s’il semble facile et rapide de rendre une application Silverlight imprimable, cette fonctionnalité n’en reste pas moins importante de par son utilisation. Comme dit précédemment, pouvoir imprimer son application reste un argument de poids face à un client.

Silverlight, Visual Studio 2010