ShareAppBarButtonStyle for XAML

28 Jun

The StandardStyles.xaml in a standard Windows 8 Metro XAML project contains about 30 different AppBar button styles. In a standard JS project there is about 150 different styles. Adam Kinney have enumerated and visualized them in a post here.

Tim Heuer have written a post about AppBar button styles for XAML here – it’s really worth a close look! In the end of the post, Tim refers to an updated with all the 150 icons defined in XAML. Thanks!

All I’m missing from the updated styles is a ShareAppBarButtonStyle. Well, with Metro Studio 2 from Syncfusion installed I easily can generate the Path that I need.

<Style x:Key="ShareAppBarButtonStyle" TargetType="Button" BasedOn="{StaticResource AppBarButtonStyle}">
    <Setter Property="AutomationProperties.AutomationId" Value="ShareAppBarButton" />
    <Setter Property="AutomationProperties.Name" Value="Share" />
    <Setter Property="ContentTemplate">
                    <Viewbox Margin="11">
                        <Path Stretch="Uniform" Fill="#FFFFFFFF" Width="26" Height="26" Margin="0,0,0,0" Data="F1M1753.16,1373.61C1751.09,1373.61,1749.19,1372.94,1747.62,1371.82L1729.47,1381.27 1747.42,1390.61C1749.02,1389.4 1750.99,1388.65 1753.16,1388.65 1758.45,1388.65 1762.73,1392.94 1762.73,1398.22 1762.73,1403.51 1758.45,1407.8 1753.16,1407.8 1747.87,1407.8 1743.59,1403.51 1743.59,1398.22 1743.59,1398.11 1743.62,1398 1743.62,1397.88L1725.63,1388.52C1724.03,1389.73 1722.05,1390.47 1719.89,1390.47 1714.6,1390.47 1710.31,1386.19 1710.31,1380.9 1710.31,1375.61 1714.6,1371.33 1719.89,1371.33 1722.3,1371.33 1724.49,1372.26 1726.17,1373.73L1743.65,1364.64C1743.64,1364.44 1743.59,1364.24 1743.59,1364.04 1743.59,1358.75 1747.87,1354.46 1753.16,1354.46 1758.45,1354.46 1762.73,1358.75 1762.73,1364.04 1762.73,1369.32 1758.45,1373.61 1753.16,1373.61z">
                                        <RotateTransform Angle="0" />
                                        <ScaleTransform ScaleX="1" ScaleY="1" />

The style is based on AppBarButtonStyle and define the share icon a Path contained in a ViewBox. You can get the style here.

// xamlgeek

One Response to “ShareAppBarButtonStyle for XAML”

  1. xyzzer June 28, 2012 at 15:50 #

    The WinRT XAML Toolkit ( also includes a StylesBrowser app that makes it easy to see what styles are available and copy the names of the styles into your xaml – that includes all 150 styles Tim Heuer blogged about.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: