How to Create Context Menu in Windows Forms Application Using C#

Introduction

In this article we will see how to create a Context Menu, Popup Menu or Shortcut menu in a Windows Forms application with the ContextMenuStrip control using C#.

Context Menu

A context menu is a group of commands or menu items that can be accessed by right-clicking on the control surface. It usually contains some frequently used commands for example Cut, Copy and Paste in a text editor. In Windows Forms, a context menu is created using the ContextMenuStrip control and its command or menu items are ToolStripMenuItem objects.

Creating a Context Menu in design view:

  • Create a new Windows Forms application and drag a ContextMenuStrip control onto the form
  • Type the name of the menu item in the ComboBox labeled with "Type Here" and press Enter. For example, type "Exit" and press Enter
  • Double-click on the menu item (Exit) to write code for its Click event. Write the following in its Click event:
     

    private void exitToolStripMenuItem_Click(object sender, EventArgs e)

    {

        Application.Exit();

    }
     

  • Set the ContextMenuStrip property of the form to contextMenuStrip1, as in:

    Creating-Context-Menu-in-design-view.jpg
     

    public Form1()

    {

        InitializeComponent();

        CreateContextMenu();

    }

     

    private void CreateContextMenu()

    {

        ContextMenuStrip menuStrip = new ContextMenuStrip();

        ToolStripMenuItem menuItem = new ToolStripMenuItem("Exit");

     

        menuItem.Click += new EventHandler(menuItem_Click);

        menuItem.Name = "Exit";

        menuStrip.Items.Add(menuItem);

       

        this.ContextMenuStrip = menuStrip;

    }

Creating Context Menu in code behind

  • Create a new Windows Forms application
  • Write code for the CreateContextMenu() method and call it after the InitializeComponet() method; see:
     

    public Form1()

    {

        InitializeComponent();

        CreateContextMenu();

    }

     

    private void CreateContextMenu()

    {

        ContextMenuStrip menuStrip = new ContextMenuStrip();

        ToolStripMenuItem menuItem = new ToolStripMenuItem("Exit");

     

        menuItem.Click += new EventHandler(menuItem_Click);

        menuItem.Name = "Exit";

        menuStrip.Items.Add(menuItem);

       

        this.ContextMenuStrip = menuStrip;

    }
     

  • Write code for the menuItem Click event:
     

    void menuItem_Click(object sender, EventArgs e)

    {

        ToolStripItem menuItem = (ToolStripItem)sender;

        if (menuItem.Name == "Exit")

        {

            Application.Exit();

        }

    }

Add image to Context Menu items

The Image property of ToolStripMenuItem is used to add an image to a menu item. In design view, select the menu item and go to its property and click the ellipsis next to the Image property and select image from the Local Resource or Project Resource File.

To add an image to a menu item, first add a folder named "icons" in the project and add images to that folder. I have added "Close.png" to that folder. ToolStripMenuItem.Image is set to use an image so you can use any image in it. You can also give any absolute path in Image.FromFile() method

menuItem.Image=Image.FromFile("../../icons/Close.png");

Add shortcut keys to Context Menu items

In design view, use the ShorcutKeys property to set shortcuts to the menu items. Select your prefered combination of keys by using CheckBoxes for Modifiers (Ctrl, Alt and Shift) and selecting Key from the ComboBox. For example, to bind shortcut the "Alt+X" to Exit, select Alt CheckBox from Modifiers and select X from the Key ComboBox.

In code behind, write the following to do the same, to add multiple keys separate them using "or" (the Pipe character):

menuItem.ShortcutKeys = Keys.Alt|Keys.X;

Add-shortcut-keys-to-Context-Menu-items.jpg


By default, shortcut keys are shown with the menu item. It can be set to hidden by setting the ShowShortcutKeys property of the menu item to false, as in:

menuItem.ShowShortcutKeys = false;

Show CheckBox to Context Menu items

To show a CheckBox in a menu item, set the Checked property of ToolStripMenuItem to true. The CheckBox will be shown only if an Image is not displayed in the menu item. CheckState of CheckBox can be set after setting the Checked property to CheckState.Checked, CheckState.Indeterminate or CheckState.Unchecked; see:
 

menuItem.Checked = true;

menuItem.CheckState = CheckState.Checked


To add a toggle CheckBox to the menu item set the CheckOnClick property to true. It toggles the checked state of the CheckBox when clicked. See:
 

menuItem.CheckOnClick = true;


Set Display Style of Context Menu items

The Display style of a ToolStripMenuItem can be changed using the DisplayStyle property. It can be set to one of the ToolStripItemDisplayStyle enumerators, ToolStripItemDisplayStyle.Image, ToolStripItemDisplayStyle.ImageAndText, ToolStripItemDisplayStyle.None or ToolStripItemDisplayStyle.Text. See:

menuItem.DisplayStyle = ToolStripItemDisplayStyle.ImageAndText;

Type of items in ContextMenuStrip

There are four types of items that can be added to a ContextMenuStrip:

  1. MenuItem (ToolStripMenuItem)

    It is used to give a simple menu item like "Exit" in the above example.
     

  2. ComboBox (ToolStripComboBox)

    It is used to insert a ComboBox in the context menu where the user can select or type an item in the ComboBox.
     

  3. Separator (ToolStripSeparator)

    It is used to put a horizontal line (ruler) between menu items.
     

  4. TextBox (ToolStripTextBox)

    It is used to put a TextBox in the context menu where the user can enter an item.

The type of item that can be selected by clicking on the arrow of the ComboBox is labeled with "Type here". See:

Type-of-items-in-ContextMenuStrip.jpg