none
[UWP]How to add an icon to a MenuFlyout in UWP?

    Question

  • I'm trying to add an icon to a menuflyoutitem, I'd like that my menu looks similar to this one: 

    This is my code:

    <AppBarButton.Flyout>
                    <MenuFlyout>
                        <MenuFlyoutItem Text="SMS">
                            <MenuFlyoutItem.Template>
                                <ControlTemplate TargetType="MenuFlyoutItem">
                                    <StackPanel Margin="12,10,0,0" Orientation="Horizontal">
                                        <SymbolIcon Margin="0,0,12,0" Symbol="Comment" />
                                        <TextBlock Text="{TemplateBinding Text}" />
                                    </StackPanel>
                                </ControlTemplate>
                            </MenuFlyoutItem.Template>
                        </MenuFlyoutItem>
                        <MenuFlyoutItem Text="Email">
                            <MenuFlyoutItem.Template>
                                <ControlTemplate TargetType="MenuFlyoutItem">
                                    <StackPanel Margin="12,10,0,10" Orientation="Horizontal">
                                        <SymbolIcon Margin="0,0,12,0" Symbol="MailForward" />
                                        <TextBlock Text="{TemplateBinding Text}" />
                                    </StackPanel>
                                </ControlTemplate>
                            </MenuFlyoutItem.Template>
                        </MenuFlyoutItem>
                    </MenuFlyout>
                </AppBarButton.Flyout>
    I've been struggling and I cannot find a normal tutorial about it, does anybody know I should change? Because when I add the icon all the behaviour of the Menu is lost for example it doesn't change the color again when I'm over the menu. Thanks.



    Federico Navarrete


    Thursday, April 7, 2016 9:25 PM

Answers

  • Hi FANMixco,

    You could  rewrite ControlTemplate .

    I write the following sample code for you:

    Xaml:

    <Page
        x:Class="UWPMenuFlyout.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:UWPMenuFlyout"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d">
        <Page.Resources>
    
            <ControlTemplate x:Key="MenuFlyoutItemControlTemplate1" TargetType="local:MyMenuFlyoutItem">
                <Grid x:Name="LayoutRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <Storyboard>
                                    <PointerUpThemeAnimation Storyboard.TargetName="TextBlock"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="PointerOver">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListLowBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="TextBlock">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <PointerUpThemeAnimation Storyboard.TargetName="TextBlock"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListMediumBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="TextBlock">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <PointerDownThemeAnimation Storyboard.TargetName="TextBlock"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="TextBlock">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="CheckPlaceholderStates">
                            <VisualState x:Name="NoPlaceholder"/>
                            <VisualState x:Name="CheckPlaceholder">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="TextBlock">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource MenuFlyoutItemPlaceholderThemeThickness}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="PaddingSizeStates">
                            <VisualState x:Name="DefaultPadding"/>
                            <VisualState x:Name="NarrowPadding">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Padding" Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource MenuFlyoutItemThemePaddingNarrow}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
    
                    <StackPanel Margin="12,10,0,0" Orientation="Horizontal">
                        <SymbolIcon Margin="0,0,12,0" Symbol="{TemplateBinding MyIcon}" />
                        <TextBlock x:Name="TextBlock" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Text="{TemplateBinding Text}" TextTrimming="Clip" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </StackPanel>
                </Grid>
            </ControlTemplate>
    
    
            <Style x:Key="MenuFlyoutItemStyleIcon" TargetType="local:MyMenuFlyoutItem" >
                <Setter Property="Background" Value="Transparent"/>
                <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
                <Setter Property="Padding" Value="{ThemeResource MenuFlyoutItemThemePadding}"/>
                <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="VerticalContentAlignment" Value="Center"/>
                <Setter Property="UseSystemFocusVisuals" Value="True"/>
                <Setter Property="Template" Value="{StaticResource MenuFlyoutItemControlTemplate1}">
                </Setter>
            </Style>
    
    
        </Page.Resources>
    
        <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
            <AppBarButton Content="TestBarButton" Margin="40">
                <AppBarButton.Flyout>
                    <MenuFlyout>
                        <local:MyMenuFlyoutItem Text="SMS"  MyIcon="Comment" Style="{StaticResource MenuFlyoutItemStyleIcon}" >
                        </local:MyMenuFlyoutItem>
                        <local:MyMenuFlyoutItem Text="Email" MyIcon="MailForward" Style="{StaticResource MenuFlyoutItemStyleIcon}" >
                        </local:MyMenuFlyoutItem>
                    </MenuFlyout>
                </AppBarButton.Flyout>
            </AppBarButton>
        </Grid>
    </Page>

    C#:

    namespace UWPMenuFlyout
    {
        public sealed partial class MainPage : Page
        {
            public MainPage()
            {
                this.InitializeComponent();
            }
        }
    
    
        public class MyMenuFlyoutItem:MenuFlyoutItem
        {
            
    
            public Symbol MyIcon
            {
                get { return (Symbol)GetValue(MyIconProperty); }
                set { SetValue(MyIconProperty, value); }
            }
            
            public static readonly DependencyProperty MyIconProperty =
                DependencyProperty.Register("MyIcon", typeof(Symbol), typeof(MyMenuFlyoutItem), new PropertyMetadata(Symbol.AddFriend));
    
    
        }
    }

    Screenshot:

    Best Regards,

    guang9Bear


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.


    Friday, April 8, 2016 2:49 PM
    Moderator
  • Additional code for remove space

    <Style x:Key="MenuFlyoutPresenterStyle" TargetType="MenuFlyoutPresenter">
                 <Setter Property="RequestedTheme" Value="Dark"/>
                 <Setter Property="Background" Value="{ThemeResource SystemControlBackgroundChromeMediumLowBrush}" />
                 <Setter Property="BorderBrush" Value="{ThemeResource SystemControlForegroundChromeHighBrush}" />
                 <Setter Property="BorderThickness" Value="{ThemeResource FlyoutBorderThemeThickness}" />
                 <Setter Property="Padding"  Value="{ThemeResource MenuFlyoutPresenterThemePadding}" />
                 <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled"  />
                 <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"  />
                <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto"  />
                 <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"  />
                 <Setter Property="ScrollViewer.IsHorizontalRailEnabled" Value="False"  />
                 <Setter Property="ScrollViewer.IsVerticalRailEnabled" Value="False"  />
                 <Setter Property="ScrollViewer.ZoomMode" Value="Disabled"  />
                 <Setter Property="MinWidth" Value="{ThemeResource FlyoutThemeMinWidth}" />
                 <Setter Property="MaxWidth" Value="{ThemeResource FlyoutThemeMaxWidth}" />
                 <Setter Property="MinHeight" Value="{ThemeResource MenuFlyoutThemeMinHeight}"/>
                 <Setter Property="Template">
                     <Setter.Value>
                         <ControlTemplate TargetType="MenuFlyoutPresenter">
                             <Grid Background="{TemplateBinding Background}">
                                 <ScrollViewer x:Name="MenuFlyoutPresenterScrollViewer"
                             Padding="{TemplateBinding Padding}"
                             Margin="{TemplateBinding BorderThickness}"
                             HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                             HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                             VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                             VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                             IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                             IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                             ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}"
                             AutomationProperties.AccessibilityView="Raw">
                                     <ItemsPresenter/>
                                 </ScrollViewer>
                                 <Border x:Name="MenuFlyoutPresenterBorder"
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"/>
                             </Grid>
                         </ControlTemplate>
                     </Setter.Value>
                 </Setter>
             </Style>

    <MenuFlyout MenuFlyoutPresenterStyle="{StaticResource MenuFlyoutPresenterStyle}">
                                <local:MenuFlyoutIconic Click="MenuFlyoutItem_Click" MyIcon="Copy" 
                                                        Style="{StaticResource MenuFlyoutItemStyleIcon}"  
                                                        Text="Copy Url" ></local:MenuFlyoutIconic>
                                <local:MenuFlyoutIconic Click="MenuFlyoutItem_Click" MyIcon="Send" 
                                                        Style="{StaticResource MenuFlyoutItemStyleIcon}"
                                                        Text="Share" ></local:MenuFlyoutIconic>
                            </MenuFlyout>



    • Edited by maze4 Sunday, December 24, 2017 10:07 AM
    • Marked as answer by FANMixco Sunday, December 24, 2017 10:07 AM
    Sunday, December 24, 2017 10:04 AM

All replies

  • Like this?

    http://pauliom.com/2015/12/05/951/


    http://pauliom.wordpress.com

    Thursday, April 7, 2016 9:34 PM
  • I'm not sure because the MenuFlyoutItem doesn't support the property icon, that's why I've been struggling and I couldn't find any example but in Windows 10, there are many Apps that have it implemented.


    Federico Navarrete

    Thursday, April 7, 2016 10:13 PM
  • Look at the template for the overflow and check out the state animations

    http://pauliom.wordpress.com

    Friday, April 8, 2016 7:05 AM
  • Hi FANMixco,

    You could  rewrite ControlTemplate .

    I write the following sample code for you:

    Xaml:

    <Page
        x:Class="UWPMenuFlyout.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:UWPMenuFlyout"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d">
        <Page.Resources>
    
            <ControlTemplate x:Key="MenuFlyoutItemControlTemplate1" TargetType="local:MyMenuFlyoutItem">
                <Grid x:Name="LayoutRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <Storyboard>
                                    <PointerUpThemeAnimation Storyboard.TargetName="TextBlock"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="PointerOver">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListLowBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="TextBlock">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <PointerUpThemeAnimation Storyboard.TargetName="TextBlock"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListMediumBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="TextBlock">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <PointerDownThemeAnimation Storyboard.TargetName="TextBlock"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="TextBlock">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="CheckPlaceholderStates">
                            <VisualState x:Name="NoPlaceholder"/>
                            <VisualState x:Name="CheckPlaceholder">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="TextBlock">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource MenuFlyoutItemPlaceholderThemeThickness}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="PaddingSizeStates">
                            <VisualState x:Name="DefaultPadding"/>
                            <VisualState x:Name="NarrowPadding">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Padding" Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource MenuFlyoutItemThemePaddingNarrow}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
    
                    <StackPanel Margin="12,10,0,0" Orientation="Horizontal">
                        <SymbolIcon Margin="0,0,12,0" Symbol="{TemplateBinding MyIcon}" />
                        <TextBlock x:Name="TextBlock" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Text="{TemplateBinding Text}" TextTrimming="Clip" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </StackPanel>
                </Grid>
            </ControlTemplate>
    
    
            <Style x:Key="MenuFlyoutItemStyleIcon" TargetType="local:MyMenuFlyoutItem" >
                <Setter Property="Background" Value="Transparent"/>
                <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
                <Setter Property="Padding" Value="{ThemeResource MenuFlyoutItemThemePadding}"/>
                <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                <Setter Property="VerticalContentAlignment" Value="Center"/>
                <Setter Property="UseSystemFocusVisuals" Value="True"/>
                <Setter Property="Template" Value="{StaticResource MenuFlyoutItemControlTemplate1}">
                </Setter>
            </Style>
    
    
        </Page.Resources>
    
        <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
            <AppBarButton Content="TestBarButton" Margin="40">
                <AppBarButton.Flyout>
                    <MenuFlyout>
                        <local:MyMenuFlyoutItem Text="SMS"  MyIcon="Comment" Style="{StaticResource MenuFlyoutItemStyleIcon}" >
                        </local:MyMenuFlyoutItem>
                        <local:MyMenuFlyoutItem Text="Email" MyIcon="MailForward" Style="{StaticResource MenuFlyoutItemStyleIcon}" >
                        </local:MyMenuFlyoutItem>
                    </MenuFlyout>
                </AppBarButton.Flyout>
            </AppBarButton>
        </Grid>
    </Page>

    C#:

    namespace UWPMenuFlyout
    {
        public sealed partial class MainPage : Page
        {
            public MainPage()
            {
                this.InitializeComponent();
            }
        }
    
    
        public class MyMenuFlyoutItem:MenuFlyoutItem
        {
            
    
            public Symbol MyIcon
            {
                get { return (Symbol)GetValue(MyIconProperty); }
                set { SetValue(MyIconProperty, value); }
            }
            
            public static readonly DependencyProperty MyIconProperty =
                DependencyProperty.Register("MyIcon", typeof(Symbol), typeof(MyMenuFlyoutItem), new PropertyMetadata(Symbol.AddFriend));
    
    
        }
    }

    Screenshot:

    Best Regards,

    guang9Bear


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.


    Friday, April 8, 2016 2:49 PM
    Moderator
  • Thank you very much!

    Federico Navarrete

    Friday, April 8, 2016 4:42 PM
  • Additional code for remove space

    <Style x:Key="MenuFlyoutPresenterStyle" TargetType="MenuFlyoutPresenter">
                 <Setter Property="RequestedTheme" Value="Dark"/>
                 <Setter Property="Background" Value="{ThemeResource SystemControlBackgroundChromeMediumLowBrush}" />
                 <Setter Property="BorderBrush" Value="{ThemeResource SystemControlForegroundChromeHighBrush}" />
                 <Setter Property="BorderThickness" Value="{ThemeResource FlyoutBorderThemeThickness}" />
                 <Setter Property="Padding"  Value="{ThemeResource MenuFlyoutPresenterThemePadding}" />
                 <Setter Property="ScrollViewer.HorizontalScrollMode" Value="Disabled"  />
                 <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"  />
                <Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto"  />
                 <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"  />
                 <Setter Property="ScrollViewer.IsHorizontalRailEnabled" Value="False"  />
                 <Setter Property="ScrollViewer.IsVerticalRailEnabled" Value="False"  />
                 <Setter Property="ScrollViewer.ZoomMode" Value="Disabled"  />
                 <Setter Property="MinWidth" Value="{ThemeResource FlyoutThemeMinWidth}" />
                 <Setter Property="MaxWidth" Value="{ThemeResource FlyoutThemeMaxWidth}" />
                 <Setter Property="MinHeight" Value="{ThemeResource MenuFlyoutThemeMinHeight}"/>
                 <Setter Property="Template">
                     <Setter.Value>
                         <ControlTemplate TargetType="MenuFlyoutPresenter">
                             <Grid Background="{TemplateBinding Background}">
                                 <ScrollViewer x:Name="MenuFlyoutPresenterScrollViewer"
                             Padding="{TemplateBinding Padding}"
                             Margin="{TemplateBinding BorderThickness}"
                             HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                             HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                             VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                             VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                             IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                             IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                             ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}"
                             AutomationProperties.AccessibilityView="Raw">
                                     <ItemsPresenter/>
                                 </ScrollViewer>
                                 <Border x:Name="MenuFlyoutPresenterBorder"
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"/>
                             </Grid>
                         </ControlTemplate>
                     </Setter.Value>
                 </Setter>
             </Style>

    <MenuFlyout MenuFlyoutPresenterStyle="{StaticResource MenuFlyoutPresenterStyle}">
                                <local:MenuFlyoutIconic Click="MenuFlyoutItem_Click" MyIcon="Copy" 
                                                        Style="{StaticResource MenuFlyoutItemStyleIcon}"  
                                                        Text="Copy Url" ></local:MenuFlyoutIconic>
                                <local:MenuFlyoutIconic Click="MenuFlyoutItem_Click" MyIcon="Send" 
                                                        Style="{StaticResource MenuFlyoutItemStyleIcon}"
                                                        Text="Share" ></local:MenuFlyoutIconic>
                            </MenuFlyout>



    • Edited by maze4 Sunday, December 24, 2017 10:07 AM
    • Marked as answer by FANMixco Sunday, December 24, 2017 10:07 AM
    Sunday, December 24, 2017 10:04 AM