C# 美化菜單

Windows一成不變的菜單樣式，讓很多開發者，在追求視覺效果時，感到很糾結，可能最常用的方法就是貼圖，或者自己自定義組件來實現。在C#中，微軟提供了Render來對菜單和工具欄進行美化，正好工作中用到了這個，寫出來共享。

新建一個類，定義一個顏色配置類，目前這里只是羅列了各個部分的顏色，大家可以進行保存讀取等操作，來實現換膚的效果。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Drawing;

namespace WindowsApplication1
{
    public class ColorConfig
    {
        private Color _fontcolor = Color.White;
        /// <summary>
        /// 菜單字體顏色
        /// </summary>
        public Color FontColor
        {
            get { return this._fontcolor; }
            set { this._fontcolor = value; }
        }
        private Color _marginstartcolor = Color.FromArgb(113, 113, 113);
        /// <summary>
        /// 下拉菜單坐標圖標區域開始顏色
        /// </summary>
        public Color MarginStartColor
        {
            get { return this._marginstartcolor; }
            set { this._marginstartcolor = value; }
        }
        private Color _marginendcolor = Color.FromArgb(58, 58, 58);
        /// <summary>
        /// 下拉菜單坐標圖標區域結束顏色
        /// </summary>
        public Color MarginEndColor
        {
            get { return this._marginendcolor; }
            set { this._marginendcolor = value; }
        }
        private Color _dropdownitembackcolor = Color.FromArgb(34, 34, 34);
        /// <summary>
        /// 下拉項背景顏色
        /// </summary>
        public Color DropDownItemBackColor
        {
            get { return this._dropdownitembackcolor; }
            set { this._dropdownitembackcolor = value; }
        }
        private Color _dropdownitemstartcolor = Color.Orange;
        /// <summary>
        /// 下拉項選中時開始顏色
        /// </summary>
        public Color DropDownItemStartColor
        {
            get { return this._dropdownitemstartcolor; }
            set { this._dropdownitemstartcolor = value; }
        }
        private Color _dorpdownitemendcolor = Color.FromArgb(160,100,20);
        /// <summary>
        /// 下拉項選中時結束顏色
        /// </summary>
        public Color DropDownItemEndColor
        {
            get { return this._dorpdownitemendcolor; }
            set { this._dorpdownitemendcolor = value; }
        }
        private Color _menuitemstartcolor = Color.FromArgb(52, 106, 159);
        /// <summary>
        /// 主菜單項選中時的開始顏色
        /// </summary>
        public Color MenuItemStartColor
        {
            get { return this._menuitemstartcolor; }
            set { this._menuitemstartcolor = value; }
        }
        private Color _menuitemendcolor = Color.FromArgb(73, 124, 174);
        /// <summary>
        /// 主菜單項選中時的結束顏色
        /// </summary>
        public Color MenuItemEndColor
        {
            get { return this._menuitemendcolor; }
            set { this._menuitemendcolor = value; }
        }
        private Color _separatorcolor = Color.Gray;
        /// <summary>
        /// 分割線顏色
        /// </summary>
        public Color SeparatorColor
        {
            get { return this._separatorcolor; }
            set { this._separatorcolor = value; }
        }
        private Color _mainmenubackcolor = Color.Black;
        /// <summary>
        /// 主菜單背景色
        /// </summary>
        public Color MainMenuBackColor
        {
            get { return this._mainmenubackcolor; }
            set { this._mainmenubackcolor = value; }
        }
        private Color _mainmenustartcolor = Color.FromArgb(93, 93, 93);
        /// <summary>
        /// 主菜單背景開始顏色
        /// </summary>
        public Color MainMenuStartColor
        {
            get { return this._mainmenustartcolor; }
            set { this._mainmenustartcolor = value; }
        }
        private Color _mainmenuendcolor = Color.FromArgb(34, 34, 34);
        /// <summary>
        /// 主菜單背景結束顏色
        /// </summary>
        public Color MainMenuEndColor
        {
            get { return this._mainmenuendcolor; }
            set { this._mainmenuendcolor = value; }
        }
        private Color _dropdownborder = Color.FromArgb(40, 96, 151);
        /// <summary>
        /// 下拉區域邊框顏色
        /// </summary>
        public Color DropDownBorder
        {
            get { return this._dropdownborder; }
            set { this._dropdownborder = value; }
        }
    }
}

 

新建一個類，我們從ToolStripProfessionalRenderer繼承一個Render

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows.Forms;
using System.Drawing;
using System.Drawing.Drawing2D;

namespace WindowsApplication1
{
    public class MyMenuRender : ToolStripProfessionalRenderer
    {
        ColorConfig colorconfig = new ColorConfig();//創建顏色配置類
        /// <summary>
        /// 渲染整個背景
        /// </summary>
        /// <param name="e"></param>
        protected override void OnRenderToolStripBackground(ToolStripRenderEventArgs e)
        {
            e.ToolStrip.ForeColor = colorconfig.FontColor;
            //如果是下拉
            if (e.ToolStrip is ToolStripDropDown)
            {
                e.Graphics.FillRectangle(new SolidBrush(colorconfig.DropDownItemBackColor), e.AffectedBounds);
            }
            //如果是菜單項
            else if (e.ToolStrip is MenuStrip)
            {
                Blend blend = new Blend();
                float[] fs = new float[5] { 0f, 0.3f, 0.5f, 0.8f, 1f };
                float[] f = new float[5] { 0f, 0.5f, 0.9f, 0.5f, 0f };
                blend.Positions = fs;
                blend.Factors = f;
                FillLineGradient(e.Graphics, e.AffectedBounds, colorconfig.MainMenuStartColor, colorconfig.MainMenuEndColor, 90f, blend);
            }
            else
            {
                base.OnRenderToolStripBackground(e);
            }
        }
        /// <summary>
        /// 渲染下拉左側圖標區域
        /// </summary>
        /// <param name="e"></param>
        protected override void OnRenderImageMargin(ToolStripRenderEventArgs e)
        {
            FillLineGradient(e.Graphics, e.AffectedBounds, colorconfig.MarginStartColor, colorconfig.MarginEndColor, 0f, null);
        }
        /// <summary>
        /// 渲染菜單項的背景
        /// </summary>
        /// <param name="e"></param>
        protected override void OnRenderMenuItemBackground(ToolStripItemRenderEventArgs e)
        {
            if (e.ToolStrip is MenuStrip)
            {
                //如果被選中或被按下
                if (e.Item.Selected || e.Item.Pressed)
                {
                    Blend blend = new Blend();
                    float[] fs = new float[5] { 0f, 0.3f, 0.5f, 0.8f, 1f };
                    float[] f = new float[5] { 0f, 0.5f, 1f, 0.5f, 0f };
                    blend.Positions = fs;
                    blend.Factors = f;
                    FillLineGradient(e.Graphics, new Rectangle(0, 0, e.Item.Size.Width, e.Item.Size.Height), colorconfig.MenuItemStartColor, colorconfig.MenuItemEndColor, 90f, blend);
                }
                else
                    base.OnRenderMenuItemBackground(e);
            }
            else if (e.ToolStrip is ToolStripDropDown)
            {
                if (e.Item.Selected)
                {
                    FillLineGradient(e.Graphics, new Rectangle(0, 0, e.Item.Size.Width, e.Item.Size.Height), colorconfig.DropDownItemStartColor, colorconfig.DropDownItemEndColor, 90f, null);
                }
            }
            else
            {
                base.OnRenderMenuItemBackground(e);
            }
        }
        /// <summary>
        /// 渲染菜單項的分隔線
        /// </summary>
        /// <param name="e"></param>
        protected override void OnRenderSeparator(ToolStripSeparatorRenderEventArgs e)
        {
            e.Graphics.DrawLine(new Pen(colorconfig.SeparatorColor), 0, 2, e.Item.Width, 2);
        }
        /// <summary>
        /// 渲染邊框
        /// </summary>
        /// <param name="e"></param>
        protected override void OnRenderToolStripBorder(ToolStripRenderEventArgs e)
        {
            if (e.ToolStrip is ToolStripDropDown)
            {
                e.Graphics.DrawRectangle(new Pen(colorconfig.DropDownBorder), new Rectangle(0,0,e.AffectedBounds.Width-1,e.AffectedBounds.Height-1));
            }
            else
            {
                base.OnRenderToolStripBorder(e);
            }
        }
        /// <summary>
        /// 渲染箭頭
        /// </summary>
        /// <param name="e"></param>
        protected override void OnRenderArrow(ToolStripArrowRenderEventArgs e)
        {
            e.ArrowColor = Color.Red;//設置為紅色，當然還可以 畫出各種形狀
            base.OnRenderArrow(e);
        }
        /// <summary>
        /// 填充線性漸變
        /// </summary>
        /// <param name="g">畫布</param>
        /// <param name="rect">填充區域</param>
        /// <param name="startcolor">開始顏色</param>
        /// <param name="endcolor">結束顏色</param>
        /// <param name="angle">角度</param>
        /// <param name="blend">對象的混合圖案</param>
        private void FillLineGradient(Graphics g, Rectangle rect, Color startcolor, Color endcolor, float angle, Blend blend)
        {
            LinearGradientBrush linebrush = new LinearGradientBrush(rect, startcolor, endcolor, angle);
            if (blend != null)
            {
                linebrush.Blend = blend;
            }
            GraphicsPath path = new GraphicsPath();
            path.AddRectangle(rect);
            g.SmoothingMode = SmoothingMode.AntiAlias;
            g.FillPath(linebrush, path);
        }
    }
}

 

新建一個組件，繼承自MenuStrip，作為我們的自定義菜單

 

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Diagnostics;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace WindowsApplication1
{
    public partial class MyMenu : MenuStrip
    {
        public MyMenu()
        {
            InitializeComponent();
            this.Renderer = new MyMenuRender();//設置渲染
        }

        public MyMenu(IContainer container)
        {
            container.Add(this);

            InitializeComponent();
            this.Renderer = new MyMenuRender();//設置渲染
        }
    }
}

　　

 

好了，編譯項目，你會在左側工具欄中看到MyMenu的組件，拖一個上去就可以使用了，其實直接設置自帶的MenuStrip的Render屬性也可以，比如設置彈出菜單的渲染

contextMenuStrip1.Renderer = new JRJMenuRender();