Bloc de texte enrichiRich text block

Les blocs de texte enrichi fournissent plusieurs fonctionnalités de disposition de texte avancée, que vous pouvez utiliser lorsque vous devez prendre en charge des paragraphes, des éléments d’interface utilisateur inline ou des dispositions de texte complexes.Rich text blocks provide several features for advanced text layout that you can use when you need support for paragraphs, inline UI elements, or complex text layouts.

API de plateforme : classe RichTextBlock, classe RichTextBlockOverflow, classe Paragraph, classe TypographyPlatform APIs: RichTextBlock class, RichTextBlockOverflow class, Paragraph class, Typography class

Est-ce le contrôle approprié ?Is this the right control?

Utilisez un élément RichTextBlock si vous devez prendre en charge plusieurs paragraphes, du texte sur plusieurs colonnes, d’autres dispositions de texte complexes ou des éléments d’interface utilisateur inline, tels que des images.Use a RichTextBlock when you need support for multiple paragraphs, multi-column or other complex text layouts, or inline UI elements like images.

Pour afficher la majeure partie de votre texte en lecture seule dans votre application, utilisez un contrôle TextBlock.Use a TextBlock to display most read-only text in your app. Ce contrôle vous permet d’afficher une ou plusieurs lignes de texte, des liens hypertexte inclus et du texte avec mise en forme de type gras, italique ou souligné.You can use it to display single-line or multi-line text, inline hyperlinks, and text with formatting like bold, italic, or underlined. TextBlock fournit un modèle de contenu plus simple, donc généralement plus facile à utiliser, et peut offrir de meilleures performances de rendu de texte que RichTextBlock.TextBlock provides a simpler content model, so it's typically easier to use, and it can provide better text rendering performance than RichTextBlock. Il est souvent privilégié pour le texte de l’interface utilisateur des applications.It's preferred for most app UI text. Même si vous pouvez insérer des sauts de ligne dans le texte, TextBlock est conçu pour n’afficher qu’un seul paragraphe et ne prend pas en charge la mise en retrait du texte.Although you can put line breaks in the text, TextBlock is designed to display a single paragraph and doesn't support text indentation.

Pour plus d’informations sur le choix du contrôle de texte approprié, consultez l’article Contrôles de texte.For more info about choosing the right text control, see the Text controls article.

ExemplesExamples

Galerie de contrôles XAMLXAML Controls Gallery
XAML controls gallery

Si vous disposez de l’application Galerie de contrôles XAML, cliquez ici pour ouvrir l’application et voir l’objet RichTextBlock en action.If you have the XAML Controls Gallery app installed, click here to open the app and see the RichTextBlock in action.

Créer un bloc de texte enrichiCreate a rich text block

La propriété de contenu de RichTextBlock est Blocks. Elle prend en charge le texte basé sur un paragraphe via l’élément Paragraph.The content property of RichTextBlock is the Blocks property, which supports paragraph based text via the Paragraph element. Elle ne présente pas de propriété Text vous permettant d’accéder facilement au contenu de texte du contrôle dans votre application.It doesn't have a Text property that you can use to easily access the control's text content in your app. Cependant, RichTextBlock propose plusieurs fonctionnalités uniques que TextBlock ne fournit pas.However, RichTextBlock provides several unique features that TextBlock doesn't provide.

RichTextBlock prend en charge les éléments suivants :RichTextBlock supports:

  • Paragraphes multiples.Multiple paragraphs. Définissez le retrait de paragraphes en définissant la propriété TextIndent.Set the indentation for paragraphs by setting the TextIndent property.
  • Éléments d’interface utilisateur inline.Inline UI elements. Utilisez un élément InlineUIContainer pour afficher des éléments d’interface utilisateur, tels que des images et des éléments inline avec votre texte.Use an InlineUIContainer to display UI elements, such as images, inline with your text.
  • Conteneurs de débordement.Overflow containers. Utilisez des éléments RichTextBlockOverflow pour créer des dispositions de texte sur plusieurs colonnes.Use RichTextBlockOverflow elements to create multi-column text layouts.

ParagraphesParagraphs

Vous utilisez des éléments Paragraph pour définir les blocs de texte à afficher dans un contrôle RichTextBlock.You use Paragraph elements to define the blocks of text to display within a RichTextBlock control. Chaque RichTextBlock doit inclure au moins un Paragraph.Every RichTextBlock should include at least one Paragraph.

Vous pouvez définir la quantité de retraits pour tous les paragraphes d’un RichTextBlock en définissant la propriété RichTextBlock.TextIndent.You can set the indent amount for all paragraphs in a RichTextBlock by setting the RichTextBlock.TextIndent property. Vous pouvez ignorer ce paramètre pour certains paragraphes d’un RichTextBlock en définissant la propriété Paragraph.TextIndent sur une valeur différente.You can override this setting for specific paragraphs in a RichTextBlock by setting the Paragraph.TextIndent property to a different value.

<RichTextBlock TextIndent="12">
  <Paragraph TextIndent="24">First paragraph.</Paragraph>
  <Paragraph>Second paragraph.</Paragraph>
  <Paragraph>Third paragraph. <Bold>With an inline.</Bold></Paragraph>
</RichTextBlock>

Éléments d’interface utilisateur inlineInline UI elements

La classe InlineUIContainer vous permet d’intégrer des éléments UIElement inline dans votre texte.The InlineUIContainer class lets you embed any UIElement inline with your text. Un scénario courant consiste à placer un élément Image inline dans votre texte. Vous pouvez également utiliser des éléments interactifs, tels que Button ou CheckBox.A common scenario is to place an Image inline with your text, but you can also use interactive elements, like a Button or CheckBox.

Si vous voulez intégrer plusieurs éléments inline dans la même position, envisagez d’utiliser un panneau comme enfant InlineUIContainer unique, puis placez plusieurs éléments dans ce panneau.If you want to embed more than one element inline in the same position, consider using a panel as the single InlineUIContainer child, and then place the multiple elements within that panel.

Cet exemple montre comment utiliser un InlineUIContainer pour insérer une image dans un RichTextBlock.This example shows how to use an InlineUIContainer to insert an image into a RichTextBlock.

<RichTextBlock>
    <Paragraph>
        <Italic>This is an inline image.</Italic>
        <InlineUIContainer>
            <Image Source="Assets/Square44x44Logo.png" Height="30" Width="30"/>
        </InlineUIContainer>
        Mauris auctor tincidunt auctor.
    </Paragraph>
</RichTextBlock>

Conteneurs de débordementOverflow containers

Vous pouvez utiliser un contrôle RichTextBlock avec des éléments RichTextBlockOverflow pour créer des mises en forme sur plusieurs colonnes ou de page avancées.You can use a RichTextBlock with RichTextBlockOverflow elements to create multi-column or other advanced page layouts. Le contenu d’un élément RichTextBlockOverflow est toujours issu d’un élément RichTextBlock.The content for a RichTextBlockOverflow element always comes from a RichTextBlock element. Vous liez des éléments RichTextBlockOverflow en les définissant comme les composants OverflowContentTarget d’un élément RichTextBlock ou d’un autre élément RichTextBlockOverflow.You link RichTextBlockOverflow elements by setting them as the OverflowContentTarget of a RichTextBlock or another RichTextBlockOverflow.

Voici un exemple simple qui crée une disposition à deux colonnes.Here's a simple example that creates a two column layout. Consultez la section Exemples pour obtenir un exemple plus complexe.See the Examples section for a more complex example.

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <RichTextBlock Grid.Column="0" 
                   OverflowContentTarget="{Binding ElementName=overflowContainer}" >
        <Paragraph>
            Proin ac metus at quam luctus ultricies.
        </Paragraph>
    </RichTextBlock>
    <RichTextBlockOverflow x:Name="overflowContainer" Grid.Column="1"/>
</Grid>

Mise en forme du texteFormatting text

Bien que RichTextBlock stocke du texte brut, vous pouvez appliquer différentes options de mise en forme afin de personnaliser la manière dont le texte est restitué dans votre application.Although the RichTextBlock stores plain text, you can apply various formatting options to customize how the text is rendered in your app. Vous pouvez définir des propriétés de contrôle standard comme FontFamily, FontSize, FontStyle, Foreground et CharacterSpacing pour modifier l’apparence du texte.You can set standard control properties like FontFamily, FontSize, FontStyle, Foreground, and CharacterSpacing to change the look of the text. Vous pouvez également utiliser des éléments de texte inline et des propriétés Typography associées pour mettre en forme votre texte.You can also use inline text elements and Typography attached properties to format your text. Ces options affectent uniquement la manière dont RichTextBlock affiche le texte localement, afin qu’aucune mise en forme ne soit appliquée si vous copiez et collez le texte dans un contrôle de texte enrichi, par exemple.These options affect only how the RichTextBlock displays the text locally, so if you copy and paste the text into a rich text control, for example, no formatting is applied.

Éléments inlineInline elements

L’espace de noms Windows.UI.Xaml.Documents propose une variété d’éléments de texte inline utilisables pour mettre en forme votre texte, par exemple Bold, Italic, Run, Span, et LineBreak.The Windows.UI.Xaml.Documents namespace provides a variety of inline text elements that you can use to format your text, such as Bold, Italic, Run, Span, and LineBreak. Un moyen standard d’appliquer une mise en forme aux sections d’un texte consiste à placer le texte dans un élément Run ou Span, puis à définir les propriétés de cet élément.A typical way to apply formatting to sections of text is to place the text in a Run or Span element, and then set properties on that element.

Voici un Paragraph dont le texte de la première phrase est affiché en gras, bleu et 16 points.Here's a Paragraph with the first phrase shown in bold, blue, 16pt text.

<Paragraph>
    <Bold><Span Foreground="DarkSlateBlue" FontSize="16">Lorem ipsum dolor sit amet</Span></Bold>
    , consectetur adipiscing elit.
</Paragraph>

TypographieTypography

Les propriétés associées de la classe Typography donnent accès à un ensemble de propriétés typographiques Microsoft OpenType.The attached properties of the Typography class provide access to a set of Microsoft OpenType typography properties. Vous pouvez définir ces propriétés associées sur RichTextBlock ou sur des éléments de texte inline individuels, comme indiqué ici.You can set these attached properties either on the RichTextBlock, or on individual inline text elements, as shown here.

<RichTextBlock Typography.StylisticSet4="True">
    <Paragraph>
        <Span Typography.Capitals="SmallCaps">Lorem ipsum dolor sit amet</Span>
        , consectetur adipiscing elit.
    </Paragraph>
</RichTextBlock>

RecommandationsRecommendations

Voir les articles Typographie et Recommandations concernant les polices.See Typography and Guidelines for fonts.

Obtenir l’exemple de codeGet the sample code

Contrôles de texteText controls

Pour les concepteursFor designers

Pour les développeurs (XAML)For developers (XAML)

Pour les développeurs (autres)For developers (other)