Images in a Data Grid

Environment: .NET Beta 2

This article tells you how to get images in a data grid

If you try to display bitmaps in a data grid, you see only a text message for the bitmap. For displaying bitmaps, you must create an own table style for your data grid. Furthermore you need a 'DataGridImageColumn' class for displaying bitmaps in the datagrid. The following code shows how to create your own table style. A DataSet with a table 'Test' is defined previously:

DataGridTableStyle DGStyle;
DataGridColumnStyle GridTextColumn, GridBmpColumn;
DGStyle = new DataGridTableStyle();

// select table
DGStyle.MappingName = "Test";

// get the PropertyDescriptorCollection for the data
// source and data member.
PropertyDescriptorCollection pcol = 
        this.BindingContext[DBDataSet,
                            "Test"].GetItemProperties();

// create column style for a text column
GridTextColumn = new DataGridTextBoxColumn(pcol["Description"]);
GridTextColumn.MappingName = "Description";
GridTextColumn.HeaderText = "Icon-Name";
GridTextColumn.Width = 200;
DGStyle.GridColumnStyles.Add(GridTextColumn);

// create column style for an image column
GridBmpColumn = new DataGridImageColumn(pcol["Images"]);
GridBmpColumn.MappingName = "Images";
GridBmpColumn.HeaderText = "Bitmap";
GridBmpColumn.Width = 100;
DGStyle.GridColumnStyles.Add(GridBmpColumn);

// add table style to the data grid
dataGrid1.TableStyles.Add(DGStyle);

// connect grid with database
dataGrid1.DataSource = DBDataSet;
dataGrid1.DataMember = DBDataSet.Tables["Test"].TableName;

The 'PropertyDescriptorCollection' do the data binding to the columns of the data grid. After creating an own column style for each column, you add the styles to your data grid. Now, you must connect the data grid with your data base and implement your own 'DataGridImageColumn' class.

The 'DataGridImageColumn' class is inherited from the PictureBox class. For a valid DataGridColumn class you must override the methods: Abort, Commit, Edit, GetMinimumHeight, GetPreferredHeight, GetPreferredSize and the Paint routines (see the code for the 'DataGridImageColumn' class in the example). The Paint routine do the hole work. With the GetColumnAtRow method you get the field data of the actual data grid cell. After extracting the bitmap from the OLE container, you can draw the image at the given position.

Remark: In ADO.NET (or maybe generally in OLE fields) the fields are limited to a maximum of 8000 Bytes, so Bitmap size must be smaller than 7928 Bytes (8000Bytes - 72Bytes (Container)).

Downloads