MenuItem as a radio / options list

Fri, 26 Oct 2007 21:22:07 Z

Is it possible to make a series of MenuItem's behave like a radio button list?
The effect that I want is the same as that in Windows Explorer under the View menu for List/Tiles/Details selection - a dot is placed against the selected item on the left hand margin and only one item may be selected at any one time.

I can set MenuItem.IsCheckable=true which will turn a MenuItem into a checkbox - that makes a tick.

I could make several MenuItems and add some logic such selecting one checkbox deselects the others - but it isn't the right visual effect. It makes ticks and not dots.

I tried adding radio buttons to the Menu but the (o) selector is contained within the right hand content of the MenuItem and is not rendered in the margin.

Any ideas?
tia.

MenuItem as a radio / options list

Fri, 26 Oct 2007 23:10:12 Z

Hi,

Is this you are looking for?

<Menu xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <MenuItem Header="RadioButtonMenuItem">
         <MenuItem>
            <MenuItem.Header>
                <StackPanel>
                    <RadioButton Content="Choice 1"/>
                    <RadioButton Content="Choice 2"/>
                    <RadioButton Content="Choice 3"/>
                </StackPanel>
            </MenuItem.Header>
        </MenuItem>
</MenuItem>
</Menu>

Best regards,

Benny

MenuItem as a radio / options list

Sat, 27 Oct 2007 04:42:10 Z

Hey Benny - thanks for the reply - but its not quite what I am after.
If you paste my modified version below into XamlPad - notice how the tick of checkbox is rendered into the left hand margin of the menu item - where images are also placed if a menuItem has an image.

The radio button indicator really should also render itself into the left hand margin.
You can see the same effect in Windows Explorer -> View menu.
The Details/Tile/Large indicator is rendered into the margin.
The Status Bar tick is also rendered into the margin

<Menu xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <MenuItem Header="RadioButtonMenuItem">
         <MenuItem>
            <MenuItem.Header>
                <StackPanel>
                    <RadioButton Content="Choice 1"/>
                    <RadioButton Content="Choice 2"/>
                    <RadioButton Content="Choice 3"/>
                </StackPanel>
            </MenuItem.Header>
        </MenuItem>
        <MenuItem IsCheckable="True" IsChecked="True" Header="MyCheckbox" />
        <RadioButton Content="Choice A"/>

</MenuItem>
</Menu>

MenuItem as a radio / options list

Sat, 27 Oct 2007 06:16:24 Z

Look at the markup below in XamlPad and let me know if its more like what you're going for. If you'd like, I can post some sample code demonstrating how to actually make the options interact like you'd expect from a menu. Or you can probably come up with your own logic... it's really just a matter of setting the IsChecked property on the appropriate RadioButton in response to a MenuItem.Click event. You can get at the radio button in code through the Icon property on the clicked MenuItem. Simply cast it to a RadioButton.

Code Block

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" >

<Grid>

<Menu.Resources>

</Style>

</Menu.Resources>

<MenuItem.Icon>

<RadioButton Style="{StaticResource Group1Style}"

IsChecked="True" />

</MenuItem.Icon>

</MenuItem>

<MenuItem.Icon>

</MenuItem.Icon>

</MenuItem>

<MenuItem.Icon>

</MenuItem.Icon>

</MenuItem>

</Menu>

</Grid>

</Page>

MenuItem as a radio / options list

Sat, 27 Oct 2007 10:54:33 Z

ha - nice trick Dr WPF - that will work nicely and I will figure the rest out from there
thanks!

MenuItem as a radio / options list

Sat, 27 Oct 2007 11:29:03 Z

Hi,

I have a sample right here, which does exactly what you want, I think. In the code-behind you see the code to toggle the MenuItems checked property. I also changed the ControlTemplate, so you have a bullet when a MenuItem is checked and you don't have the blue background when hovering over the items, exactly like it is in Explorer.

Code Block

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="MenuApp.Window1"
    Title="MenuApp" Height="300" Width="300"
    xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Luna"
    >
<Window.Resources>

    <PathGeometry x:Key="Checkmark" Figures="M0,2 L0,4.8 L2.5,7.4 L7.1,2.8 L7.1,0 L2.5,4.6 z"/>
    <ControlTemplate x:Key="{ComponentResourceKey ResourceId=SubmenuItemTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}" TargetType="{x:Type MenuItem}">
        <Border SnapsToDevicePixels="true" x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition MinWidth="17" Width="Auto" SharedSizeGroup="MenuItemIconColumnGroup"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemIGTColumnGroup"/>
                    <ColumnDefinition Width="14"/>
                </Grid.ColumnDefinitions>
                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="4,0,6,0" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
                <Grid Visibility="Collapsed" x:Name="grid" Grid.ColumnSpan="1">
                    <Ellipse Fill="#FF000000" Stroke="#FF000000" Margin="6,6,6,6" x:Name="ellipse"/>
                </Grid>
                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="{TemplateBinding Padding}" Grid.Column="1" ContentSource="Header" RecognizesAccessKey="True"/>
                <TextBlock Margin="5,2,0,2" x:Name="InputGestureText" Grid.Column="2" DockPanel.Dock="Right" Text="{TemplateBinding InputGestureText}"/>
            </Grid>
        </Border>
        <ControlTemplate.Triggers>
            <Trigger Property="Icon" Value="{x:Null}">
                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
            </Trigger>
            <Trigger Property="IsChecked" Value="true">
                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
                <Setter Property="Visibility" TargetName="grid" Value="Visible"/>
            </Trigger>
            <Trigger Property="IsHighlighted" Value="true"/>
            <Trigger Property="IsEnabled" Value="false">
                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <MenuScrollingVisibilityConverter x:Key="MenuScrollingVisibilityConverter"/>
    <Style x:Key="MenuScrollButton" BasedOn="{x:Null}" TargetType="{x:Type RepeatButton}">
        <Setter Property="ClickMode" Value="Hover"/>
        <Setter Property="MinWidth" Value="0"/>
        <Setter Property="MinHeight" Value="0"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <DockPanel SnapsToDevicePixels="true" Background="Transparent">
                        <Rectangle Fill="Transparent" x:Name="R1" Width="1" DockPanel.Dock="Right"/>
                        <Rectangle Fill="Transparent" x:Name="B1" Height="1" DockPanel.Dock="Bottom"/>
                        <Rectangle Fill="Transparent" x:Name="L1" Width="1" DockPanel.Dock="Left"/>
                        <Rectangle Fill="Transparent" x:Name="T1" Height="1" DockPanel.Dock="Top"/>
                        <ContentPresenter HorizontalAlignment="Center" Margin="2,2,2,2" x:Name="ContentContainer" VerticalAlignment="Center"/>
                    </DockPanel>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsPressed" Value="true">
                            <Setter Property="Fill" TargetName="R1" Value="{DynamicResource {x:Static SystemColors.ControlLightLightBrushKey}}"/>
                            <Setter Property="Fill" TargetName="B1" Value="{DynamicResource {x:Static SystemColors.ControlLightLightBrushKey}}"/>
                            <Setter Property="Fill" TargetName="L1" Value="{DynamicResource {x:Static SystemColors.ControlDarkDarkBrushKey}}"/>
                            <Setter Property="Fill" TargetName="T1" Value="{DynamicResource {x:Static SystemColors.ControlDarkDarkBrushKey}}"/>
                            <Setter Property="Margin" TargetName="ContentContainer" Value="3,3,1,1"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Geometry x:Key="UpArrow">M 0,4 L 3.5,0 L 7,4 Z</Geometry>
    <Geometry x:Key="DownArrow">M 0,0 L 3.5,4 L 7,0 Z</Geometry>
    <Style x:Key="{ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}" BasedOn="{x:Null}" TargetType="{x:Type ScrollViewer}">
        <Setter Property="HorizontalScrollBarVisibility" Value="Hidden"/>
        <Setter Property="VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ScrollViewer}">
                    <Grid SnapsToDevicePixels="true">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Border Grid.Column="0" Grid.Row="1">
                            <ScrollContentPresenter Margin="{TemplateBinding Padding}"/>
                        </Border>
                        <RepeatButton Focusable="false" Style="{StaticResource MenuScrollButton}" Grid.Column="0" Grid.Row="0" Command="{x:Static ScrollBar.LineUpCommand}" CommandTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}">
                            <RepeatButton.Visibility>
                                <MultiBinding FallbackValue="Visibility.Collapsed" Converter="{StaticResource MenuScrollingVisibilityConverter}" ConverterParameter="0">
                                    <Binding Path="ComputedVerticalScrollBarVisibility" RelativeSource="{RelativeSource TemplatedParent}"/>
                                    <Binding Path="VerticalOffset" RelativeSource="{RelativeSource TemplatedParent}"/>
                                    <Binding Path="ExtentHeight" RelativeSource="{RelativeSource TemplatedParent}"/>
                                    <Binding Path="ViewportHeight" RelativeSource="{RelativeSource TemplatedParent}"/>
                                </MultiBinding>
                            </RepeatButton.Visibility>
                            <Path Fill="{DynamicResource {x:Static SystemColors.MenuTextBrushKey}}" Data="{StaticResource UpArrow}"/>
                        </RepeatButton>
                        <RepeatButton Focusable="false" Style="{StaticResource MenuScrollButton}" Grid.Column="0" Grid.Row="2" Command="{x:Static ScrollBar.LineDownCommand}" CommandTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}">
                            <RepeatButton.Visibility>
                                <MultiBinding FallbackValue="Visibility.Collapsed" Converter="{StaticResource MenuScrollingVisibilityConverter}" ConverterParameter="100">
                                    <Binding Path="ComputedVerticalScrollBarVisibility" RelativeSource="{RelativeSource TemplatedParent}"/>
                                    <Binding Path="VerticalOffset" RelativeSource="{RelativeSource TemplatedParent}"/>
                                    <Binding Path="ExtentHeight" RelativeSource="{RelativeSource TemplatedParent}"/>
                                    <Binding Path="ViewportHeight" RelativeSource="{RelativeSource TemplatedParent}"/>
                                </MultiBinding>
                            </RepeatButton.Visibility>
                            <Path Fill="{DynamicResource {x:Static SystemColors.MenuTextBrushKey}}" Data="{StaticResource DownArrow}"/>
                        </RepeatButton>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <ControlTemplate x:Key="{ComponentResourceKey ResourceId=TopLevelHeaderTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}" TargetType="{x:Type MenuItem}">
        <Border SnapsToDevicePixels="true" x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
            <DockPanel>
                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="4,0,6,0" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
                <Path Visibility="Collapsed" Fill="{TemplateBinding Foreground}" FlowDirection="LeftToRight" Margin="4,0,6,0" x:Name="GlyphPanel" VerticalAlignment="Center" Data="{StaticResource Checkmark}"/>
                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="{TemplateBinding Padding}" ContentSource="Header" RecognizesAccessKey="True"/>
                <Popup Focusable="false" AllowsTransparency="true" IsOpen="{Binding Path=IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}" Placement="Bottom" PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}" x:Name="PART_Popup">
                    <Microsoft_Windows_Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent">
                        <Border x:Name="SubMenuBorder" Background="{DynamicResource {x:Static SystemColors.MenuBrushKey}}" BorderBrush="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" BorderThickness="1">
                            <ScrollViewer Style="{DynamicResource {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}}" CanContentScroll="true">
                                <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="2" Grid.IsSharedSizeScope="true" KeyboardNavigation.DirectionalNavigation="Cycle" KeyboardNavigation.TabNavigation="Cycle"/>
                            </ScrollViewer>
                        </Border>
                    </Microsoft_Windows_Themes:SystemDropShadowChrome>
                </Popup>
            </DockPanel>
        </Border>
        <ControlTemplate.Triggers>
            <Trigger Property="IsSuspendingPopupAnimation" Value="true">
                <Setter Property="PopupAnimation" TargetName="PART_Popup" Value="None"/>
            </Trigger>
            <Trigger Property="Icon" Value="{x:Null}">
                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
            </Trigger>
            <Trigger Property="IsChecked" Value="true">
                <Setter Property="Visibility" TargetName="GlyphPanel" Value="Visible"/>
                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
            </Trigger>
            <Trigger Property="IsHighlighted" Value="true">
                <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
            </Trigger>
            <Trigger Property="IsEnabled" Value="false">
                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
            </Trigger>
            <Trigger Property="HasDropShadow" SourceName="PART_Popup" Value="true">
                <Setter Property="Margin" TargetName="Shdw" Value="0,0,5,5"/>
                <Setter Property="Color" TargetName="Shdw" Value="#71000000"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <ControlTemplate x:Key="{ComponentResourceKey ResourceId=TopLevelItemTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}" TargetType="{x:Type MenuItem}">
        <Border SnapsToDevicePixels="true" x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
            <DockPanel>
                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="4,0,6,0" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
                <Path Visibility="Collapsed" Fill="{TemplateBinding Foreground}" FlowDirection="LeftToRight" Margin="4,0,6,0" x:Name="GlyphPanel" VerticalAlignment="Center" Data="{StaticResource Checkmark}"/>
                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="{TemplateBinding Padding}" ContentSource="Header" RecognizesAccessKey="True"/>
            </DockPanel>
        </Border>
        <ControlTemplate.Triggers>
            <Trigger Property="Icon" Value="{x:Null}">
                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
            </Trigger>
            <Trigger Property="IsChecked" Value="true">
                <Setter Property="Visibility" TargetName="GlyphPanel" Value="Visible"/>
                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
            </Trigger>
            <Trigger Property="IsHighlighted" Value="true">
                <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
            </Trigger>
            <Trigger Property="IsEnabled" Value="false">
                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <Geometry x:Key="RightArrow">M 0,0 L 4,3.5 L 0,7 Z</Geometry>
    <ControlTemplate x:Key="{ComponentResourceKey ResourceId=SubmenuHeaderTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}" TargetType="{x:Type MenuItem}">
        <Border SnapsToDevicePixels="true" x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition MinWidth="17" Width="Auto" SharedSizeGroup="MenuItemIconColumnGroup"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemIGTColumnGroup"/>
                    <ColumnDefinition Width="14"/>
                </Grid.ColumnDefinitions>
                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="4,0,6,0" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
                <Path Visibility="Hidden" Fill="{TemplateBinding Foreground}" FlowDirection="LeftToRight" Margin="4,0,6,0" x:Name="GlyphPanel" VerticalAlignment="Center" Data="{StaticResource Checkmark}"/>
                <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="{TemplateBinding Padding}" Grid.Column="1" ContentSource="Header" RecognizesAccessKey="True"/>
                <Path Fill="{TemplateBinding Foreground}" Margin="4,0,6,0" VerticalAlignment="Center" Grid.Column="3" DockPanel.Dock="Right" Data="{StaticResource RightArrow}"/>
                <Popup Focusable="false" AllowsTransparency="true" IsOpen="{Binding Path=IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}" Placement="Right" PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}" VerticalOffset="-3" x:Name="PART_Popup">
                    <Microsoft_Windows_Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent">
                        <Border x:Name="SubMenuBorder" Background="{DynamicResource {x:Static SystemColors.MenuBrushKey}}" BorderBrush="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" BorderThickness="1">
                            <ScrollViewer Style="{DynamicResource {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}}" CanContentScroll="true">
                                <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="2" Grid.IsSharedSizeScope="true" KeyboardNavigation.DirectionalNavigation="Cycle" KeyboardNavigation.TabNavigation="Cycle"/>
                            </ScrollViewer>
                        </Border>
                    </Microsoft_Windows_Themes:SystemDropShadowChrome>
                </Popup>
            </Grid>
        </Border>
        <ControlTemplate.Triggers>
            <Trigger Property="IsSuspendingPopupAnimation" Value="true">
                <Setter Property="PopupAnimation" TargetName="PART_Popup" Value="None"/>
            </Trigger>
            <Trigger Property="Icon" Value="{x:Null}">
                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
            </Trigger>
            <Trigger Property="IsChecked" Value="true">
                <Setter Property="Visibility" TargetName="GlyphPanel" Value="Visible"/>
                <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/>
            </Trigger>
            <Trigger Property="HasDropShadow" SourceName="PART_Popup" Value="true">
                <Setter Property="Margin" TargetName="Shdw" Value="0,0,5,5"/>
                <Setter Property="Color" TargetName="Shdw" Value="#71000000"/>
            </Trigger>
            <Trigger Property="IsHighlighted" Value="true">
                <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
            </Trigger>
            <Trigger Property="IsEnabled" Value="false">
                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <Style x:Key="MenuItemStyle1" TargetType="{x:Type MenuItem}">
        <Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
        <Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.MenuTextBrushKey}}"/>
        <Setter Property="Template" Value="{DynamicResource {ComponentResourceKey ResourceId=SubmenuItemTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}}"/>
        <Style.Triggers>
            <Trigger Property="Role" Value="TopLevelHeader">
                <Setter Property="Margin" Value="0,1,0,1"/>
                <Setter Property="Padding" Value="6,3,6,3"/>
                <Setter Property="Template" Value="{DynamicResource {ComponentResourceKey ResourceId=TopLevelHeaderTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}}"/>
            </Trigger>
            <Trigger Property="Role" Value="TopLevelItem">
                <Setter Property="Margin" Value="0,1,0,1"/>
                <Setter Property="Padding" Value="6,3,6,3"/>
                <Setter Property="Template" Value="{DynamicResource {ComponentResourceKey ResourceId=TopLevelItemTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}}"/>
            </Trigger>
            <Trigger Property="Role" Value="SubmenuHeader">
                <Setter Property="DockPanel.Dock" Value="Top"/>
                <Setter Property="Padding" Value="0,2,0,2"/>
                <Setter Property="Template" Value="{DynamicResource {ComponentResourceKey ResourceId=SubmenuHeaderTemplateKey, TypeInTargetAssembly={x:Type MenuItem}}}"/>
            </Trigger>
            <Trigger Property="Role" Value="SubmenuItem">
                <Setter Property="DockPanel.Dock" Value="Top"/>
                <Setter Property="Padding" Value="0,2,0,2"/>
            </Trigger>
        </Style.Triggers>
    </Style>

</Window.Resources>
<Grid>
    <Menu VerticalAlignment="Top">
      <MenuItem Header="Background">
        <MenuItem Header="Blue" Tag="Blue" Click="BackgroundOnClick" Style="{DynamicResource MenuItemStyle1}"/>
        <MenuItem Header="Green" Tag="Green" Click="BackgroundOnClick"/>
        <MenuItem Header="Red" Tag="Red" Click="BackgroundOnClick"/>
        <MenuItem Header="Yellow" Tag="Yellow" Click="BackgroundOnClick"/>
      </MenuItem>
    </Menu>
</Grid>
</Window>

using System;
using System.Collections.Generic;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;

namespace MenuApp
{
    /// <summary>
    /// Interaction logic for Window1.xaml
    /// </summary>

    public partial class Window1 : System.Windows.Window
    {
        MenuItem itemChecked;

        public Window1()
        {
            InitializeComponent();
        }

        void BackgroundOnClick(object sender, RoutedEventArgs args)
        {
            if (itemChecked!=null)
                itemChecked.IsChecked = false;
            itemChecked = args.Source as MenuItem;
            itemChecked.IsChecked = true;
            BrushConverter converter = new BrushConverter();
            Background = (Brush)converter.ConvertFromString(itemChecked.Tag.ToString());
        }
    }
}

Best regards,

Benny

MenuItem as a radio / options list

Tue, 30 Oct 2007 20:24:35 Z

wow Benny - thats awesome. thanks!

MenuItem as a radio / options list

Thu, 30 Apr 2009 13:13:59 Z

That's a really useful snippet. Thanks.