C#--自定义控件-panel控件（渐变色，文字的绘制）

以下是学习笔记：

参考：https://www.bilibili.com/video/BV1eQ4y1M7ZY?p=3

 

自定义控件开发的思路：属性，事件，Paint(重写），这三个不一定都要有的

效果：

 

用途：分类显示内容的场景

一，自定义控件

1，添加“组件类”

,2，根据自定义控件的功能修改继承

 

 3，代码如下：

namespace Jason_Controls
{
    public partial class JasonPanel : Panel
    {
        public JasonPanel()
        {
            InitializeComponent();
        }

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

            InitializeComponent();
        }

        #region 属性

        private Color headBackColor=Color.LimeGreen;
        [Category("Jason控件自定义属性")]
        [Description("标题的背景颜色")]
        public Color HeadBackColor
        {
            get { return headBackColor; }
            set
            {
                headBackColor = value; 
                this.Invalidate();
            }
        }

        private Color headForeColor = Color.Black;
        [Category("Jason控件自定义属性")]
        [Description("标题的前景颜色")]
        public Color HeadForeColor
        {
            get { return headForeColor; }
            set
            {
                headForeColor = value;
                this.Invalidate();
            }
        }

        private int headHeight = 30;
        [Category("Jason控件自定义属性")]
        [Description("标题的高度")]
        public int HeadHeight
        {
            get { return headHeight; }
            set
            {
                headHeight = value;
                this.Invalidate();
            }
        }

        private string headText = "标题名称";
        [Category("Jason控件自定义属性")]
        [Description("标题的内容")]
        public string HeadText
        {
            get { return headText; }
            set
            {
                headText = value;
                this.Invalidate();
            }
        }

        private float linearScale= 0.4f;
        [Category("Jason控件自定义属性")]
        [Description("渐变的程度")]
        public float LinearScale
        {
            get { return linearScale; }
            set
            {
                linearScale = value;
                this.Invalidate();
            }
        }


        #endregion

        #region 字段
        //画布
        private Graphics g;
        //画笔
        private Pen p;
        //画刷
        private SolidBrush sb;
       
        #endregion

        #region 绘制过程

        protected override void OnPaint(PaintEventArgs e)
        {
            base.OnPaint(e);

            //自定义绘制过程

            //获取画布
            g = e.Graphics;

            //设置画布
            SetGraphics(g);

            //绘制过程

            //【1】画标题框

            //LinearGradientBrush渐变色的画刷,有四个参数
            //参数1：new PointF(0, 0)左上角
            //参数2：new PointF(0, this.headHeight) 左下角
            //参数1和参数2说是从上往下渐变
            //参数3：渐变的第一个颜色
            //参数4：渐变的第二个颜色
            using (LinearGradientBrush brush = new LinearGradientBrush(new PointF(0, 0), new PointF(0, this.headHeight),
                setStartLinearColor(this.headBackColor), this.headBackColor))
            {
                //填充矩形
                g.FillRectangle(brush,new Rectangle(0,0,this.Width,this.headHeight));//参数1：画刷 参数2：矩形
            }
            
            //【2】绘制文字
            StringFormat sf=new StringFormat();//格式
            sf.Alignment = StringAlignment.Center;//水平居中
            sf.LineAlignment = StringAlignment.Center;//垂直居中
            using (SolidBrush sb=new SolidBrush(this.headForeColor))
            {
                g.DrawString(this.headText,this.Font,sb, new Rectangle(0, 0, this.Width, this.headHeight),sf);
            }

            //【3】绘制边框
            using (Pen p =new Pen(this.headForeColor))
            {
                //g.DrawRectangle(p, 0, 0, this.Width, this.Height);//只显示一半，原因：默认的笔有1个像素的宽度，画的矩形超过了控件的1个像素的，就画出去啦
                g.DrawRectangle(p, 0, 0, this.Width - 1, this.Height - 1);               
                g.DrawLine(p,0,this.headHeight,this.Width-1,this.headHeight);
            }

            


        }

        private Color setStartLinearColor(Color EndLinearColor)
        {
            return Color.FromArgb((int)(EndLinearColor.R + (255 - EndLinearColor.R) * this.linearScale),
                (int)(EndLinearColor.G + (255 - EndLinearColor.G) * this.linearScale),
                (int) (EndLinearColor.B + (255 - EndLinearColor.B) * this.linearScale));
        }


        #endregion


        #region 设置画布属性的方法

        private void SetGraphics(Graphics g)
        {
            //设置画布的属性
            g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;//消除锯齿
            g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;//高质量显示

            g.TextRenderingHint = System.Drawing.Text.TextRenderingHint.ClearTypeGridFit;//字体，是字体更加清晰
            g.TextRenderingHint = System.Drawing.Text.TextRenderingHint.AntiAlias;//字体消除锯齿
        }

        #endregion
    }
}

　　

二，绘制过程讲解

1，绘制过程

 

 

 

1，渐变方向的说明：

 

 

3，渐变颜色的通用算法

        private Color setStartLinearColor(Color EndLinearColor)
        {
            return Color.FromArgb((int)(EndLinearColor.R + (255 - EndLinearColor.R) * this.linearScale),
                (int)(EndLinearColor.G + (255 - EndLinearColor.G) * this.linearScale),
                (int) (EndLinearColor.B + (255 - EndLinearColor.B) * this.linearScale));
        }

　　

渐变程度设置到0.6左右，渐变效果好看些

 

 

4，给整个控件画边框的说明：