按钮垂直居中_C#控件美化之路(5)：图标按钮各类样式

上一篇文章已经将图标文字绘制完成。

在一般软件开发中，常用按钮一般不止，一个靠左图标和靠左文字。

常用的一般三种按钮。文字靠下图标居上居中，文字浮现在图标上方。如上图。

公有属性

        [Category("Wen")]        [DefaultValue(TextImageRelation.ImageBeforeText)]        public TextImageRelation TextImageRelation { get; set; } = TextImageRelation.ImageBeforeText;

上一篇文章已经提到如何绘制一个图标，也详细解释了如何使得图标垂直居中。本文不做详细解释。

贴关键代码

第一个：绘制按钮居中，按钮居中

                //图标绘制靠上居中                recimage = new Rectangle((this.Width - ImageSize.Width) / 2,                                         (this.Height - ImageSize.Height) / 2,                                          ImageSize.Width,                                          ImageSize.Height);                recString = new Rectangle(0,                                           3 + ImageSize.Height,                                          this.Width,                                           this.Height - 3 - ImageSize.Height);                if (Image != null)                    g.DrawImage(Image, recimage);                g.DrawString(this.Text, Font, brush, rec, ControlHelper.StringContersCenter);

贴上一个比较常用的属性，可以做一个常用静态帮助类

        ///         /// 绘制文字，垂直居中，水平靠左        ///         public static StringFormat StringConters { get; set; }            = new StringFormat(StringFormatFlags.NoClip | StringFormatFlags.NoWrap)            {                LineAlignment = StringAlignment.Center,                Trimming = StringTrimming.EllipsisCharacter            };        ///         /// 绘制文字，垂直居中，水平居中        ///         public static StringFormat StringContersCenter { get; set; }            = new StringFormat(StringFormatFlags.NoClip | StringFormatFlags.NoWrap)            {                LineAlignment = StringAlignment.Center,                Alignment = StringAlignment.Center,                Trimming = StringTrimming.EllipsisCharacter            };

以后绘制文字时候就不用每次都写很长一段代码。

第二个：绘制图标考上居中，文字靠下居中

                //图标绘制靠上居中                recimage = new Rectangle((this.Width - ImageSize.Width) / 2,                                         3,                                          ImageSize.Width,                                          ImageSize.Height);                recString = new Rectangle(0,                                           3 + ImageSize.Height,                                           this.Width,                                           this.Height - 3 - ImageSize.Height);                if (Image != null)                    g.DrawImage(Image, recimage);                g.DrawString(this.Text, Font, brush, recString, ControlHelper.StringContersCenter);

到目前位置一个完整的按钮绘制完成

贴上完整代码块。小伙伴可以直接诶复制粘贴开箱即用。

        protected override void OnPaint(PaintEventArgs e)        {            base.OnPaint(e);            Graphics g = e.Graphics;            Rectangle rec = this.ClientRectangle;            Rectangle recimage = Rectangle.Empty;            Rectangle recString = Rectangle.Empty;            Brush brush = new SolidBrush(this.ForeColor);            if (TextImageRelation == TextImageRelation.ImageAboveText)            {                //图标绘制靠上居中                recimage = new Rectangle((this.Width - ImageSize.Width) / 2, 3, ImageSize.Width, ImageSize.Height);                recString = new Rectangle(0, 3 + ImageSize.Height, this.Width, this.Height - 3 - ImageSize.Height);                if (Image != null)                    g.DrawImage(Image, recimage);                g.DrawString(this.Text, Font, brush, recString, ControlHelper.StringContersCenter);            }            else if (TextImageRelation == TextImageRelation.Overlay || Image == null)            {                //图标绘制靠上居中                recimage = new Rectangle((this.Width - ImageSize.Width) / 2, (this.Height - ImageSize.Height) / 2, ImageSize.Width, ImageSize.Height);                recString = new Rectangle(0, 3 + ImageSize.Height, this.Width, this.Height - 3 - ImageSize.Height);                if (Image != null)                    g.DrawImage(Image, recimage);                g.DrawString(this.Text, Font, brush, rec, ControlHelper.StringContersCenter);            }            else            {                //其他都是图标坐标文字靠图标                recimage = new Rectangle(2, (this.Height - ImageSize.Height) / 2, ImageSize.Width, ImageSize.Height);                recString = new Rectangle(2 + ImageSize.Width + 2, 0, this.Width - ImageSize.Width - 6, this.Height);                if (Image != null)                    g.DrawImage(Image, recimage);                g.DrawString(this.Text, Font, brush, recString, ControlHelper.StringConters);            }            if (this.BorderStyle == BorderStyle.FixedSingle)            {                System.Drawing.Drawing2D.GraphicsPath path = ControlHelper.CreateRoundedRectanglePath(new Rectangle(0, 0, Width - 1, Height - 1), 10);                using (Pen pen = new Pen(Color.FromArgb(153, 153, 153)))                {                    g.DrawPath(pen, path);                }            }        }

感兴趣的小伙伴，欢迎在下方留言。关注我，带你重绘美化C#控件