ContextMenu and ContextMenu elements for styling

Question

I am looking for a good example for ContextMenu and ContextMenu element styles in WPF. I would like this to be broken down into how ContextMenu, Menu and MenuItems play together. From what I have found so far, it seems that I can stylize some of them, but not all that I want. A thorough example of styling each piece will be great, or the article that goes through it will be even better.

Answer 1

Here is a way to style contextMenu to remove its left side:

<Style x:Key="ContextMenuStyle1" TargetType="{x:Type ContextMenu}"> <Setter Property="Background" Value="{DynamicResource MenuBackgroundBrush}"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="BorderBrush" Value="{DynamicResource WindowBorderBrush}"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type ContextMenu}"> <Border Uid="Border_93"> <Border.Style> <Style TargetType="{x:Type Border}"> <Setter Property="Tag" Value="{DynamicResource {x:Static SystemParameters.DropShadowKey}}"/> <Style.Triggers> <DataTrigger Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" Value="True"> <Setter Property="Background" Value="Transparent"/> <Setter Property="Padding" Value="0,0,5,5"/> <Setter Property="Effect"> <Setter.Value> <DropShadowEffect BlurRadius="4" Opacity="0.8" ShadowDepth="1"/> </Setter.Value> </Setter> </DataTrigger> </Style.Triggers> </Style> </Border.Style> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> 

Then use this:

 <StackPanel x:Name="LayoutRoot"> <Button Content="Click for ContextMenu" Width="30" HorizontalAlignment="Center" VerticalAlignment="Center"> <Button.ContextMenu> <ContextMenu Template="{DynamicResource ContextMenuControlTemplate1}" Style="{DynamicResource ContextMenuStyle1}"> <MenuItem Header="File"/> <MenuItem Header="Edit"/> <MenuItem Header="View"/> <MenuItem Header="Recent Files"/> <MenuItem Header="file1.txt"/> <MenuItem Header="file2.txt"/> </ContextMenu> </Button.ContextMenu> </Button>