Click or drag to resize

Modern Link

ModernLink is a Hyper link style UI element with Modern Icon

Using ModernLink

Similar to AppBarButton and AppBarIcon, ModernLink benefits from the same Icon data base provided by the framework. You can specify an IconKey to indicate the Icon to use, IconForegroundBrush to indicate the color and IconSize to indicate the size.

In a real application, ModernLink can be used as follow:

modernlink

To make similar modern links than the above image, you can apply the following XAML example: shows 4 modern links are placed into a WrapPanel.

XAML
<WrapPanel  Orientation="Vertical" Margin="30,0" Grid.Row="1" Grid.Column="3">
    <TextBlock Text="Documentation" Style="{DynamicResource TextBlockInformation}"  Margin="0,20,0,0"/>
    <ui:ModernLink IconKey="appbar_home" Text="Hummingbird project home page" Click="mlHome_Click"  x:Name="mlHome" />
    <ui:ModernLink IconKey="appbar_social_github_octocat_solid" Text="Resources on GitHub" IconForegroundBrush="DeepSkyBlue" Click="mlGithub_Click" x:Name="mlGithub" />
    <ui:ModernLink IconKey="appbar_book" Text="Test Framework documentation" IconForegroundBrush="Orange" Click="mlTFDoc_Click"  x:Name="mlTFDoc" />
    <ui:ModernLink IconKey="appbar_bug" Text="Report bugs/suggestions" IconForegroundBrush="Red" Click="mlBug_Click"  x:Name="mlBug" />
</WrapPanel>

You can use an event handler to receive the Click event when user interacts with this control.