Adding About Support e-mail Flyout

This post describes how to create an “About” flyout that includes a support e-mail link.

First, create a flyout as described in the CharmFlyout post.

For the content of the flyout, use something like this:

MainPage.xaml

<cfo:CharmFlyout
    x:Name="cfoSettings"
    Heading="My Flyout"
    HeadingBackgroundBrush="#FF4E0000">
    <StackPanel>
        <TextBlock
            FontSize="16">CharmFlyout by John Michael Hauck</TextBlock>
        <TextBlock
            FontSize="16">For support:</TextBlock>
        <HyperlinkButton
            Click="OnMailTo">support@bing.com</HyperlinkButton>
    </StackPanel>
</cfo:CharmFlyout>

For the code behind function OnMailTo, use something like this:

MainPage.xaml.cs

private async void OnMailTo(object sender, RoutedEventArgs args)
{
    var hyperlinkButton = sender as HyperlinkButton;
    if (hyperlinkButton != null)
    {
        var uri = new Uri("mailto:" + hyperlinkButton.Content);
        await Windows.System.Launcher.LaunchUriAsync(uri);
    }
}

You then end up with something like this:

When you click the e-mail link, the mail application should start, with the To address filled out.

It might be nice to place the XAML and code-behind in a separate UserControl.