How to: Create ImageComboBoxEdit Control at Runtime

• Oct 25, 2019
• 3 minutes to read

The following code shows how to create an ImageComboBoxEdit control at runtime. In the custom AddItems method, several items are added using the ImageComboBoxItemCollection.Add method. For each item, we specify the caption, value and image index. The ImageCollection that stores images for items is created and populated at design time. It is assigned to the RepositoryItemImageComboBox.SmallImages property, providing images for items.

The ComboBoxEdit.SelectedIndexChanged event is used to display information on the selected item. The event handler displays the caption, value and index of the selected item in the form’s title.

The following image shows the form when the last item is selected.

C#

using DevExpress.Utils;
using DevExpress.XtraEditors;
using DevExpress.XtraEditors.Controls;

//ImageCollection storing images for items
private DevExpress.Utils.ImageCollection imageCollection1;

//image combo box editor created at runtime
DevExpress.XtraEditors.ImageComboBoxEdit rtImageComboBox;

private void Form1_Load(object sender, EventArgs e) {
    rtImageComboBox = CreateImageComboBoxEdit(new Rectangle(220, 10, 120, 20), this);
    AddItems(rtImageComboBox, imageCollection1);
    //select the last item
    rtImageComboBox.SelectedIndex = rtImageComboBox.Properties.Items.Count - 1;
}

//create the editor
private ImageComboBoxEdit CreateImageComboBoxEdit(Rectangle bounds, Control container) {
    ImageComboBoxEdit editor = new ImageComboBoxEdit();
    editor.Bounds = bounds;
    container.Controls.Add(editor);
    editor.SelectedIndexChanged += new EventHandler(imageComboBoxEdit_SelectedIndexChanged);
    return editor;
}

//add items
private void AddItems(ImageComboBoxEdit editor, ImageCollection imgList) {
    for (int i = 0; i < 7; i++)
        editor.Properties.Items.Add(new ImageComboBoxItem("Item " + (i + 1).ToString(), i, i));
    editor.Properties.SmallImages = imgList;
}

//display information on the selected item
void imageComboBoxEdit_SelectedIndexChanged(object sender, EventArgs e) {
    ImageComboBoxEdit editor = sender as ImageComboBoxEdit;
    this.Text = "SelectedIndexChanged: index " + editor.SelectedIndex.ToString() +
        " / value " + editor.EditValue.ToString() + " / display text " + editor.Text;
}

VB.NET

Imports DevExpress.Utils
Imports DevExpress.XtraEditors
Imports DevExpress.XtraEditors.Controls

'image combo box editor created at runtime
Private rtImageComboBox As DevExpress.XtraEditors.ImageComboBoxEdit

Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) _
  Handles MyBase.Load
    rtImageComboBox = CreateImageComboBoxEdit(New Rectangle(220, 10, 120, 20), Me)
    AddItems(rtImageComboBox, imageList1)
    rtImageComboBox.SelectedIndex = rtImageComboBox.Properties.Items.Count - 1
End Sub

'create the editor
Private Function CreateImageComboBoxEdit(ByVal bounds As Rectangle, _
  ByVal container As Control) As ImageComboBoxEdit
    Dim editor As New ImageComboBoxEdit
    editor.Bounds = bounds
    container.Controls.Add(editor)
    AddHandler editor.SelectedIndexChanged, _
      New EventHandler(AddressOf imageComboBoxEdit_SelectedIndexChanged)
    Return editor
End Function

'add items
Private Sub AddItems(ByVal editor As DevExpress.XtraEditors.ImageComboBoxEdit, _
  ByVal imgList As ImageCollection)
    For i As Integer = 0 To 6
        editor.Properties.Items.Add(New ImageComboBoxItem("Item " & (i + 1).ToString(), i, i))
    Next
    editor.Properties.SmallImages = imgList
End Sub

'display information on a selected item
Sub imageComboBoxEdit_SelectedIndexChanged(ByVal sender As Object, _
  ByVal e As EventArgs)
    Dim editor As ImageComboBoxEdit = CType(sender, ImageComboBoxEdit)
    Me.Text = "SelectedIndexChanged: index " + editor.SelectedIndex.ToString() + _
     " / value " + editor.EditValue.ToString() + " / display text " + editor.Text
End Sub