Cómo: Crear una decoración de texto

Actualización: noviembre 2007

Un objeto TextDecoration es una ornamentación visual que se puede agregar al texto. Hay cuatro tipos de decoraciones de texto: subrayado, línea base, tachado y línea alta. En el ejemplo siguiente, se muestran las ubicaciones de las decoraciones de texto con respecto al texto.

Ejemplo de tipos de decoración de texto

Para agregar una decoración al texto, cree un objeto TextDecoration y modifique sus propiedades. Utilice la propiedad Location para especificar dónde aparecerá la decoración de texto, como un subrayado. Utilice la propiedad Pen para especificar el aspecto de la decoración de texto, como un relleno sólido o un color de degradado. Si no especifica un valor para la propiedad Pen, las decoraciones tienen como valor predeterminado el mismo color que el texto. Una vez definido un objeto TextDecoration, agréguelo a la colección TextDecorations del objeto de texto deseado.

En el ejemplo siguiente, se muestra una decoración de texto a la que se la ha aplicado el estilo con un pincel de degradado lineal y un lápiz rayado.

Ejemplo de subrayado con un pincel de degradado lineal y un lápiz rayado

El objeto Hyperlink es un elemento de contenido dinámico insertado que permite hospedar hipervínculos dentro del contenido dinámico. De manera predeterminada, Hyperlink utiliza un objeto TextDecoration para mostrar un subrayado. Crear instancias de los objetos TextDecoration puede afectar intensamente al rendimiento, en especial si hay muchos objetos Hyperlink. Si realiza un uso excesivo de elementos Hyperlink, puede ser conveniente mostrar la línea de subrayado únicamente al desencadenar un evento, como el evento MouseEnter.

En el ejemplo siguiente, el subrayado para el vínculo "My MSN" es dinámico: únicamente aparece cuando se activa el evento MouseEnter.

Hipervínculos definidos con TextDecorations

Para obtener más información, consulte Cómo: Usar una decoración de texto con un hipervínculo.

Ejemplo

En el ejemplo de código siguiente, una decoración de texto de subrayado utiliza el valor de fuente predeterminado.

// Use the default font values for the strikethrough text decoration.
private void SetDefaultStrikethrough()
{
    // Set the underline decoration directly to the text block.
    TextBlock1.TextDecorations = TextDecorations.Strikethrough;
}

<!-- Use the default font values for the strikethrough text decoration. -->
<TextBlock
  TextDecorations="Strikethrough"
  FontSize="36" >
  The quick red fox
</TextBlock>

En el ejemplo de código siguiente, se crea una decoración de texto de subrayado con un pincel de color sólido para el lápiz.

// Use a Red pen for the underline text decoration.
private void SetRedUnderline()
{
    // Create an underline text decoration. Default is underline.
    TextDecoration myUnderline = new TextDecoration();

    // Create a solid color brush pen for the text decoration.
    myUnderline.Pen = new Pen(Brushes.Red, 1);
    myUnderline.PenThicknessUnit = TextDecorationUnit.FontRecommended;

    // Set the underline decoration to a TextDecorationCollection and add it to the text block.
    TextDecorationCollection myCollection = new TextDecorationCollection();
    myCollection.Add(myUnderline);
    TextBlock2.TextDecorations = myCollection;
}

<!-- Use a Red pen for the underline text decoration -->
<TextBlock
  FontSize="36" >
  jumped over
  <TextBlock.TextDecorations>
    <TextDecorationCollection>
      <TextDecoration 
        PenThicknessUnit="FontRecommended">
        <TextDecoration.Pen>
          <Pen Brush="Red" Thickness="1" />
        </TextDecoration.Pen>
      </TextDecoration>
    </TextDecorationCollection>
  </TextBlock.TextDecorations>
</TextBlock>

En el ejemplo de código siguiente, se crea una decoración de texto subrayado con un pincel de degradado lineal para el lápiz rayado.

// Use a linear gradient pen for the underline text decoration.
private void SetLinearGradientUnderline()
{
    // Create an underline text decoration. Default is underline.
    TextDecoration myUnderline = new TextDecoration();

    // Create a linear gradient pen for the text decoration.
    Pen myPen = new Pen();
    myPen.Brush = new LinearGradientBrush(Colors.Yellow, Colors.Red, new Point(0, 0.5), new Point(1, 0.5));
    myPen.Brush.Opacity = 0.5;
    myPen.Thickness = 1.5;
    myPen.DashStyle = DashStyles.Dash;
    myUnderline.Pen = myPen;
    myUnderline.PenThicknessUnit = TextDecorationUnit.FontRecommended;

    // Set the underline decoration to a TextDecorationCollection and add it to the text block.
    TextDecorationCollection myCollection = new TextDecorationCollection();
    myCollection.Add(myUnderline);
    TextBlock3.TextDecorations = myCollection;
}

<!-- Use a linear gradient pen for the underline text decoration. -->
<TextBlock FontSize="36">the lazy brown dog.
  <TextBlock.TextDecorations>
    <TextDecorationCollection>
      <TextDecoration  
        PenThicknessUnit="FontRecommended">
        <TextDecoration.Pen>
          <Pen Thickness="1.5">
            <Pen.Brush>
              <LinearGradientBrush Opacity="0.5"
                StartPoint="0,0.5"  EndPoint="1,0.5">
                <LinearGradientBrush.GradientStops>
                  <GradientStop Color="Yellow" Offset="0" />
                  <GradientStop Color="Red" Offset="1" />
                </LinearGradientBrush.GradientStops>
              </LinearGradientBrush>
            </Pen.Brush>
            <Pen.DashStyle>
              <DashStyle Dashes="2"/>
            </Pen.DashStyle>
          </Pen>
        </TextDecoration.Pen>
      </TextDecoration>
    </TextDecorationCollection>
  </TextBlock.TextDecorations>
</TextBlock>

Nota

Para obtener un ejemplo completo del uso de decoraciones de texto, consulte Ejemplo TextDecoration.

Vea también

Tareas

Cómo: Usar una decoración de texto con un hipervínculo

Referencia

TextDecoration

Hyperlink