Tuesday, October 12, 2010

How to Create ProgressBar Column in DataGridView

Introduction
Before a couple of days I was working on program that allows users upload multiple files on a server. I realized it would be a nice to show progress of upload for every file individually. I tried to find way, how to solve this. After hours of “googling” I found some solutions, how to show progress bar in DataGridView object so I decided to create my own custom progress bar column. Articles I found, served as a guide for me and I have picked up same ideas, haw to customize DataGridView columns. I have implemented some functionality that I will describe later.
Background
DataGridView control provides a several column types, enabling users to enter and edit values in variety of ways. Sometimes these column types do not meet needs, but that’s not a problem because you can create your own column types that can host controls you need. When you want to create your own column type you must define some classes derived from DataGridViewColumn and DataGridViewCell.
In this short example I will show you, how to create progress bar column. This example does not directly inserts progress bar control into cell, it only draw rectangle which looks like progress bar.
To do this, you must define classes that derive from DataGridViewColumn and DataGridViewImageCell. (You can also derive from DataGridViewCell which is the base type of all cells directly, but in this case is much more suitable derive from DataGridViewImageCell, because we will use some graphical operations.)
Main Steps
As I mentioned earlier, two classes must be created. First class I have created is DataGridViewProgressColumn which derives from DataGridViewImageColumn. This class creates a custom column for hosting a progress bar cells and overrides property CellTemplate.
Read more: Codeproject