Como criar uma decoração de texto

  • Artigo

Um TextDecoration objeto é uma ornamentação visual que você pode adicionar ao texto. Há quatro tipos de decoração de texto: sublinhado, linha de base, tachado e linha sobreposta. O exemplo a seguir mostra os locais das decorações de texto em relação ao texto.

Diagram of text decoration types

Para adicionar uma decoração de texto ao texto, crie um TextDecoration objeto e modifique suas propriedades. Use a propriedade para especificar onde a Location decoração de texto aparece, como sublinhado. Use a Pen propriedade para especificar a aparência da decoração de texto, como um preenchimento sólido ou cor de gradiente. Se você não especificar um valor para a propriedade, as decorações terão como padrão a Pen mesma cor do texto. Depois de definir um TextDecoration objeto, adicione-o TextDecorations à coleção do objeto de texto desejado.

O exemplo a seguir mostra uma decoração de texto que foi estilizada com um pincel de gradiente linear e uma caneta tracejada.

Text decoration with linear gradient underline

O Hyperlink objeto é um elemento de conteúdo de fluxo embutido que permite hospedar hiperlinks dentro do conteúdo de fluxo. Por padrão, Hyperlink usa um objeto para exibir um TextDecoration sublinhado. TextDecoration objetos podem ser intensivos em desempenho para instanciar, especialmente se você tiver muitos Hyperlink objetos. Se você fizer uso extensivo de Hyperlink elementos, convém considerar mostrar um sublinhado somente ao acionar um evento, como o MouseEnter evento.

No exemplo a seguir, o sublinhado do link "Meu MSN" é dinâmico — ele só aparece quando o MouseEnter evento é acionado.

Hyperlinks displaying TextDecorations

Para obter mais informações, consulte Especificar se um hiperlink está sublinhado.

Exemplo

No exemplo de código a seguir, uma decoração de texto sublinhado usa o valor de fonte padrão.

// 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.
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. -->
<TextBlock
  TextDecorations="Strikethrough"
  FontSize="36" >
  The quick red fox
</TextBlock>

No exemplo de código a seguir, uma decoração de texto sublinhado é criada com um pincel de cor sólida para a caneta.

// 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.
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 -->
<TextBlock
  FontSize="36" >
  jumps over
  <TextBlock.TextDecorations>
    <TextDecorationCollection>
      <TextDecoration 
        PenThicknessUnit="FontRecommended">
        <TextDecoration.Pen>
          <Pen Brush="Red" Thickness="1" />
        </TextDecoration.Pen>
      </TextDecoration>
    </TextDecorationCollection>
  </TextBlock.TextDecorations>
</TextBlock>

No exemplo de código a seguir, uma decoração de texto sublinhado é criada com um pincel de gradiente linear para a caneta tracejada.

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

Confira também