Comment : créer une décoration de texte

Mise à jour : novembre 2007

Un objet TextDecoration est un ornement visuel que vous pouvez ajouter au texte. Il existe quatre types de décorations de texte : soulignement, ligne de base, ligne barrée et ligne au-dessus. L'exemple suivant montre les emplacements des décorations de texte relatives au texte.

Exemple de types de décorations de texte

Pour ajouter une décoration de texte à un texte, créez un objet TextDecoration et modifiez ses propriétés. Utilisez la propriété Location pour spécifier l'endroit où apparaît la décoration, le soulignement par exemple. Utilisez la propriété Pen pour spécifier l'apparence de la décoration de texte, une couleur de remplissage ou un dégradé de couleurs par exemple. Si vous ne spécifiez pas de valeur pour la propriété Pen, les décorations sont par défaut de la même couleur que le texte. Une fois que vous avez défini un objet TextDecoration, ajoutez-le à la collection TextDecorations de l'objet de texte souhaité.

L'exemple suivant montre une décoration de texte qui a été mise en forme avec un pinceau à dégradé linéaire et un stylet en pointillés.

Exemple d'un soulignement mis en forme avec un pinceau à dégradé linéaire et un stylet en pointillés

L'objet Hyperlink est un élément inclus de contenu de flux qui vous permet d'héberger des liens hypertexte au sein du contenu du flux. Par défaut, Hyperlink utilise un objet TextDecoration pour afficher un soulignement. L'instanciation d'objets TextDecoration peut être exigeante en termes de performances, en particulier si vous avez un grand nombre d'objets Hyperlink. Si vous utilisez beaucoup d'éléments Hyperlink, envisagez d'afficher un soulignement uniquement lors du déclenchement d'un événement, tel que MouseEnter.

Dans l'exemple suivant, le soulignement du lien "My MSN" est dynamique : il s'affiche uniquement lorsque l'événement MouseEnter est déclenché.

Hyperliens définis à l'aide de décorations de texte

Pour plus d'informations, consultez Comment : utiliser une décoration de texte avec un lien hypertexte.

Exemple

Dans l'exemple de code suivant, une décoration de texte souligné utilise la valeur de police par défaut.

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

Dans l'exemple suivant, une décoration de texte souligné est créée à l'aide d'un pinceau de couleur unie pour le stylet.

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

Dans l'exemple de code suivant, une décoration de texte souligné est créée à l'aide d'un pinceau à dégradé linéaire pour le stylet en pointillés.

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

Remarque :
Pour obtenir un exemple complet d'utilisation des décorations de texte, consultez TextDecoration, exemple.

Voir aussi

Tâches

Comment : utiliser une décoration de texte avec un lien hypertexte

Référence

TextDecoration

Hyperlink