Xin chào các bạn, bài viết hôm nay mình sẽ hướng dẫn các bạn sử dụng Image Combobox Edit trong Devexpress c# winform.

[DEVEXPRESS] USING IMAGECOMBOBOXEDIT C# WINFORM

ImageComboxEdit giúp người dùng khi chọn giá trị nhìn trực quan và đẹp mắt.

Dưới đây là giao diện demo ứng dụng sử dụng ImageComboboxEdit C#:

Để sử dụng các bạn cần tạo ra 1 SvgImageCollection và thêm những icon thích hợp vào nhé.

Ở bài viết này, mình sử dụng hình ảnh Svg nên dễ dàng thay đổi kích thước hình ảnh 32x32 sang 16x16 một cách dễ dàng.

Mình cũng demo tích hợp 3 trạng thái Image Alignment: Near, Far, Center.

Full source code ImageComboboxEdit Devexpress C#:

using DevExpress.Utils;
using DevExpress.XtraEditors.Controls;
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace ImageComboboxEdit
{
    public partial class Form1 : DevExpress.XtraEditors.XtraForm
    {
        public Form1()
        {
            InitializeComponent();
            icbAlignment.Properties.Items.AddEnum(typeof(HorzAlignment));

            imageComboBoxEdit.Properties.Items.AddRange(new ImageComboBoxItem[] {
            new ImageComboBoxItem("Time", 0, 0),
            new ImageComboBoxItem("Design", 1, 1),
            new ImageComboBoxItem("Mail", 2, 2),
            new ImageComboBoxItem("Pie", 3, 3),
            new ImageComboBoxItem("Home", 4, 4),
            new ImageComboBoxItem("Tag", 5, 5),
            new ImageComboBoxItem("Contact", 6, 6),
            new ImageComboBoxItem("Database", 7, 7),
            new ImageComboBoxItem("Task", 8, 8),
            new ImageComboBoxItem("Video", 9, 9)});
            imageComboBoxEdit.Properties.SmallImages = svgImageCollection1;

            imageComboBoxEdit.EditValue = 3;
            icbAlignment.EditValue = imageComboBoxEdit.Properties.GlyphAlignment;
        }

        private void chkLargeImage_CheckedChanged(object sender, EventArgs e)
        {
            svgImageCollection1.ImageSize = chkLargeImage.Checked == true ? new Size(32, 32) : new Size(16, 16);

            imageComboBoxEdit.Properties.LargeImages = chkLargeImage.Checked == true ? svgImageCollection1 : null;
        }

        private void icbAlignment_SelectedIndexChanged(object sender, EventArgs e)
        {
            imageComboBoxEdit.Properties.GlyphAlignment = (HorzAlignment)icbAlignment.EditValue;
        }
    }
}

Thanks for watching!

DOWNLOAD SOURCE