How to add TooTip to MenuItem - wpf

Question

This is my Menu:
<Menu Name="menuInterfaces" ItemsSource="{Binding MenuItems}" Margin="0,8,0,0" Style="{StaticResource StandardMenu}">
<Menu.ItemTemplate>
<HierarchicalDataTemplate DataType="{x:Type Menu:MenuItemViewModel}" ItemsSource="{Binding Path=MenuItems}">
<Grid>
<TextBlock Text="{Binding Description}"/>
</Grid>
</HierarchicalDataTemplate>
</Menu.ItemTemplate>
</Menu>
And my Style:
<Style TargetType="{x:Type Menu}" x:Key="StandardMenu">
<Style.Resources>
<Style x:Key="{x:Static MenuItem.SeparatorStyleKey}" TargetType="Separator">
<Setter Property="Height" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Separator">
<Border BorderBrush="{StaticResource MenuSeparatorBorderBrush}" BorderThickness="1" Margin="25,0,0,0"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="{x:Type MenuItem}">
<Setter Property="Foreground" Value="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType={x:Type Menu}}}"/>
<Setter Property="FontSize" Value="{DynamicResource ApplicationFontSize}"/>
<Setter Property="Command" Value="{Binding Command}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type MenuItem}">
<!--Border 1-->
<Border x:Name="Border" Background="Transparent" BorderBrush="Transparent" CornerRadius="2"
BorderThickness="1" SnapsToDevicePixels="False">
<Grid x:Name="Grid">
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="Col0" MinWidth="17" Width="Auto" SharedSizeGroup="MenuItemIconColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuTextColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemIGTColumnGroup"/>
<ColumnDefinition x:Name="Col3" Width="14"/>
</Grid.ColumnDefinitions>
<ContentPresenter Grid.Column="0" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
<ContentPresenter Grid.Column="1" Margin="{TemplateBinding Padding}" x:Name="HeaderHost" RecognizesAccessKey="True" ContentSource="Header" VerticalAlignment="Center"/>
<ContentPresenter Grid.Column="2" Margin="8,1,8,1" x:Name="IGTHost" ContentSource="InputGestureText" VerticalAlignment="Center"/>
<Grid Grid.Column="3" Margin="4,0,6,0" x:Name="ArrowPanel" VerticalAlignment="Center">
<Path x:Name="ArrowPanelPath" HorizontalAlignment="Right" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="M0,0 L0,8 L4,4 z"/>
</Grid>
<Popup IsOpen="{Binding Path=IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}"
Placement="Right"
HorizontalOffset="-1"
x:Name="SubMenuPopup"
Focusable="false"
PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}"
AllowsTransparency="True">
<Grid Margin="0,0,5,5">
<!--Border 2-->
<Border x:Name="SubMenuBorder" CornerRadius="5"
BorderBrush="{StaticResource MenuSeparatorBorderBrush}"
BorderThickness="1"
Background="{StaticResource SubmenuItemBackground}"
SnapsToDevicePixels="True">
<Grid x:Name="SubMenu" Grid.IsSharedSizeScope="True" Margin="2">
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Cycle"/>
</Grid>
<Border.Effect>
<DropShadowEffect ShadowDepth="2" Color="Black"/>
</Border.Effect>
</Border>
<!--Border 3-->
<Border Margin="1,0,0,0"
x:Name="TransitionBorder"
Width="0"
Height="2"
VerticalAlignment="Top"
HorizontalAlignment="Left"
Background="{StaticResource SubmenuItemBackground}"
SnapsToDevicePixels="False"
BorderThickness="1"
BorderBrush="{StaticResource SubmenuItemBackground}"/>
</Grid>
</Popup>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="Role" Value="TopLevelHeader">
<Setter Property="Padding" Value="6,0,6,2"/>
<Setter TargetName="SubMenuPopup" Property="Placement" Value="Bottom"/>
<Setter TargetName="Col0" Property="MinWidth" Value="0"/>
<Setter TargetName="Col3" Property="Width" Value="Auto"/>
<Setter TargetName="Icon" Property="Visibility" Value="Collapsed"/>
<Setter TargetName="IGTHost" Property="Visibility" Value="Collapsed" />
<Setter TargetName="ArrowPanel" Property="Visibility" Value="Collapsed"/>
<Setter TargetName="SubMenuBorder" Property="BorderThickness" Value="1,1,1,1"/>
<Setter TargetName="SubMenu" Property="Margin" Value="2,3,2,2"/>
<Setter TargetName="TransitionBorder" Property="Width" Value="{Binding ActualWidth, ElementName=Grid}"/>
</Trigger>
<Trigger Property="Role" Value="TopLevelItem">
<Setter Property="Padding" Value="6,0,6,2"/>
<Setter TargetName="Col0" Property="MinWidth" Value="0"/>
<Setter TargetName="Col3" Property="Width" Value="Auto"/>
<Setter TargetName="Icon" Property="Visibility" Value="Collapsed"/>
<Setter TargetName="IGTHost" Property="Visibility" Value="Collapsed"/>
<Setter TargetName="ArrowPanel" Property="Visibility" Value="Collapsed"/>
</Trigger>
<Trigger Property="Role" Value="SubmenuHeader">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="10,3,0,3"/>
<Setter TargetName="Border" Property="MinHeight" Value="22"/>
<Setter TargetName="Border" Property="Background" Value="{StaticResource SubmenuItemBackground}"/>
</Trigger>
<Trigger Property="Role" Value="SubmenuItem">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="10,3,0,3"/>
<Setter TargetName="Border" Property="MinHeight" Value="22"/>
<Setter TargetName="ArrowPanel" Property="Visibility" Value="Collapsed"/>
<Setter TargetName="Border" Property="Background" Value="{StaticResource SubmenuItemBackground}"/>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsHighlighted" Value="true"/>
<Condition Property="Role" Value="TopLevelHeader"/>
</MultiTrigger.Conditions>
<Setter TargetName="Border" Property="Background" Value="{StaticResource MenuItemHighlightedBackground}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsHighlighted" Value="true"/>
<Condition Property="Role" Value="TopLevelItem"/>
</MultiTrigger.Conditions>
<Setter TargetName="Border" Property="Background" Value="{StaticResource MenuItemHighlightedBackground}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsHighlighted" Value="true"/>
<Condition Property="Role" Value="SubmenuHeader"/>
</MultiTrigger.Conditions>
<Setter TargetName="Border" Property="Background" Value="{StaticResource SubmenuItemBackgroundHighlighted}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsHighlighted" Value="true"/>
<Condition Property="Role" Value="SubmenuItem"/>
</MultiTrigger.Conditions>
<Setter TargetName="Border" Property="Background" Value="{StaticResource SubmenuItemBackgroundHighlighted}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSubmenuOpen" Value="true"/>
<Condition Property="Role" Value="TopLevelHeader"/>
</MultiTrigger.Conditions>
<Setter TargetName="Border" Property="Background" Value="#55B3B3B6"/>
<Setter TargetName="Border" Property="BorderBrush" Value="#55B3B3B6"/>
<Setter TargetName="Border" Property="BorderThickness" Value="1,1,1,0"/>
</MultiTrigger>
<Trigger Property="IsSuspendingPopupAnimation" Value="true">
<Setter TargetName="SubMenuPopup" Property="PopupAnimation" Value="None"/>
</Trigger>
<Trigger Property="Icon" Value="{x:Null}">
<Setter TargetName="Icon" Property="Visibility" Value="Collapsed"/>
</Trigger>
<!--<Trigger Property="IsMouseOver" Value="False">
<Setter Property="Foreground" Value="LightSlateGray"/>
--><!--<Setter Property="IsSubmenuOpen" Value="False"/>-->
<!--<Setter Property="Cursor" Value="No"/>--><!--
</Trigger>-->
<!--<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="Black"/>
--><!--<Setter Property="IsSubmenuOpen" Value="True"/>
<Setter Property="Cursor" Value="Hand"/>--><!--
</Trigger>
<Trigger Property="IsSubmenuOpen" Value="true">
<Setter TargetName="ArrowPanelPath" Property="Fill" Value="{StaticResource BackgroundSelected}"/>
<Setter Property="Foreground" Value="LightSlateGray"/>
</Trigger>-->
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="False"/>
<Condition Property="IsSubmenuOpen" Value="False"/>
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter Property="Foreground" Value="LightSlateGray"/>
</MultiTrigger.Setters>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True"/>
<Condition Property="IsSubmenuOpen" Value="False"/>
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter Property="Foreground" Value="Silver"/>
<Setter TargetName="Border" Property="Background" Value="#55B3B3B6"/>
</MultiTrigger.Setters>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="False"/>
<Condition Property="IsSubmenuOpen" Value="True"/>
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter Property="Foreground" Value="Silver"/>
<Setter TargetName="Border" Property="Background" Value="#55B3B3B6"/>
</MultiTrigger.Setters>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True"/>
<Condition Property="IsSubmenuOpen" Value="True"/>
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter TargetName="Border" Property="Background" Value="#55B3B3B6"/>
<Setter TargetName="Border" Property="BorderBrush" Value="Transparent"/>
<Setter Property="Foreground" Value="Silver"/>
</MultiTrigger.Setters>
</MultiTrigger>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding IsManagement}" Value="True"/>
</MultiDataTrigger.Conditions>
<Setter Property="IsEnabled" Value="False"/>
<Setter Property="Foreground" Value="{StaticResource MenuDisabledForeground}"/>
</MultiDataTrigger>
<!--<Trigger Property="IsEnabled" Value="False">
<Setter Property="Foreground" Value="{StaticResource MenuDisabledForeground}"/>
</Trigger>-->
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Style.Resources>
<Setter Property="Background" Value="{StaticResource LightBackground}"/>
<Setter Property="Foreground" Value="{StaticResource Foreground}"/>
</Style>
View model:
public class MenuItemViewModel : INotifyPropertyChanged
{
private readonly ICommand _command;
public event PropertyChangedEventHandler PropertyChanged;
public string Name { get; set; }
public string Description { get; set; }
public string Id { get; set; }
public bool _isSelected { get; set; }
public MenuItemViewModel()
{
_command = new CommandViewModel(Execute);
}
public bool IsSelected
{
get { return _isSelected; }
set
{
_isSelected = value;
OnPropertyChanged("IsSelected");
}
}
protected void OnPropertyChanged(string name)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
}
public ObservableCollection<MenuItemViewModel> MenuItems { get; set; }
public ICommand Command
{
get { return _command; }
}
private void Execute()
{
// (NOTE: In a view model, you normally should not use
}
}
Now all i want to do is add ToolTip so under Menu section inside my XAML i added this section:
<Menu.ToolTip>
<ToolTip>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding Description}"/>
<TextBlock Text="{Binding Name}"/>
<TextBlock Text="{Binding Id}"/>
</StackPanel>
</ToolTip>
</Menu.ToolTip>
But nothings is shown so my suspicion is my Style but i cant find out where..
Any suggestions ?

Answer 1

Based on your bindings it seems to me your intention is to add the tooltip to the individual menu items rather than the top-level menu itself, so you probably want to be doing something like this:
<Style TargetType="{x:Type MenuItem}">
<Setter Property="ToolTip">
<Setter.Value>
<ToolTip>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding Description}"/>
<TextBlock Text="{Binding Name}"/>
<TextBlock Text="{Binding Id}"/>
</StackPanel>
</ToolTip>
</Setter.Value>
</Setter>
<!-- etc -->
</Style>