[DEVEXPRESS] Hướng dẫn sử dụng combobox image vào gridview

Hôm nay, mình xin hướng dẫn các bạn cách sử dụng combobox image trong grid view của Devexpress.

Sử dụng, combobox image trong grid view, giúp cho người dùng nhìn trực quan hơn.

Các bạn có thể xem demo ở hình bên dưới:

Đầu tiên, các bạn thiết kế form như hình bên dưới:

- Gồm 1 gridcontrol 

- Và 1 check box

Đầu tiên, chúng ta import thư viện vào

Imports System.Data
Imports System.Data.SqlClient
Imports Microsoft.VisualBasic
Imports System
Imports System.Drawing
Imports System.Collections
Imports System.ComponentModel
Imports System.Windows.Forms
Imports System.IO
Imports DevExpress.XtraGrid.Columns
Imports DevExpress.XtraEditors
Imports DevExpress.XtraEditors.Controls
Imports DevExpress.XtraEditors.Repository
Imports DevExpress.Utils.Controls

Viết sự kiện cho form load

Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        Dim dt As DataTable
        dt = LayDulieu()
        Dim column As GridColumn
        Dim column1 As GridColumn
        Dim column2 As GridColumn
        GridView1.PopulateColumns(dt)
        ' ImageComboBox
        Dim imageCombo As RepositoryItemImageComboBox = TryCast(GridControl1.RepositoryItems.Add("ImageComboBoxEdit"), RepositoryItemImageComboBox)

        Dim images As New DevExpress.Utils.ImageCollection()
        images.AddImage(Image.FromFile("ban.png"))
        images.AddImage(Image.FromFile("tu.png"))
        images.AddImage(Image.FromFile("ghe.png"))
        imageCombo.SmallImages = images
        For Each dr As DataRow In dt.Rows
            If dr("list") = "ban" Then
                imageCombo.Items.Add(New ImageComboBoxItem(dr("name"), dr("name"), 0))
            ElseIf dr("list") = "tu" Then
                imageCombo.Items.Add(New ImageComboBoxItem(dr("name"), dr("name"), 1))
            Else
                imageCombo.Items.Add(New ImageComboBoxItem(dr("name"), dr("name"), 2))
            End If
        Next
        'imageCombo.GlyphAlignment = DevExpress.Utils.HorzAlignment.Center
        column = GridView1.Columns("name")
        column1 = GridView1.Columns("id")
        column2 = GridView1.Columns("list")
        column.ColumnEdit = imageCombo
        column.Caption &= "Tên mặt hàng"
        column1.Caption &= "ID"
        column2.Caption &= "Loại hàng"
        column.ShowButtonMode = DevExpress.XtraGrid.Views.Base.ShowButtonModeEnum.ShowOnlyInEditor
        GridView1.OptionsBehavior.Editable = CheckBox1.Checked
        GridControl1.DataSource = dt
    End Sub

- Tiếp theo, viết sự kiện khi click vào nút chỉnh sửa thì cho phép grid view chỉnh sửa được dữ liệu

Private Sub CheckBox1_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBox1.CheckedChanged
        GridView1.OptionsBehavior.Editable = CheckBox1.Checked
    End Sub

CHÚC CÁC BẠN THÀNH CÔNG!

SOURCE CODE