Dar formato al texto en un TextBlock

104

¿Cómo logro formatear un texto dentro de un TextBlockcontrol en mi aplicación WPF?

Por ejemplo: me gustaría tener ciertas palabras en negrita, otras en cursiva y algunas en diferentes colores, como este ejemplo:

ingrese la descripción de la imagen aquí

La razón detrás de mi pregunta es este problema real:

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

Me gustaría que la segunda parte de la cadena fuera en negrita, y sé que podría usar dos controles (Labels, TextBlocks, etc.) pero preferiría no hacerlo, debido a la gran cantidad de controles que ya están en uso.

Ceniza
fuente

Respuestas:

139

Necesitas usar 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>

Con encuadernación:

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

También puede vincular las otras propiedades:

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

Puede enlazar a través de convertidores si tiene negrita como booleano (digamos).

ChrisF
fuente
98

Puede hacer esto en XAML con bastante facilidad:

<TextBlock>
  Hello <Bold>my</Bold> faithful <Underline>computer</Underline>.<Italic>You rock!</Italic>
</TextBlock>
Ashley Davis
fuente
¡Maravilloso! No tenía idea de que XAML admitiera tales construcciones.
Allon Guralnek
6
¿Este soporte es vinculante?
Arsen Mkrtchyan
11
@ArsenMkrt ¿Qué tal: <TextBlock FontWeight = "Bold" Text = "{Binding Budget}" />
Aetherix
2
@Aetherix No pude hacer que eso funcionara. Usé esto de qqbenq: <TextBlock> Reembolso mensual de <Bold> £ </Bold> <Run FontWeight = "Bold" Text = "{Binding MonthlyPayment}" /> </TextBlock>
Gail Foad
49

Hay varios Inlineelementos que pueden ayudarlo, para las opciones de formato más simples que puede usar Bold, Italicy Underline:

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

ingrese la descripción de la imagen aquí

Creo que vale la pena señalar que esos elementos son, de hecho, abreviaturas de Spanelementos con varias propiedades establecidas (es decir Bold, para , la FontWeightpropiedad está establecida en FontWeights.Bold).

Esto nos lleva a nuestra siguiente opción: el Spanelemento antes mencionado .

Puede lograr los mismos efectos con este elemento que el anterior, pero se le otorgan aún más posibilidades; puede configurar (entre otros) Foregroundlas Backgroundpropiedades o :

<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>

ingrese la descripción de la imagen aquí

El Spanelemento también puede contener otros elementos como este:

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

ingrese la descripción de la imagen aquí

Hay otro elemento, que es bastante similar a Span, se llama Run. El Runno puede contener otros elementos en línea mientras que la Spanlata, pero puede fácilmente se unen una variable a la Run's Textpropiedad:

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

ingrese la descripción de la imagen aquí

Además, puede hacer todo el formateo desde el código subyacente si lo prefiere:

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.");
qqbenq
fuente
44

Vea este ejemplo de Charles Petzolds Bool Aplicación = Código + marcado

//----------------------------------------------
// 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;
        }
    }
}
Wegged
fuente
7

un buen sitio, con buenas explicaciones:

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

¡Aquí el autor te da buenos ejemplos de lo que estás buscando! En general, el sitio es excelente para material de investigación y además cubre una gran cantidad de opciones que tiene en WPF

Editar

Existen diferentes métodos para formatear el texto. para un formato básico (el más fácil en mi opinión):

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

El ejemplo 1 muestra el formato básico con negrita itálica y texto subrayado.

A continuación se incluye el método SPAN, con este texto resaltado:

   <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>

El ejemplo 2 muestra la función span y las diferentes posibilidades con ella.

¡Para una explicación detallada, visite el sitio!

Ejemplos

Giellez
fuente
Si bien este enlace puede responder a la pregunta, es mejor incluir las partes esenciales de la respuesta aquí y proporcionar el enlace como referencia. Las respuestas de solo enlace pueden dejar de ser válidas si cambia la página enlazada. - De la revisión
Richard Slater
1
@Mogsdad editó la publicación para que muestre ejemplos del código
Giellez
@RichardSlater editó la publicación para que muestre ejemplos del código
Giellez
0

Esta es mi solución ...

    <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>

Estoy aprendiendo ... así que si alguien tiene información sobre la solución anterior, ¡compártala! :)

Rory Scanlan
fuente