Compartir a través de


Cómo: Crear una decoración de texto

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

Diagrama de ubicaciones de decoraciones 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

Decoración de texto con subrayado degradado lineal

El objeto Hyperlink es un elemento de contenido dinámico insertado que permite hospedar hipervínculos dentro del contenido dinámico. De forma predeterminada, Hyperlink usa un objeto TextDecoration para mostrar un subrayado. Los objetos TextDecoration pueden mejorar el rendimiento al crear instancias, especialmente si dispone de 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

Hipervínculos que muestran 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 Sub SetDefaultStrikethrough()
            ' Set the underline decoration directly to the text block.
            TextBlock1.TextDecorations = TextDecorations.Strikethrough
        End Sub
// 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 Sub SetRedUnderline()
            ' Create an underline text decoration. Default is underline.
            Dim myUnderline As 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.
            Dim myCollection As New TextDecorationCollection()
            myCollection.Add(myUnderline)
            TextBlock2.TextDecorations = myCollection
        End Sub
// 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 Sub SetLinearGradientUnderline()
            ' Create an underline text decoration. Default is underline.
            Dim myUnderline As New TextDecoration()

            ' Create a linear gradient pen for the text decoration.
            Dim myPen As 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.
            Dim myCollection As New TextDecorationCollection()
            myCollection.Add(myUnderline)
            TextBlock3.TextDecorations = myCollection
        End Sub
// 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>

Vea también

Tareas

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

Referencia

TextDecoration

Hyperlink