VB.NET中DataGridView自动完成下拉框定制与故障排查

一、下拉宽度调整：能否用DataGridView列宽方案？ #

不能。DataGridView列宽仅控制单元格自身宽度，而AutoComplete下拉列表/ComboBox下拉列表是独立控件，需单独处理：

• TextBox AutoComplete下拉：原生控件无法直接设置宽度，需调用Windows API SHAutoComplete配置，或自定义下拉控件替换原生实现。
• ComboBox下拉：计算下拉列表中最长文本的宽度，赋值给DropDownWidth属性：

  ' 计算最长项宽度
  Dim maxWidth As Integer = 0
  Using g As Graphics = cbo.CreateGraphics()
      For Each item In cbo.Items
          Dim width As Integer = CInt(g.MeasureString(item.ToString(), cbo.Font).Width)
          If width > maxWidth Then maxWidth = width
      Next
  End Using
  cbo.DropDownWidth = maxWidth + 20 ' 加边距
  

二、修改下拉框背景色 #

• TextBox AutoComplete下拉：原生系统级下拉样式无法直接修改，需自定义下拉控件实现。
• ComboBox下拉：设置DrawMode = OwnerDrawFixed，在DrawItem事件中自定义绘制背景：

  Private Sub ComboBox_DrawItem(sender As Object, e As DrawItemEventArgs)
      ' 绘制背景
      If (e.State And DrawItemState.Selected) = DrawItemState.Selected Then
          e.Graphics.FillRectangle(Brushes.LightBlue, e.Bounds)
      Else
          e.Graphics.FillRectangle(Brushes.White, e.Bounds)
      End If
      ' 绘制文本（省略图标/文本逻辑）
      e.DrawFocusRectangle()
  End Sub
  

三、添加图标图片 #

• TextBox AutoComplete下拉：原生不支持，需自定义下拉控件，在列表项中绘制图标。
• ComboBox下拉：通过OwnerDraw模式，在DrawItem事件中绘制图标：

  ' 假设已有图标资源（如Resources.Icon1）
  Private Sub ComboBox_DrawItem(sender As Object, e As DrawItemEventArgs)
      e.DrawBackground()
      If e.Index >= 0 Then
          Dim item = DirectCast(cbo.Items(e.Index), ProductFinal)
          ' 绘制图标
          e.Graphics.DrawImage(My.Resources.Icon1, e.Bounds.X, e.Bounds.Y, 16, 16)
          ' 绘制文本，偏移图标位置
          e.Graphics.DrawString($"{item.ProductName} {item.Unit}", e.Font, Brushes.Black, e.Bounds.X + 20, e.Bounds.Y)
      End If
      e.DrawFocusRectangle()
  End Sub
  

四、ComboBox下拉框无法显示的修复 #

问题出在代码未给ComboBox的Items集合添加数据，且需确保列类型为DataGridViewComboBoxColumn：

1. 初始化列类型 #

在OnLoad中添加：

' 禁用自动生成列，手动添加ComboBox列
DataGridView1.AutoGenerateColumns = False
Dim cboCol As New DataGridViewComboBoxColumn()
cboCol.Name = "ProductName"
cboCol.HeaderText = "Product Name"
DataGridView1.Columns.Add(cboCol)
Dim unitCol As New DataGridViewTextBoxColumn()
unitCol.Name = "Unit"
unitCol.HeaderText = "Unit"
unitCol.ReadOnly = True
DataGridView1.Columns.Add(unitCol)

2. 修改EditingControlShowing事件 #

Private Sub DataGridView1_EditingControlShowing(
    sender As Object,
    e As DataGridViewEditingControlShowingEventArgs) Handles _
    DataGridView1.EditingControlShowing
    If TypeOf e.Control Is ComboBox Then
        Dim dgv = DirectCast(sender, DataGridView)
        Dim cbo = DirectCast(e.Control, ComboBox)         
        If dgv.CurrentCell.ColumnIndex = dgv.Columns("ProductName").Index Then
            If cbo.Items.Count = 0 Then
                cbo.DropDownStyle = ComboBoxStyle.DropDown
                cbo.AutoCompleteSource = AutoCompleteSource.ListItems
                ' 给Items添加数据，而非仅AutoCompleteCustomSource
                cbo.Items.AddRange(dictProducts.Keys.ToArray())
                cbo.AutoCompleteCustomSource.AddRange(dictProducts.Keys.ToArray())
                ' 绑定绘制事件（用于图标和背景色）
                AddHandler cbo.DrawItem, AddressOf ComboBox_DrawItem
            End If
            cbo.AutoCompleteMode = AutoCompleteMode.Suggest
        Else
            cbo.AutoCompleteMode = AutoCompleteMode.None
        End If
    End If
End Sub

五、☑️字体图标正常显示的处理 #

1. 确保字体支持：使用支持emoji的字体（如Segoe UI Emoji）；
2. 自定义绘制图标：在ComboBox的DrawItem事件中绘制：

Private Sub ComboBox_DrawItem(sender As Object, e As DrawItemEventArgs)
    Dim cbo = DirectCast(sender, ComboBox)
    e.DrawBackground()
    If e.Index >= 0 Then
        Dim itemText = cbo.Items(e.Index).ToString()
        ' 使用Segoe UI Emoji字体绘制图标
        Using emojiFont As New Font("Segoe UI Emoji", e.Font.Size)
            e.Graphics.DrawString("☑️", emojiFont, Brushes.Green, e.Bounds.X, e.Bounds.Y)
        End Using
        ' 绘制文本，偏移图标宽度
        e.Graphics.DrawString(itemText, e.Font, Brushes.Black, e.Bounds.X + 20, e.Bounds.Y)
    End If
    e.DrawFocusRectangle()
End Sub

也可以修改ProductFinal.ToString()直接包含图标：

Public Class ProductFinal
    Public Property ProductName As String
    Public Property Unit As String

    Public Overrides Function ToString() As String
        Return $"☑️ {ProductName} {Unit}"
    End Function
End Class

内容的提问来源于stack exchange，提问作者dlaksmi