Formatage de texte dans un TextBlock


104

Comment mettre en forme un texte dans un TextBlockcontrôle dans mon application WPF?

Par exemple: je voudrais avoir certains mots en gras, d'autres en italique et certains dans des couleurs différentes, comme cet exemple:

entrez la description de l'image ici

La raison derrière ma question est ce problème réel:

lblcolorfrom.Content = "Colour From: " + colourChange.ElementAt(3).Value.ToUpper();

Je voudrais que la deuxième partie de la chaîne soit en gras, et je sais que je pourrais utiliser deux contrôles (Labels, TextBlocks, etc.) mais je préfère ne pas le faire, en raison de la grande quantité de contrôles déjà utilisés.

Réponses:


140

Vous devez utiliser Inlines:

<TextBlock.Inlines>
    <Run FontWeight="Bold" FontSize="14" Text="This is WPF TextBlock Example. " />
    <Run FontStyle="Italic" Foreground="Red" Text="This is red text. " />
</TextBlock.Inlines>

Avec reliure:

<TextBlock.Inlines>
    <Run FontWeight="Bold" FontSize="14" Text="{Binding BoldText}" />
    <Run FontStyle="Italic" Foreground="Red" Text="{Binding ItalicText}" />
</TextBlock.Inlines>

Vous pouvez également lier les autres propriétés:

<TextBlock.Inlines>
    <Run FontWeight="{Binding Weight}"
         FontSize="{Binding Size}"
         Text="{Binding LineOne}" />
    <Run FontStyle="{Binding Style}"
         Foreground="Binding Colour}"
         Text="{Binding LineTwo}" />
</TextBlock.Inlines>

Vous pouvez lier via des convertisseurs si vous avez gras comme booléen (par exemple).


98

Vous pouvez le faire assez facilement en XAML:

<TextBlock>
  Hello <Bold>my</Bold> faithful <Underline>computer</Underline>.<Italic>You rock!</Italic>
</TextBlock>

Merveilleux! Je n'avais aucune idée de la prise en charge de ces constructions par XAML.
Allon Guralnek

6
est-ce que cela prend en charge la liaison?
Arsen Mkrtchyan

11
@ArsenMkrt Que diriez-vous: <TextBlock FontWeight = "Bold" Text = "{Binding Budget}" />
Aetherix

2
@Aetherix Je n'ai pas réussi à faire fonctionner ça. J'ai utilisé ceci de qqbenq: <TextBlock> Remboursement mensuel de <Bold> £ </Bold> <Run FontWeight = "Bold" Text = "{Binding MonthlyPayment}" /> </TextBlock>
Gail Foad

49

Il existe différents Inlineéléments qui peuvent vous aider, pour les options de formatage les plus simples que vous pouvez utiliser Bold, Italicet Underline:

<TextBlock>
    Sample text with <Bold>bold</Bold>, <Italic>italic</Italic> and <Underline>underlined</Underline> words.
</TextBlock>

entrez la description de l'image ici

Je pense qu'il vaut la peine de noter que ces éléments ne sont en fait que des raccourcis pour les Spanéléments avec diverses propriétés définies (c'est-à-dire: pour Bold, la FontWeightpropriété est définie sur FontWeights.Bold).

Cela nous amène à notre prochaine option: l' Spanélément susmentionné .

Vous pouvez obtenir les mêmes effets avec cet élément que ci-dessus, mais vous avez encore plus de possibilités; vous pouvez définir (entre autres) la Foregroundou les Backgroundpropriétés:

<TextBlock>
    Sample text with <Span FontWeight="Bold">bold</Span>, <Span FontStyle="Italic">italic</Span> and <Span TextDecorations="Underline">underlined</Span> words. <Span Foreground="Blue">Coloring</Span> <Span Foreground="Red">is</Span> <Span Background="Cyan">also</Span> <Span Foreground="Silver">possible</Span>.
</TextBlock>

entrez la description de l'image ici

L' Spanélément peut également contenir d'autres éléments comme celui-ci:

<TextBlock>
    <Span FontStyle="Italic">Italic <Span Background="Yellow">text</Span> with some <Span Foreground="Blue">coloring</Span>.</Span>
</TextBlock>

entrez la description de l'image ici

Il y a un autre élément, qui est assez similaire à Span, il s'appelle Run. Le Runne peut pas contenir d'autres éléments en ligne tandis que le Spancan, mais vous pouvez facilement lier une variable à la propriété Run's Text:

<TextBlock>
    Username: <Run FontWeight="Bold" Text="{Binding UserName}"/>
</TextBlock>

entrez la description de l'image ici

En outre, vous pouvez faire tout le formatage à partir du code-behind si vous préférez:

TextBlock tb = new TextBlock();
tb.Inlines.Add("Sample text with ");
tb.Inlines.Add(new Run("bold") { FontWeight = FontWeights.Bold });
tb.Inlines.Add(", ");
tb.Inlines.Add(new Run("italic ") { FontStyle = FontStyles.Italic });
tb.Inlines.Add("and ");
tb.Inlines.Add(new Run("underlined") { TextDecorations = TextDecorations.Underline });
tb.Inlines.Add("words.");

44

Consultez cet exemple de Charles Petzolds Bool Application = Code + markup

//----------------------------------------------
// FormatTheText.cs (c) 2006 by Charles Petzold
//----------------------------------------------
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Documents;

namespace Petzold.FormatTheText
{
    class FormatTheText : Window
    {
        [STAThread]
        public static void Main()
        {
            Application app = new Application();
            app.Run(new FormatTheText());
        }
        public FormatTheText()
        {
            Title = "Format the Text";

            TextBlock txt = new TextBlock();
            txt.FontSize = 32; // 24 points
            txt.Inlines.Add("This is some ");
            txt.Inlines.Add(new Italic(new Run("italic")));
            txt.Inlines.Add(" text, and this is some ");
            txt.Inlines.Add(new Bold(new Run("bold")));
            txt.Inlines.Add(" text, and let's cap it off with some ");
            txt.Inlines.Add(new Bold(new Italic (new Run("bold italic"))));
            txt.Inlines.Add(" text.");
            txt.TextWrapping = TextWrapping.Wrap;

            Content = txt;
        }
    }
}

7

un bon site, avec de bonnes explications:

http://www.wpf-tutorial.com/basic-controls/the-textblock-control-inline-formatting/

ici l'auteur vous donne de bons exemples de ce que vous recherchez! Dans l'ensemble, le site est idéal pour le matériel de recherche et couvre de nombreuses options que vous avez dans WPF

Éditer

Il existe différentes méthodes pour formater le texte. pour un formatage basique (le plus simple à mon avis):

    <TextBlock Margin="10" TextWrapping="Wrap">
                    TextBlock with <Bold>bold</Bold>, <Italic>italic</Italic> and <Underline>underlined</Underline> text.
    </TextBlock>

L'exemple 1 montre la mise en forme de base avec du texte gras et souligné.

Voici la méthode SPAN, avec laquelle vous pouvez mettre en évidence le texte:

   <TextBlock Margin="10" TextWrapping="Wrap">
                    This <Span FontWeight="Bold">is</Span> a
                    <Span Background="Silver" Foreground="Maroon">TextBlock</Span>
                    with <Span TextDecorations="Underline">several</Span>
                    <Span FontStyle="Italic">Span</Span> elements,
                    <Span Foreground="Blue">
                            using a <Bold>variety</Bold> of <Italic>styles</Italic>
                    </Span>.
   </TextBlock>

L'exemple 2 montre la fonction span et ses différentes possibilités.

Pour une explication détaillée, consultez le site!

Exemples


Bien que ce lien puisse répondre à la question, il est préférable d'inclure les parties essentielles de la réponse ici et de fournir le lien pour référence. Les réponses aux liens uniquement peuvent devenir invalides si la page liée change. - De l'avis
Richard Slater

1
@Mogsdad a édité le message pour qu'il montre des exemples du code
Giellez

@RichardSlater a édité le message pour qu'il montre des exemples du code
Giellez

0

C'est ma solution ...

    <TextBlock TextWrapping="Wrap" Style="{DynamicResource InstructionStyle}"> 
        <Run Text="This wizard will take you through the purge process in the correct order." FontWeight="Bold"></Run>
        <LineBreak></LineBreak>
        <Run Text="To Begin, select" FontStyle="Italic"></Run>
        <Run x:Name="InstructionSection" Text="'REPLACED AT RUNTIME'" FontWeight="Bold"></Run>
        <Run Text="from the menu." FontStyle="Italic"></Run>
    </TextBlock>

J'apprends ... donc si quelqu'un a des doutes sur la solution ci-dessus, veuillez partager! :)

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.