How to: Use a Text Decoration with a Hyperlink

The Hyperlink object is an inline-level flow content element that allows you to host hyperlinks within the flow content. By default, Hyperlink uses a TextDecoration object to display an underline. TextDecoration objects can be performance intensive to instantiate, particularly if you have many Hyperlink objects. If you make extensive use of Hyperlink elements, you may want to consider showing an underline only when triggering an event, such as the MouseEnter event.

In the following example, the underline for the "My MSN" link is dynamic—it only appears when the MouseEnter event is triggered.


Hyperlinks defined with TextDecorations

Hyperlinks displaying TextDecorations

Example

The following markup sample shows a Hyperlink defined with and without an underline:

<!-- Hyperlink with default underline. -->
<Hyperlink NavigateUri="https://www.msn.com">
  MSN Home
</Hyperlink>

<Run Text=" | " />

<!-- Hyperlink with no underline. -->
<Hyperlink Name="myHyperlink" TextDecorations="None"
           MouseEnter="OnMouseEnter"
           MouseLeave="OnMouseLeave"
           NavigateUri="https://www.msn.com">
  My MSN
</Hyperlink>

The following code sample shows how to create an underline for the Hyperlink on the MouseEnter event, and remove it on the MouseLeave event.

// Display the underline on only the MouseEnter event.
public void OnMouseEnter(object sender, EventArgs e)
{
    myHyperlink.TextDecorations = TextDecorations.Underline;
}

// Remove the underline on the MouseLeave event.
public void OnMouseLeave(object sender, EventArgs e)
{
    myHyperlink.TextDecorations = null;
}

See Also

Tasks

How to: Create a Text Decoration

Reference

TextDecoration
Hyperlink

Concepts

Optimizing WPF Application Performance