Image in DataGridView

[poets]

Good day to all,
could you please help ? I am a very noob to DataGridView and can not solve the problem of displaying the image in it.

I fill the grid from datatable and based on values in column("File") I want to decide which picture will be displayed in programmatically added column("Scan").

Could you please advise ? I suppose I should somehow tell the grid to set the column type to imagecolumn but do not know how.


Dim da As New OdbcDataAdapter(tempcommand)
Dim dt As New DataTable
konektitkpen()
da.Fill(dt)
konektitko.Close()
Dim dc As New DataColumn
dc.ColumnName = "Scan"
dt.Columns.Add(dc)
Dim RowCount As Integer = dt.Rows.Count
Dim I As Integer
For I = 0 To RowCount - 1
If dt.Rows(I).Item("File") <> vbNullString Then
dt.Rows(I).Item("Scan") = Image.FromFile("sm.jpg")
End If
Next
DataGridView.DataSource = dt

 

[MondeoST24]

I have the same problem, I want to loop through the rows of the datagridview, check the value of column 4 then select the image to be displayed in column 1.Anyone know how to do it?Thanks

 

[gpoch]

A while ago after much research I found a somewhat close example in C#. It inherited from a datacolumn and created a custom column.

Just a question for myself. How would you add props for the filepath and a default picture (for nulls or no image found)? I would like them accessable from the column propertygrid of the datagridview. I was stuck at trying to pass the values from the column to the cell. Anyway I hope it helps.

[SIZE=2][COLOR=#0000ff]Imports[/COLOR][/SIZE][SIZE=2] System.ComponentModel[/SIZE]
 
[SIZE=2][COLOR=#0000ff]Public [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Class[/COLOR][/SIZE][SIZE=2] DataViewFileImageColumn[/SIZE]
[SIZE=2][COLOR=#0000ff]Inherits[/COLOR][/SIZE][SIZE=2] DataGridViewImageColumn[/SIZE]
 
[SIZE=2][COLOR=#0000ff]Public [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Sub [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]New[/COLOR][/SIZE][SIZE=2]()[/SIZE]
[SIZE=2][COLOR=#0000ff]MyBase[/COLOR][/SIZE][SIZE=2].New()[/SIZE]
 
[SIZE=2][COLOR=#0000ff]Me[/COLOR][/SIZE][SIZE=2].CellTemplate = [/SIZE][SIZE=2][COLOR=#0000ff]New[/COLOR][/SIZE][SIZE=2] DataViewFileImageCell[/SIZE]
[SIZE=2][COLOR=#0000ff]Me[/COLOR][/SIZE][SIZE=2].ValueType = [/SIZE][SIZE=2][COLOR=#0000ff]GetType[/COLOR][/SIZE][SIZE=2]([/SIZE][SIZE=2][COLOR=#0000ff]String[/COLOR][/SIZE][SIZE=2])[/SIZE]
 
[SIZE=2][COLOR=#0000ff]End [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Sub[/COLOR][/SIZE]
[SIZE=2][COLOR=#0000ff]End [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Class[/COLOR][/SIZE]
 
[SIZE=2][COLOR=#0000ff]Public [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Class[/COLOR][/SIZE][SIZE=2] DataViewFileImageCell[/SIZE]
[SIZE=2][COLOR=#0000ff]Inherits[/COLOR][/SIZE][SIZE=2] DataGridViewImageCell[/SIZE]
 
[SIZE=2][COLOR=#008000]' mapping between filename and image[/COLOR][/SIZE]
[SIZE=2][COLOR=#0000ff]Private [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Shared[/COLOR][/SIZE][SIZE=2] dictImages [/SIZE][SIZE=2][COLOR=#0000ff]As [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]New[/COLOR][/SIZE][SIZE=2] Generic.Dictionary([/SIZE][SIZE=2][COLOR=#0000ff]Of [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]String[/COLOR][/SIZE][SIZE=2], Image)[/SIZE]
[SIZE=2][COLOR=#008000]' file path of image[/COLOR][/SIZE]
[SIZE=2][COLOR=#0000ff]Private [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Shared[/COLOR][/SIZE][SIZE=2] filePath [/SIZE][SIZE=2][COLOR=#0000ff]As [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]String[/COLOR][/SIZE][SIZE=2] = IO.Path.GetDirectoryName(Application.ExecutablePath) & [/SIZE][SIZE=2][COLOR=#800000]"\images\"[/COLOR][/SIZE]
 
[SIZE=2][COLOR=#0000ff]Protected [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Overrides [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Function[/COLOR][/SIZE][SIZE=2] GetFormattedValue([/SIZE][SIZE=2][COLOR=#0000ff]ByVal[/COLOR][/SIZE][SIZE=2] value [/SIZE][SIZE=2][COLOR=#0000ff]As [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Object[/COLOR][/SIZE][SIZE=2], _[/SIZE]
[SIZE=2][COLOR=#0000ff]ByVal[/COLOR][/SIZE][SIZE=2] rowIndex [/SIZE][SIZE=2][COLOR=#0000ff]As [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Integer[/COLOR][/SIZE][SIZE=2], [/SIZE][SIZE=2][COLOR=#0000ff]ByRef[/COLOR][/SIZE][SIZE=2] cellStyle [/SIZE][SIZE=2][COLOR=#0000ff]As[/COLOR][/SIZE][SIZE=2] DataGridViewCellStyle, [/SIZE][SIZE=2][COLOR=#0000ff]ByVal[/COLOR][/SIZE][SIZE=2] _[/SIZE]
[SIZE=2]valueTypeConverter [/SIZE][SIZE=2][COLOR=#0000ff]As[/COLOR][/SIZE][SIZE=2] TypeConverter, [/SIZE][SIZE=2][COLOR=#0000ff]ByVal[/COLOR][/SIZE][SIZE=2] formattedValueTypeConverter [/SIZE][SIZE=2][COLOR=#0000ff]As[/COLOR][/SIZE][SIZE=2] TypeConverter, _[/SIZE]
[SIZE=2][COLOR=#0000ff]ByVal[/COLOR][/SIZE][SIZE=2] context [/SIZE][SIZE=2][COLOR=#0000ff]As[/COLOR][/SIZE][SIZE=2] DataGridViewDataErrorContexts) [/SIZE][SIZE=2][COLOR=#0000ff]As [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Object[/COLOR][/SIZE]
 
[SIZE=2][COLOR=#0000ff]If [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]String[/COLOR][/SIZE][SIZE=2].IsNullOrEmpty(value) [/SIZE][SIZE=2][COLOR=#0000ff]Or [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Not[/COLOR][/SIZE][SIZE=2] IO.File.Exists(filePath & value) [/SIZE][SIZE=2][COLOR=#0000ff]Then [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Return [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Nothing[/COLOR][/SIZE]
[SIZE=2][COLOR=#008000]' get the image from the string and return it[/COLOR][/SIZE]
[SIZE=2]LoadImage(value)[/SIZE]
[SIZE=2][COLOR=#008000]' return the mapped image[/COLOR][/SIZE]
[SIZE=2][COLOR=#0000ff]Return[/COLOR][/SIZE][SIZE=2] dictImages([/SIZE][SIZE=2][COLOR=#0000ff]CType[/COLOR][/SIZE][SIZE=2](value, [/SIZE][SIZE=2][COLOR=#0000ff]String[/COLOR][/SIZE][SIZE=2]))[/SIZE]
[SIZE=2][COLOR=#0000ff]End [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Function[/COLOR][/SIZE]
 
[SIZE=2][COLOR=#0000ff]Public [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Shared [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Sub[/COLOR][/SIZE][SIZE=2] LoadImage([/SIZE][SIZE=2][COLOR=#0000ff]ByVal[/COLOR][/SIZE][SIZE=2] value [/SIZE][SIZE=2][COLOR=#0000ff]As[/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Object[/COLOR][/SIZE][SIZE=2])[/SIZE]
[SIZE=2][COLOR=#008000]' load the image from the images directory if it does not exist[/COLOR][/SIZE]
[SIZE=2][COLOR=#0000ff]If[/COLOR][/SIZE][SIZE=2] (dictImages.ContainsKey([/SIZE][SIZE=2][COLOR=#0000ff]CType[/COLOR][/SIZE][SIZE=2](value, [/SIZE][SIZE=2][COLOR=#0000ff]String[/COLOR][/SIZE][SIZE=2])) = [/SIZE][SIZE=2][COLOR=#0000ff]False[/COLOR][/SIZE][SIZE=2]) [/SIZE][SIZE=2][COLOR=#0000ff]Then[/COLOR][/SIZE]
[SIZE=2][COLOR=#008000]' read the image file[/COLOR][/SIZE]
[SIZE=2][COLOR=#0000ff]Dim[/COLOR][/SIZE][SIZE=2] myImage [/SIZE][SIZE=2][COLOR=#0000ff]As[/COLOR][/SIZE][SIZE=2] Image = Image.FromFile(filePath & value)[/SIZE]
[SIZE=2][COLOR=#008000]'assign the image mapping[/COLOR][/SIZE]
[SIZE=2]dictImages([/SIZE][SIZE=2][COLOR=#0000ff]CType[/COLOR][/SIZE][SIZE=2](value, [/SIZE][SIZE=2][COLOR=#0000ff]String[/COLOR][/SIZE][SIZE=2])) = myImage[/SIZE]
 
[SIZE=2][COLOR=#0000ff]End [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]If[/COLOR][/SIZE]
[SIZE=2][COLOR=#0000ff]End [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Sub[/COLOR][/SIZE]
 
[SIZE=2][COLOR=#0000ff]End [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]Class[/COLOR][/SIZE]

 

[MondeoST24]

Thanks for that, there must be an easier way surely?

 

[gpoch]

I do think it's pretty simple. Once you copy these classes into your project.

Need to do the following steps.

1. Set the path where your images are located. Just change the filepath variable.

[COLOR=#0000ff]Private [SIZE=2]Shared[/SIZE][/COLOR][SIZE=2] filePath [/SIZE][SIZE=2][COLOR=#0000ff]As [/COLOR][/SIZE][SIZE=2][COLOR=#0000ff]String[/COLOR][/SIZE][SIZE=2] = IO.Path.GetDirectoryName(Application.ExecutablePath) & [/SIZE][SIZE=2][COLOR=#800000]"\images\"[/COLOR][/SIZE]

2. Build your project
3. Add a datacolumn to your datagridview and select the ColumnType to DataGridViewFileImageColumn.
4. Set the DataPropertyName to your Field of your fileName.

It basically takes your filepath and joins it to the record's fileName, then looks up the image and loads it into your datagrid.

The only other way I could think of is capturing one of the events on the DatagridviewControl before the cell is painted, and do the swap there.