درود و سلام خدمت تمامی کاربران وب سایت پروگرم 98 …
در این مطلب ، یاد می گیرید که دکمه هایی زیبا شبیه آفیس بسازید.
ابتدا یک پروژه جدید در visual studio ایجاد کنید.سپس یک دکمه به فرم اضافه کنید حالا برای این دکمه یک رویداد Paint ایجاد کنید.برای این کار به منوی Properties بروید و در قسمت Event ها کنار گزینه ی Paint دابل کلیک کنید.
حالا کدهای زیر را در رویداد Paint دکمه قرار دهید:
//تعریف متغیرها
Color borderDark, borderLight, bgdark, bgmed, bglight,textColor;
int _roundedRadiusX = 3;
int _roundedRadiusY = 3;
//initialization
//دکمه ی آبی
borderDark = ColorFromHex("#1f48a1");
borderLight = ColorFromHex("#4487e4");
bgdark = ColorFromHex("#2961b5");
//bgmed = ColorFromHex("#3d7bd9");
bglight = ColorFromHex("#3e7ddb");
textColor = Color.White;
//////دکمه ی زرد
//borderDark = ColorFromHex("#ecc757");
//borderLight = ColorFromHex("#fcf3d7");
//bgdark = ColorFromHex("#f9e189");
////bgmed = ColorFromHex("#3d7bd9");
//bglight = ColorFromHex("#fbf9e0");
//textColor = ColorFromHex("#1e395b");
//now let's we begin painting
Graphics g = e.Graphics;
g.SmoothingMode = SmoothingMode.HighQuality;
Rectangle r = new Rectangle(e.ClipRectangle.Left,e.ClipRectangle.Top,e.ClipRectangle.Width,e.ClipRectangle.Height);
Rectangle r2 = r;
r2.Inflate(-1, -1);
Rectangle r3 = r2;
r3.Inflate(-1, -1);
//clear background first
using (SolidBrush br = new SolidBrush(Color.FromName("ButtonFace")))
{
g.FillRectangle(br, r);
}
//rectangle for gradient, half upper and lower
RectangleF halfup = new RectangleF(r.Left, r.Top, r.Width, r.Height);
RectangleF halfdown = new RectangleF(r.Left, r.Top + (r.Height / 2) - 1, r.Width, r.Height);
//BEGIN PAINT BACKGROUND
//for half upper, we paint using linear gradient
using (GraphicsPath thePath = GetRoundedRect(r, _roundedRadiusX, _roundedRadiusY))
{
LinearGradientBrush lgb =
new LinearGradientBrush(halfup, bglight, bgdark, 90f, true);
Blend blend = new Blend(4);
blend.Positions = new float[] { 0, 0.18f, 0.35f, 1f };
blend.Factors = new float[] { 0f, .4f, .9f, 1f };
lgb.Blend = blend;
g.FillPath(lgb, thePath);
lgb.Dispose();
//for half lower, we paint using radial gradient
using (GraphicsPath p = new GraphicsPath())
{
p.AddEllipse(halfdown); //make it radial
using (PathGradientBrush gradient = new PathGradientBrush(p))
{
gradient.WrapMode = WrapMode.Clamp;
gradient.CenterPoint = new PointF(Convert.ToSingle(halfdown.Left + halfdown.Width / 2), Convert.ToSingle(halfdown.Bottom));
gradient.CenterColor = bglight;
gradient.SurroundColors = new Color[] { bgdark }
blend = new Blend(4);
blend.Positions = new float[] { 0, 0.15f, 0.4f, 1f };
blend.Factors = new float[] { 0f, .3f, 1f, 1f };
gradient.Blend = blend;
g.FillPath(gradient, thePath);
}
}
//END PAINT BACKGROUND
//BEGIN PAINT BORDERS
using (GraphicsPath gborderDark = thePath)
{
using (Pen p = new Pen(borderDark, 1))
{
g.DrawPath(p, gborderDark);
}
}
using (GraphicsPath gborderLight = GetRoundedRect(r2, _roundedRadiusX, _roundedRadiusY))
{
using (Pen p = new Pen(borderLight, 1))
{
g.DrawPath(p, gborderLight);
}
}
using (GraphicsPath gborderMed = GetRoundedRect(r3, _roundedRadiusX, _roundedRadiusY))
{
SolidBrush bordermed = new SolidBrush(Color.FromArgb(50, borderLight));
using (Pen p = new Pen(bordermed, 1))
{
g.DrawPath(p, gborderMed);
}
}
//END PAINT BORDERS
//BEGIN PAINT TEXT
StringFormat sf = new StringFormat();
sf.Alignment = StringAlignment.Center;
sf.LineAlignment = StringAlignment.Center;
if (this.ShowKeyboardCues)
sf.HotkeyPrefix = HotkeyPrefix.Show;
else
sf.HotkeyPrefix = HotkeyPrefix.Hide;
g.DrawString((sender as Control).Text, (sender as Control).Font, new SolidBrush(textColor), e.ClipRectangle, sf);
}
}
Color borderDark, borderLight, bgdark, bgmed, bglight,textColor;
int _roundedRadiusX = 3;
int _roundedRadiusY = 3;
//initialization
//دکمه ی آبی
borderDark = ColorFromHex("#1f48a1");
borderLight = ColorFromHex("#4487e4");
bgdark = ColorFromHex("#2961b5");
//bgmed = ColorFromHex("#3d7bd9");
bglight = ColorFromHex("#3e7ddb");
textColor = Color.White;
//////دکمه ی زرد
//borderDark = ColorFromHex("#ecc757");
//borderLight = ColorFromHex("#fcf3d7");
//bgdark = ColorFromHex("#f9e189");
////bgmed = ColorFromHex("#3d7bd9");
//bglight = ColorFromHex("#fbf9e0");
//textColor = ColorFromHex("#1e395b");
//now let's we begin painting
Graphics g = e.Graphics;
g.SmoothingMode = SmoothingMode.HighQuality;
Rectangle r = new Rectangle(e.ClipRectangle.Left,e.ClipRectangle.Top,e.ClipRectangle.Width,e.ClipRectangle.Height);
Rectangle r2 = r;
r2.Inflate(-1, -1);
Rectangle r3 = r2;
r3.Inflate(-1, -1);
//clear background first
using (SolidBrush br = new SolidBrush(Color.FromName("ButtonFace")))
{
g.FillRectangle(br, r);
}
//rectangle for gradient, half upper and lower
RectangleF halfup = new RectangleF(r.Left, r.Top, r.Width, r.Height);
RectangleF halfdown = new RectangleF(r.Left, r.Top + (r.Height / 2) - 1, r.Width, r.Height);
//BEGIN PAINT BACKGROUND
//for half upper, we paint using linear gradient
using (GraphicsPath thePath = GetRoundedRect(r, _roundedRadiusX, _roundedRadiusY))
{
LinearGradientBrush lgb =
new LinearGradientBrush(halfup, bglight, bgdark, 90f, true);
Blend blend = new Blend(4);
blend.Positions = new float[] { 0, 0.18f, 0.35f, 1f };
blend.Factors = new float[] { 0f, .4f, .9f, 1f };
lgb.Blend = blend;
g.FillPath(lgb, thePath);
lgb.Dispose();
//for half lower, we paint using radial gradient
using (GraphicsPath p = new GraphicsPath())
{
p.AddEllipse(halfdown); //make it radial
using (PathGradientBrush gradient = new PathGradientBrush(p))
{
gradient.WrapMode = WrapMode.Clamp;
gradient.CenterPoint = new PointF(Convert.ToSingle(halfdown.Left + halfdown.Width / 2), Convert.ToSingle(halfdown.Bottom));
gradient.CenterColor = bglight;
gradient.SurroundColors = new Color[] { bgdark }
blend = new Blend(4);
blend.Positions = new float[] { 0, 0.15f, 0.4f, 1f };
blend.Factors = new float[] { 0f, .3f, 1f, 1f };
gradient.Blend = blend;
g.FillPath(gradient, thePath);
}
}
//END PAINT BACKGROUND
//BEGIN PAINT BORDERS
using (GraphicsPath gborderDark = thePath)
{
using (Pen p = new Pen(borderDark, 1))
{
g.DrawPath(p, gborderDark);
}
}
using (GraphicsPath gborderLight = GetRoundedRect(r2, _roundedRadiusX, _roundedRadiusY))
{
using (Pen p = new Pen(borderLight, 1))
{
g.DrawPath(p, gborderLight);
}
}
using (GraphicsPath gborderMed = GetRoundedRect(r3, _roundedRadiusX, _roundedRadiusY))
{
SolidBrush bordermed = new SolidBrush(Color.FromArgb(50, borderLight));
using (Pen p = new Pen(bordermed, 1))
{
g.DrawPath(p, gborderMed);
}
}
//END PAINT BORDERS
//BEGIN PAINT TEXT
StringFormat sf = new StringFormat();
sf.Alignment = StringAlignment.Center;
sf.LineAlignment = StringAlignment.Center;
if (this.ShowKeyboardCues)
sf.HotkeyPrefix = HotkeyPrefix.Show;
else
sf.HotkeyPrefix = HotkeyPrefix.Hide;
g.DrawString((sender as Control).Text, (sender as Control).Font, new SolidBrush(textColor), e.ClipRectangle, sf);
}
}
همچنین تابع زیر را برای رسم مستطیل گردشده دارای radius اضافه کنید:
public static GraphicsPath GetRoundedRect(RectangleF r, float radiusX, float radiusY)
{
GraphicsPath gp = new GraphicsPath();
gp.StartFigure();
r = new RectangleF(r.Left, r.Top, r.Width, r.Height);
if (radiusX <= 0.0F || radiusY <= 0.0F)
{
gp.AddRectangle(r);
}
else
{
//arcs work with diameters (radius * 2)
PointF d = new PointF(Math.Min(radiusX * 2, r.Width)
, Math.Min(radiusY * 2, r.Height));
gp.AddArc(r.X, r.Y, d.X, d.Y, 180, 90);
gp.AddArc(r.Right - d.X, r.Y, d.X - 1, d.Y, 270, 90);
gp.AddArc(r.Right - d.X, (r.Bottom) - d.Y - 1, d.X - 1, d.Y, 0, 90);
gp.AddArc(r.X, (r.Bottom) - d.Y - 1, d.X - 1, d.Y, 90, 90);
}
gp.CloseFigure();
return gp;
}
{
GraphicsPath gp = new GraphicsPath();
gp.StartFigure();
r = new RectangleF(r.Left, r.Top, r.Width, r.Height);
if (radiusX <= 0.0F || radiusY <= 0.0F)
{
gp.AddRectangle(r);
}
else
{
//arcs work with diameters (radius * 2)
PointF d = new PointF(Math.Min(radiusX * 2, r.Width)
, Math.Min(radiusY * 2, r.Height));
gp.AddArc(r.X, r.Y, d.X, d.Y, 180, 90);
gp.AddArc(r.Right - d.X, r.Y, d.X - 1, d.Y, 270, 90);
gp.AddArc(r.Right - d.X, (r.Bottom) - d.Y - 1, d.X - 1, d.Y, 0, 90);
gp.AddArc(r.X, (r.Bottom) - d.Y - 1, d.X - 1, d.Y, 90, 90);
}
gp.CloseFigure();
return gp;
}
کد زیر را برای تبدیل فرمت hexadecimal به فرمت Color اضافه کنید:
public static Color ColorFromHex(string hex)
{
if (hex.StartsWith("#"))
hex = hex.Substring(1);
if (hex.Length != 6) throw new Exception("Color not valid");
{
if (hex.StartsWith("#"))
hex = hex.Substring(1);
if (hex.Length != 6) throw new Exception("Color not valid");