1.看图
可以实现MouseDown改变背景颜色或背景图片。
遗憾是没有实现键盘触发按钮事件。
2.选择继承自Control基类
public class ImageButton : Control
3.创建几个枚举类型
public enum TextAlignStyle
{
TopCenter,
MiddleCenter,
BottonCenter,
} public enum PictureLocationStyle
{
TopCenter,
MiddleCenter,
BottonCenter,
} public enum BorderStyle
{
None,
Single,
}
4.设置字段及其默认值
Image backgroundImage;//背景图片
Image pressedImage;//鼠标按下ImageButton时的图片
bool pressed = false;//ImageButton是否按下，true表示ImageButton按下
Color pressBackColor = SystemColors.Control;//鼠标按下时背景颜色
Color preBackColor = SystemColors.Control;//原来的背景颜色
TextAlignStyle textAlign = TextAlignStyle.BottonCenter;//文本的位置
PictureLocationStyle pictureLocation = PictureLocationStyle.TopCenter;//图片的位置
BorderStyle buttonBorder = BorderStyle.Single;//默认单线条边框
Color borderColor = SystemColors.Control;//默认边框颜色
5.设置属性
//背景图片属性
public Image BackgroundImage
{
get { return backgroundImage; }
set { backgroundImage = value; this.Invalidate(); }
} // 鼠标按下ImageButton时的图片
public Image PressedImage
{
get { return pressedImage; }
set { pressedImage = value; this.Invalidate(); }
} //鼠标按下时背景颜色
public Color PressBackColor
{
get { return pressBackColor; }
set { pressBackColor = value; this.Invalidate(); }
} //鼠标起来时背景颜色
public Color PreBackColor
{
get { return preBackColor; }
set { preBackColor = value; this.Invalidate(); }
} //文本的位置
public TextAlignStyle TextAlign
{
get { return textAlign; }
set { textAlign = value; this.Invalidate(); }
} //图片的位置
public PictureLocationStyle PictureLocation
{
get { return pictureLocation; }
set { pictureLocation = value; this.Invalidate(); }
} //边框样式
public BorderStyle ButtonBorder
{
get { return buttonBorder; }
set { buttonBorder = value; this.Invalidate(); }
}
6.重写MouseDown&MouseUp事件
protected override void OnMouseDown(MouseEventArgs e)
{
this.pressed = true;//鼠标按下，设置pressed=true
this.Invalidate();
base.OnMouseDown(e);
} protected override void OnMouseUp(MouseEventArgs e)
{
this.pressed = false;//鼠标释放，设置pressed=false
this.Invalidate();
base.OnMouseUp(e);
}
7. 重点：重绘控件
// 重绘背景图片和文本
protected override void OnPaint(PaintEventArgs e)
{
//画背景图片
DrawBackGroundImage(e);
//改变背景颜色
ChangeBackColor();
//画文字
DrawForeText(e);
//画边框
DrawBorder(e); // Calling the base class OnPaint
base.OnPaint(e);
} //改变背景颜色
private void ChangeBackColor()
{
//按下鼠标时改变背景颜色
if (this.pressed)
{
this.BackColor = this.pressBackColor;
}
else
{
this.BackColor = this.preBackColor;
}
} //画边框
private void DrawBorder(PaintEventArgs e)
{
switch (buttonBorder)
{
case BorderStyle.None:
break;
case BorderStyle.Single:
//画边框
e.Graphics.DrawRectangle(new Pen(borderColor), , , this.ClientSize.Width - , this.ClientSize.Height - );
break;
}
} //画文本
private void DrawForeText(PaintEventArgs e)
{
//如果Text不为空，就显示文本
if (this.Text.Length > )
{
//获取文本的Size
SizeF size = e.Graphics.MeasureString(this.Text, this.Font);
//设置画文本的初始位置
float textX = ;
float textY = ;
switch (textAlign)
{
case TextAlignStyle.TopCenter:
textX = (this.ClientSize.Width - size.Width) / ;
textY = ;
break;
case TextAlignStyle.MiddleCenter:
textX = (this.ClientSize.Width - size.Width) / ;
textY = (this.ClientSize.Height - size.Height) / ;
break;
case TextAlignStyle.BottonCenter:
textX = (this.ClientSize.Width - size.Width) / ;
textY = this.ClientSize.Height - size.Height;
break;
}
//画文本
e.Graphics.DrawString(this.Text, this.Font, new SolidBrush(this.ForeColor), textX, textY);
}
} //画背景图片
private void DrawBackGroundImage(PaintEventArgs e)
{
switch (pictureLocation)
{
case PictureLocationStyle.TopCenter:
//当鼠标按下且按下的图片为不为空，此时显示鼠标按下时图片
if (this.pressed && this.pressedImage != null)
{
e.Graphics.DrawImage(this.pressedImage, (this.ClientSize.Width - this.pressedImage.Width) / , );
}
//其他情况显示背景图片
else if (this.backgroundImage != null)
{
e.Graphics.DrawImage(this.backgroundImage, (this.ClientSize.Width - this.backgroundImage.Width) / , );
}
break;
case PictureLocationStyle.MiddleCenter:
//当鼠标按下且按下的图片为不为空，此时显示鼠标按下时图片
if (this.pressed && this.pressedImage != null)
{
e.Graphics.DrawImage(this.pressedImage, (this.ClientSize.Width - this.pressedImage.Width) / , (this.ClientSize.Width - this.pressedImage.Width) / );
}
//其他情况显示背景图片
else if (this.backgroundImage != null)
{
e.Graphics.DrawImage(this.backgroundImage, (this.ClientSize.Width - this.backgroundImage.Width) / , (this.ClientSize.Width - this.backgroundImage.Width) / );
}
break;
case PictureLocationStyle.BottonCenter:
//当鼠标按下且按下的图片为不为空，此时显示鼠标按下时图片
if (this.pressed && this.pressedImage != null)
{
e.Graphics.DrawImage(this.pressedImage, (this.ClientSize.Width - this.pressedImage.Width) / , this.ClientSize.Width - this.pressedImage.Width);
}
//其他情况显示背景图片
else if (this.backgroundImage != null)
{
e.Graphics.DrawImage(this.backgroundImage, (this.ClientSize.Width - this.backgroundImage.Width) / , this.ClientSize.Width - this.backgroundImage.Width);
}
break;
}
}
所有代码如下：
using System.Drawing;
using System.Windows.Forms;
using System.Drawing.Imaging; namespace Demo
{
public class ImageButton : Control
{
public ImageButton() { } public enum TextAlignStyle
{
TopCenter,
MiddleCenter,
BottonCenter,
} public enum PictureLocationStyle
{
TopCenter,
MiddleCenter,
BottonCenter,
} public enum BorderStyle
{
None,
Single,
} Image backgroundImage;//背景图片
Image pressedImage;//鼠标按下ImageButton时的图片
bool pressed = false;//ImageButton是否按下，true表示ImageButton按下
Color pressBackColor = SystemColors.Control;//鼠标按下时背景颜色
Color preBackColor = SystemColors.Control;//原来的背景颜色
TextAlignStyle textAlign = TextAlignStyle.BottonCenter;//文本的位置
PictureLocationStyle pictureLocation = PictureLocationStyle.TopCenter;//图片的位置
BorderStyle buttonBorder = BorderStyle.Single;//默认单线条边框
Color borderColor = SystemColors.Control;//默认边框颜色 //背景图片属性
public Image BackgroundImage
{
get { return backgroundImage; }
set { backgroundImage = value; this.Invalidate(); }
} // 鼠标按下ImageButton时的图片
public Image PressedImage
{
get { return pressedImage; }
set { pressedImage = value; this.Invalidate(); }
} //鼠标按下时背景颜色
public Color PressBackColor
{
get { return pressBackColor; }
set { pressBackColor = value; this.Invalidate(); }
} //鼠标起来时背景颜色
public Color PreBackColor
{
get { return preBackColor; }
set { preBackColor = value; this.Invalidate(); }
} //文本的位置
public TextAlignStyle TextAlign
{
get { return textAlign; }
set { textAlign = value; this.Invalidate(); }
} //图片的位置
public PictureLocationStyle PictureLocation
{
get { return pictureLocation; }
set { pictureLocation = value; this.Invalidate(); }
} //边框样式
public BorderStyle ButtonBorder
{
get { return buttonBorder; }
set { buttonBorder = value; this.Invalidate(); }
} protected override void OnMouseDown(MouseEventArgs e)
{
this.pressed = true;//鼠标按下，设置pressed=true
this.Invalidate();
base.OnMouseDown(e);
} protected override void OnMouseUp(MouseEventArgs e)
{
this.pressed = false;//鼠标释放，设置pressed=false
this.Invalidate();
base.OnMouseUp(e);
} // 重绘背景图片和文本
protected override void OnPaint(PaintEventArgs e)
{
//画背景图片
DrawBackGroundImage(e);
//改变背景颜色
ChangeBackColor();
//画文字
DrawForeText(e);
//画边框
DrawBorder(e); // Calling the base class OnPaint
base.OnPaint(e);
} //改变背景颜色
private void ChangeBackColor()
{
//按下鼠标时改变背景颜色
if (this.pressed)
{
this.BackColor = this.pressBackColor;
}
else
{
this.BackColor = this.preBackColor;
}
} //画边框
private void DrawBorder(PaintEventArgs e)
{
switch (buttonBorder)
{
case BorderStyle.None:
break;
case BorderStyle.Single:
//画边框
e.Graphics.DrawRectangle(new Pen(borderColor), , , this.ClientSize.Width - , this.ClientSize.Height - );
break;
}
} //画文本
private void DrawForeText(PaintEventArgs e)
{
//如果Text不为空，就显示文本
if (this.Text.Length > )
{
//获取文本的Size
SizeF size = e.Graphics.MeasureString(this.Text, this.Font);
//设置画文本的初始位置
float textX = ;
float textY = ;
switch (textAlign)
{
case TextAlignStyle.TopCenter:
textX = (this.ClientSize.Width - size.Width) / ;
textY = ;
break;
case TextAlignStyle.MiddleCenter:
textX = (this.ClientSize.Width - size.Width) / ;
textY = (this.ClientSize.Height - size.Height) / ;
break;
case TextAlignStyle.BottonCenter:
textX = (this.ClientSize.Width - size.Width) / ;
textY = this.ClientSize.Height - size.Height;
break;
}
//画文本
e.Graphics.DrawString(this.Text, this.Font, new SolidBrush(this.ForeColor), textX, textY);
}
} //画背景图片
private void DrawBackGroundImage(PaintEventArgs e)
{
switch (pictureLocation)
{
case PictureLocationStyle.TopCenter:
//当鼠标按下且按下的图片为不为空，此时显示鼠标按下时图片
if (this.pressed && this.pressedImage != null)
{
e.Graphics.DrawImage(this.pressedImage, (this.ClientSize.Width - this.pressedImage.Width) / , );
}
//其他情况显示背景图片
else if (this.backgroundImage != null)
{
e.Graphics.DrawImage(this.backgroundImage, (this.ClientSize.Width - this.backgroundImage.Width) / , );
}
break;
case PictureLocationStyle.MiddleCenter:
//当鼠标按下且按下的图片为不为空，此时显示鼠标按下时图片
if (this.pressed && this.pressedImage != null)
{
e.Graphics.DrawImage(this.pressedImage, (this.ClientSize.Width - this.pressedImage.Width) / , (this.ClientSize.Width - this.pressedImage.Width) / );
}
//其他情况显示背景图片
else if (this.backgroundImage != null)
{
e.Graphics.DrawImage(this.backgroundImage, (this.ClientSize.Width - this.backgroundImage.Width) / , (this.ClientSize.Width - this.backgroundImage.Width) / );
}
break;
case PictureLocationStyle.BottonCenter:
//当鼠标按下且按下的图片为不为空，此时显示鼠标按下时图片
if (this.pressed && this.pressedImage != null)
{
e.Graphics.DrawImage(this.pressedImage, (this.ClientSize.Width - this.pressedImage.Width) / , this.ClientSize.Width - this.pressedImage.Width);
}
//其他情况显示背景图片
else if (this.backgroundImage != null)
{
e.Graphics.DrawImage(this.backgroundImage, (this.ClientSize.Width - this.backgroundImage.Width) / , this.ClientSize.Width - this.backgroundImage.Width);
}
break;
}
}
}
}