C# WinForms Metro – ComboBox – Fill From Dictionary

In this tutorial we see how to populate a metroframework windows forms combobox with a dictionary of data.

MetroComboboBox.

MetroComboboBox is a metroframework combobox.

A combobox is a UI component that displays items in a dropdown. The user can then select an item from the dropdown.

MetroComboBox gives us the ComboBox features while still applying modern metroframework visual styles.

Advantages of MetroComboBox

No.	Advantage
1.	Allows us to display list of items in a confined space.
2.	Allows us to handle the selection changed events when a combobox item is selected.

Let's go.

1. Create Project

1. Open up Visual Studio and proceed over to File --> New Project
2. A new dialog popus up like this:
3. Give it a name and click OK. A porject will get generated for us.

2. Install Metro Framework

If you haven't installed it yet. If you have then just add reference dlls to your project.

1. Right click the references section of your project and select manage nuget packages.A dialog popups up.
2. Search "Metro Framework" by Dennis Magno and click install as below.

3. Add Metro Framework DLLs to Project

We now need to add metro framework dlls to our project to use metro framework.

Next right click the references section of your project and add the metroframework dlls from the packages directory onto which they were installed. You may need to search that directory in your computer.

These allow us to use metro framework both at code level and with the designer.

Now if you look at the Windows designer toolbox you'll see the metro controls.You can then add them via the designer.

4. Add Metro Framework Controls/Components

Add it via the designer from the toolbox then go to your Form.cs and make it derive from MetroFramework.Forms.MetroForm like below:

    public partial class Form1 : MetroForm{..}

Our classes

(a). Form.cs

This is our Form1 class. It's a partial class meaning it will be used together with another partial class in this case Form1.Designer.cs.

This class derives from MetroForm:

    namespace ComboBox_Dictionary
{
    public partial class Form1 : MetroForm
    {..}
}

Then add the using statements:

using System;
using System.Collections.Generic;
using System.Windows.Forms;
using MetroFramework.Forms;

Then we create a method to populate our ComboBox from a Dictionary.

 /*
         * LOAD DATA TO COMBOX FROM DICTIONARY
         */
        private void FillComboBox()
        {
            Dictionary<int, string> spacecship = new Dictionary<int, string>();
            spacecship[1] = "Enterprise";
            spacecship[2] = "Spitzer";
            spacecship[3] = "WMAP";
            spacecship[4] = "Spitzer";
            spacecship[5] = "Casini";

            BindingSource bindingSource = new BindingSource(spacecship, null);
            dictionary_ComboBox.DataSource = bindingSource;
            dictionary_ComboBox.DisplayMember = "Value";
            dictionary_ComboBox.ValueMember = "Value";

            everythingReady = true;
        }

In the above case first we instantiate the Dictionary and assign it data. Then we instantiate a BindingSource passing in our dictionary as a parameter.

We the then set the ComboBox's DataSource property to the BindingSource object.

From your designer's events section add the selectedIndexChanged event:

private void dictionary_ComboBox_SelectedIndexChanged(object sender, EventArgs e)
        {
            if (everythingReady)
            {
                MessageBox.Show(dictionary_ComboBox.SelectedValue.ToString());
            }
        }

Then our constructor:

        public Form1()
        {
            InitializeComponent();
            FillComboBox();
        }

On top of the constructor add one boolean field:

        private bool everythingReady = false;

(b). Form1.Designer.cs

A partial class generated by the IDE:

namespace ComboBox_Dictionary
{
    partial class Form1
    {
        /// <summary>
        /// Required designer variable.
        /// </summary>
        private System.ComponentModel.IContainer components = null;

        /// <summary>
        /// Clean up any resources being used.
        /// </summary>
        /// <param name="disposing">true if managed resources should be disposed; otherwise, false.</param>
        protected override void Dispose(bool disposing)
        {
            if (disposing && (components != null))
            {
                components.Dispose();
            }
            base.Dispose(disposing);
        }

        #region Windows Form Designer generated code

        /// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {
            this.dictionary_ComboBox = new MetroFramework.Controls.MetroComboBox();
            this.SuspendLayout();
            //
            // dictionary_ComboBox
            //
            this.dictionary_ComboBox.FormattingEnabled = true;
            this.dictionary_ComboBox.ItemHeight = 23;
            this.dictionary_ComboBox.Location = new System.Drawing.Point(144, 166);
            this.dictionary_ComboBox.Name = "dictionary_ComboBox";
            this.dictionary_ComboBox.Size = new System.Drawing.Size(271, 29);
            this.dictionary_ComboBox.TabIndex = 0;
            this.dictionary_ComboBox.UseSelectable = true;
            this.dictionary_ComboBox.SelectedIndexChanged += new System.EventHandler(this.dictionary_ComboBox_SelectedIndexChanged);
            //
            // Form1
            //
            this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.ClientSize = new System.Drawing.Size(662, 463);
            this.Controls.Add(this.dictionary_ComboBox);
            this.Name = "Form1";
            this.Text = "Dictionary ComboBox";
            this.ResumeLayout(false);

        }

        #endregion

        private MetroFramework.Controls.MetroComboBox dictionary_ComboBox;
    }
}

(c). Program.cs

This is our main class with our main method:

using System;
using System.Windows.Forms;

namespace ComboBox_Dictionary
{
    static class Program
    {
        /// <summary>
        /// The main entry point for the application.
        /// </summary>
        [STAThread]
        static void Main()
        {
            Application.EnableVisualStyles();
            Application.SetCompatibleTextRenderingDefault(false);
            Application.Run(new Form1());
        }
    }
}