.NET 4.0+

WPF Menu Controls - MenuItem

by Richard Carr, published at http://www.blackwasp.co.uk/WPFMenuItem.aspx

The seventy-seventh part of the Windows Presentation Foundation Fundamentals tutorial continues to describe the WPF menu controls, which present the user with a number of commands from which they may select. The second menu control is MenuItem.

Previous: Page 2

Input Gestures

In addition to access keys, commonly used commands are often assigned an input gesture. This is a key combination that executes a command without opening a menu or clicking a button. For example, Ctrl-S is often used to save a document.

The WPF MenuItem control includes the InputGesture property. This holds a simple string that you can set to show the input gesture. Once set, the text appears to the right of the menu item's header. It is important to note that setting the input gesture for a menu item does not enable the keyboard combination; it is for display purposes only. You need to code the keyboard feature separately or use command binding, which we'll see later in the tutorial.

Let's add some keyboard gesture text to the menus.

<Window x:Class="MenuItemDemo.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Not Notepad"
        Height="250"
        Width="350">
    <DockPanel>
        <Menu DockPanel.Dock="Top">
            <MenuItem Header="_File">
                <MenuItem Header="_New" Click="New_Click" InputGestureText="Ctrl+N"/>
                <MenuItem Header="_Open..." InputGestureText="Ctrl+O"/>
                <MenuItem Header="_Save" InputGestureText="Ctrl+S"/>
                <MenuItem Header="Save _As" InputGestureText="F12"/>
                <Separator />
                <MenuItem Header="Page Set_up..."/>
                <MenuItem Header="_Print..." InputGestureText="Ctrl+P"/>
                <Separator />
                <MenuItem Header="E_xit"/>
            </MenuItem>
            <MenuItem Header="_Edit">
                <MenuItem Header="_Undo" InputGestureText="Ctrl+Z"/>
                <Separator />
                <MenuItem Header="Cu_t" InputGestureText="Ctrl+X"/>
                <MenuItem Header="_Copy" InputGestureText="Ctrl+C"/>
                <MenuItem Header="_Paste" InputGestureText="Ctrl+V"/>
                <MenuItem Header="De_lete" InputGestureText="Del"/>
                <Separator />
                <MenuItem Header="_Find..." InputGestureText="Ctrl+F"/>
                <MenuItem Header="Find _Next" InputGestureText="F3"/>
                <MenuItem Header="_Replace..." InputGestureText="Ctrl+H"/>
                <MenuItem Header="_Go To..." InputGestureText="Ctrl+G"/>
                <Separator />
                <MenuItem Header="_Select">
                    <MenuItem Header="_All" InputGestureText="Ctrl+A"/>
                    <MenuItem Header="_Paragraph"/>
                </MenuItem>
                <MenuItem Header="Time/Date" InputGestureText="F5"/>
            </MenuItem>
            <MenuItem Header="F_ormat">
                <MenuItem Header="_Word Wrap"/>
                <MenuItem Header="_Font..."/>
                <MenuItem Header="_Colour"/>
            </MenuItem>
            <MenuItem Header="_View">
                <MenuItem Header="_Status Bar"/>
            </MenuItem>
            <MenuItem Header="_Help">
                <MenuItem Header="View _Help"/>
                <Separator />
                <MenuItem Header="_About Not Notepad"/>
            </MenuItem>
        </Menu>
        <TextBox Name="MyText" AcceptsReturn="True" AcceptsTab="True" TextWrapping="NoWrap" />
    </DockPanel>
</Window>

Run the program and expand the menus to see the input gestures.

WPF MenuItems with input gestures

Checkable Menu Items

You can use menu items as toggleable options, in a similar manner to a CheckBox control. Each time such a menu item is selected, either by clicking or using the keyboard, the status changes. When checked, a check mark appears to the left of the menu option. In the real Notepad utility, the Word Wrap menu item uses this approach.

To enable this functionality you can set the IsCheckable property of the MenuItem to true. Once enabled, you can read or set the status of the menu with the Boolean IsChecked property.

Let's make the Word Wrap menu item checkable. Start by changing the XAML for this MenuItem, as follows. We don't need to specify the IsChecked value; this defaults to false.

<MenuItem Name="WordWrap"
          Header="_Word Wrap"
          IsCheckable="True"
          Click="WordWrap_Click"/>

We'll use the Click event to detect whether or not the menu item is checked and update the text wrapping style for the TextBox accordingly.

private void WordWrap_Click(object sender, RoutedEventArgs e)
{
    bool wrap = WordWrap.IsChecked;
    MyText.TextWrapping = wrap ? TextWrapping.Wrap : TextWrapping.NoWrap;
}

To see the results, run the program again. Enter enough text to wrap, then toggle the Word Wrap menu using the mouse or keyboard.

WPF Checkable MenuItems

Next: Page 4

8 July 2014