讓ComboBox顯示圖片--PictureComboBox

WinForm程序，讓ComboBox的項顯示為圖片和文字來提高用戶體驗。

主要實現方式為重寫ComboBox的OnDrawItem方法，自己進行ComboBox項的繪制。

效果圖：

實現步驟如下：

1.寫一個類ComboBoxEx繼承自ComboBox 

 

2.在ComboBoxEx構造函數中添加默認屬性

      public ComboBoxEx()
        {
            DrawMode = DrawMode.OwnerDrawFixed;
            DropDownStyle = ComboBoxStyle.DropDownList;
            ItemHeight = 50;
            Width = 200;
         }

3.在ComboBoxEx類中添加內部類ItemEx

public class ItemEx
        {
            public ItemEx(string text, Image img)
            {
                Text = text;
                Image = img;
            }

            public string Text { get; set; }
            public Image Image { get; set; }

            public override string ToString()
            {
                return Text;
            }
        }

4.重寫ComboBox的OnDrawItem方法

　　a.畫鼠標選中時的邊框，使選項有選中的狀態以區別未選中的項

            if ((e.State & DrawItemState.Selected) != 0)
            {
                //漸變畫刷
                LinearGradientBrush brush = new LinearGradientBrush(e.Bounds, Color.FromArgb(255, 251, 237),
                                                 Color.FromArgb(255, 236, 181), LinearGradientMode.Vertical);
                //填充區域
                Rectangle borderRect = new Rectangle(3, e.Bounds.Y, e.Bounds.Width - 5, e.Bounds.Height - 2);

                e.Graphics.FillRectangle(brush, borderRect);

                //畫邊框
                Pen pen = new Pen(Color.FromArgb(229, 195, 101));
                e.Graphics.DrawRectangle(pen, borderRect);
            }
            else
            {
                SolidBrush brush = new SolidBrush(Color.FromArgb(255, 255, 255));
                e.Graphics.FillRectangle(brush, e.Bounds);
            }

　　b.繪制圖片

//獲得項圖片,繪制圖片
            ItemEx item = (ItemEx)Items[e.Index];
            Image img = item.Image;

            //圖片繪制的區域
            Rectangle imgRect = new Rectangle(6, e.Bounds.Y + 3, 45, 45);
            e.Graphics.DrawImage(img, imgRect);

　　c.繪制文本

            //文本內容顯示區域
            Rectangle textRect =
                    new Rectangle(imgRect.Right + 2, imgRect.Y, e.Bounds.Width - imgRect.Width, e.Bounds.Height - 2);

            //獲得項文本內容,繪制文本
            String itemText = Items[e.Index].ToString();

            //文本格式垂直居中
            StringFormat strFormat = new StringFormat();
            strFormat.LineAlignment = StringAlignment.Center;
            e.Graphics.DrawString(itemText, new Font("微軟雅黑", 12), Brushes.Black, textRect, strFormat);

至此PictureComboBox已完成！

整個代碼如下：

    public class ComboBoxEx : ComboBox
    {
        public ComboBoxEx()
        {
            DrawMode = DrawMode.OwnerDrawFixed;
            DropDownStyle = ComboBoxStyle.DropDownList;
            ItemHeight = 50;
            Width = 200;
         }

        protected override void OnDrawItem(DrawItemEventArgs e)
        {
            if (Items.Count == 0||e.Index==-1)
                return;
            if ((e.State & DrawItemState.Selected) != 0)
            {
                //漸變畫刷
                LinearGradientBrush brush = new LinearGradientBrush(e.Bounds, Color.FromArgb(255, 251, 237),
                                                 Color.FromArgb(255, 236, 181), LinearGradientMode.Vertical);
                //填充區域
                Rectangle borderRect = new Rectangle(3, e.Bounds.Y, e.Bounds.Width - 5, e.Bounds.Height - 2);

                e.Graphics.FillRectangle(brush, borderRect);

                //畫邊框
                Pen pen = new Pen(Color.FromArgb(229, 195, 101));
                e.Graphics.DrawRectangle(pen, borderRect);
            }
            else
            {
                SolidBrush brush = new SolidBrush(Color.FromArgb(255, 255, 255));
                e.Graphics.FillRectangle(brush, e.Bounds);
            }

            //獲得項圖片,繪制圖片
            ItemEx item = (ItemEx)Items[e.Index];
            Image img = item.Image;

            //圖片繪制的區域
            Rectangle imgRect = new Rectangle(6, e.Bounds.Y + 3, 45, 45);
            e.Graphics.DrawImage(img, imgRect);

            //文本內容顯示區域
            Rectangle textRect =
                    new Rectangle(imgRect.Right + 2, imgRect.Y, e.Bounds.Width - imgRect.Width, e.Bounds.Height - 2);

            //獲得項文本內容,繪制文本
            String itemText = Items[e.Index].ToString();

            //文本格式垂直居中
            StringFormat strFormat = new StringFormat();
            strFormat.LineAlignment = StringAlignment.Center;
            e.Graphics.DrawString(itemText, new Font("微軟雅黑", 12), Brushes.Black, textRect, strFormat);
            base.OnDrawItem(e);
        }
        /// <summary>
        /// 內部類
        /// </summary>
        public class ItemEx
        {
            public ItemEx(string text, Image img)
            {
                Text = text;
                Image = img;
            }

            public string Text { get; set; }
            public Image Image { get; set; }

            public override string ToString()
            {
                return Text;
            }
        }
    }

5.測試

        public Form1()
        {
            InitializeComponent();
            comboBoxEx1.Items.Add(new PictureComboBox.ComboBoxEx.ItemEx("000000", Image.FromFile(Application.StartupPath + "\\0.gif")));
            comboBoxEx1.Items.Add(new PictureComboBox.ComboBoxEx.ItemEx("111111", Image.FromFile(Application.StartupPath + "\\1.gif")));
            comboBoxEx1.Items.Add(new PictureComboBox.ComboBoxEx.ItemEx("222222", Image.FromFile(Application.StartupPath + "\\2.gif")));
            comboBoxEx1.Items.Add(new PictureComboBox.ComboBoxEx.ItemEx("333333", Image.FromFile(Application.StartupPath + "\\3.gif")));
        }

 

轉載請注明出處:http://www.cnblogs.com/refactor/