How to Create a Metro ListView in C#

This is a basic example to get you started using Metro ListView, then use Entity Framework to retrieve data from sql database and show data in the Metro ListView in C# Windows Forms Application.

The Metro Framework is a library support multiple controls that allows you to design an awesome ui windows form application, and Entity Framework is an ORM that allows you to access your database, you can use the Entity Framework to Insert, Update, Delete data from your database or call stored procedures, select views, tables that you want process.

How to create a Metro ListView in C#

Open your Visual Studio, then create a new Windows Forms project.

You can Install MetroFramework via NuGet Package Manager by right-clicking on your project, then selecting Manage NuGet Packages -> Search metro framework -> Install.

If you don't see the metro framework in your Visual Studio toolbox, you can view How to download and install metro framework

Drag and Drop MetroListView, MetroButton controls into your winform, then design a simple metro form as shown below.

To initialize your metro form, you need to change inheritace from the Form to MetroForm as the following c# code.

public partial class Form1 : Forms

to

public partial class Form1 : MetroFramework.Forms.MetroForm

Right click on your project select Add -> New Item -> ADO.NET Entity Data Model -> Select Northwind database -> Customers table

We will use Entity Framework Database First to fetch data from your customer table in the Northwind database.

If you haven't got Northwind database, you can view How to download and restore Northwind database in SQL Server

Finally, Add the click event to the Load button allows you to retrieve data from the sql database, then add data to the MetroListView control as the following c# code.

private void btnLoad_Click(object sender, EventArgs e)
{
   //clear data in metro listview
    mListView.Items.Clear();
    using (NorthwindEntities db = new NorthwindEntities())//Create an instance dbcontext
    {
        var list = db.Customers.ToList();//Retrieve data
        foreach (Customer c in list)
        {
            ListViewItem item = new ListViewItem(c.CustomerID);//Create ListViewItem
            item.SubItems.Add(c.ContactName);
            item.SubItems.Add(c.ContactTitle);
            item.SubItems.Add(c.Address);
            item.SubItems.Add(c.City);
            mListView.Items.Add(item);//Add data to MetroListView
        }
    }
}

To load data to the ListView control, you need to retrieve all the data from the customer table, then convert it to the list object. You can use the foreach loop to add the Customer object to your Metro ListView as shown above.

VIDEO TUTORIAL