Le contrôle TextBlock

Le TextBlock n'est pas un contrôle en soi, puisqu'il n'hérite pas de la classe Control, mais on l'utilise tout comme n'importe quel autre contrôle du framework WPF, alors nous le considérerons comme un contrôle pour simplifier les choses.

Le contrôle TectBlock est l'un des contrôles les plus fondamentaux en WPF, mais il est très utile. Il vous permet d'afficher du texte à l'écran, de la même façon qu'un contrôle Label, mais d'une manière plus simple et moins gourmande en ressources. De façon générale, le Label est destiné aux textes courts (une seule ligne, mais peuvent inclure une image), alors que le TextBlock fonctionne très bien pour les textes à plusieurs lignes, mais il ne peut contenir que du texte. Le Label et le TextBlock ont chacun leurs propres avantages, alors celui que vous devriez utiliser dépend beaucoup de la situation.

Nous avons déjà utilisé un TextBlock dans l'article "Hello, WPF!", mais pour le moment, étudions le TextBlock sous sa forme la plus simple :

<Window x:Class="WpfTutorialSamples.Basic_controls.TextBlockSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TextBlockSample" Height="100" Width="200">
    <Grid>
		<TextBlock>This is a TextBlock</TextBlock>
    </Grid>
</Window>

C'est aussi simple que ça, et si vous avez lu les chapitres précédents de ce tutoriel, il ne devrait rien y avoir de nouveau ici. Le texte entre les balises du TextBlock est simplement un raccourci pour renseigner la propriété Text du TextBlock.

Pour l'exemple suivant, essayons avec un texte plus long pour montrer comment le TextBlock le gère. J'ai aussi ajouté une petite marge, pour que ce soit plus joli :

<Window x:Class="WpfTutorialSamples.Basic_controls.TextBlockSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TextBlockSample" Height="100" Width="200">
    <Grid>
		<TextBlock Margin="10">This is a TextBlock control and it comes with a very long text</TextBlock>
    </Grid>
</Window>

Gérer les long textes

Comme vous le réaliserez sous peu en voyant l'image, le TextBlock est tout à fait capable de gérer les textes longs à plusieurs lignes, mais il ne fera rien du tout par défaut. Dans ce cas le texte est trop long pour être affiché dans la fenêtre, alors WPF affiche autant de texte qu'il peut puis s'arrête.

Heureusement, il existe plusieurs façons de gérer cela. Dans l'exemple suivant, je vais toutes vous les montrer, puis je les expliquerai une à une.

<Window x:Class="WpfTutorialSamples.Basic_controls.TextBlockSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TextBlockSample" Height="200" Width="250">
    <StackPanel>
		<TextBlock Margin="10" Foreground="Red">
			This is a TextBlock control<LineBreak />
			with multiple lines of text.
		</TextBlock>
		<TextBlock Margin="10" TextTrimming="CharacterEllipsis" Foreground="Green">
			This is a TextBlock control with text that may not be rendered completely, which will be indicated with an ellipsis.
		</TextBlock>
		<TextBlock Margin="10" TextWrapping="Wrap" Foreground="Blue">
			This is a TextBlock control with automatically wrapped text, using the TextWrapping property.
		</TextBlock>
	</StackPanel>
</Window>

Donc, nous avons trois contrôles TextBlock, chacun ayant une couleur différente (grâce à la propriété Foreground) pour une meilleure vue d'ensemble. Ils gèrent tous le fait que leur texte est trop long de manières différentes :

Le TextBlock rouge utilise un LineBreak (retour à la ligne) pour retourner manuellement à la ligne à un point donné. Cela vous donne un contrôle absolu sur l'endroit où vous voulez que le texte retourne à la ligne, mais ce n'est pas très flexible dans la plupart des cas. Si l'utilisateur agrandit la fenêtre, le texte reviendra à la ligne aux mêmes endroits, même s'il y a désormais la place de mettre tout le texte sur une seule ligne.

Le TextBlock vert utilise la propriété TextTrimming avec la valeur CharacterEllipsis pour que le texte affiche des points de suspension (...) lorsqu'il ne peut plus afficher de texte supplémentaire dans le contrôle. C'est une manière courante d'indiquer qu'il y a encore du texte mais plus assez de place pour l'afficher. C'est pratique si vous avez du texte qui pourrait être trop long mais que vous ne voulez surtout pas qu'il utilise plus d'une seule ligne. Alternativement à CharacterEllipsis, vous pouvez utiliser WordEllipsis, qui coupera le texte à la fin du dernier mot possible plutôt qu'à la fin de la dernière lettre possible, pour éviter qu'un mot ne soit montré que partiellement.

Le TextBlock bleu utilise la propriété TextWrapping avec la valeur Wrap, pour que le TextBlock fasse un retour à la ligne quand il ne peut plus ajouter de texte sur la ligne courante. Contrairement au premier TextBlock, où nous avions défini manuellement où arrêter le texte, cela est complétement automatique, et encore mieux : c'est aussi automatiquement ajusté lorsque l'espace disponible pour le TextBlock varie. Essayez d'agrandir ou de rétrécir la fenêtre de l'exemple et vous verrez comment l'affichage du texte s'adapte à la situation.

C'est tout concernant la gestion de textes simples dans le TextBlock. Dans le chapitre suivant, nous verrons des fonctionnalités plus avancées du TextBlock, qui nous permettront de créer du texte aux styles variés au sein d'un TextBlock et plus encore.