用处及效果
注意观察各个控件交叠的地方,是不是发现他们没有遮挡?这就是这个控件的妙处了。

准备工作
先说明一下这个控件的作用,很多时候我们需要一个图片类型的控件,但是有需要密集的放在一起,如果单纯的设置背景图或image的话 交叠在一起的部分就会存在遮挡现象,所有就有了这个控件。
该控件可以根据设置的采样图片来裁剪有用的绘图区域,这样的好处就是在交叠的时候,无用区域不会遮挡。
这个用GDI+画的,另外也用到了一点三角函数,不明白的话 可以先百度下
开始
添加一个类UCSampling ,继承UserControl
添加属性
/// <summary>
/// The sampling imag
/// </summary>
private Bitmap samplingImag = null;
/// <summary>
/// Gets or sets the sampling imag.
/// </summary>
/// <value>The sampling imag.</value>
[Browsable(true), Category("自定义属性"), Description("采样图片"), Localizable(true)]
public Bitmap SamplingImag
{
get { return samplingImag; }
set
{
samplingImag = value;
ResetBorderPath();
Invalidate();
}
}
/// <summary>
/// The transparent
/// </summary>
private Color? transparent = null;
/// <summary>
/// Gets or sets the transparent.
/// </summary>
/// <value>The transparent.</value>
[Browsable(true), Category("自定义属性"), Description("透明色,如果为空,则使用0,0坐标处的颜色"), Localizable(true)]
public Color? Transparent
{
get { return transparent; }
set
{
transparent = value;
ResetBorderPath();
Invalidate();
}
}
/// <summary>
/// The alpha
/// </summary>
private int alpha = 50;
/// <summary>
/// Gets or sets the alpha.
/// </summary>
/// <value>The alpha.</value>
[Browsable(true), Category("自定义属性"), Description("当作透明色的透明度,小于此透明度的颜色将被认定为透明,0-255"), Localizable(true)]
public int Alpha
{
get { return alpha; }
set
{
if (value < 0 || value > 255)
return;
alpha = value;
ResetBorderPath();
Invalidate();
}
}
/// <summary>
/// The color threshold
/// </summary>
private int colorThreshold = 10;
/// <summary>
/// Gets or sets the color threshold.
/// </summary>
/// <value>The color threshold.</value>
[Browsable(true), Category("自定义属性"), Description("透明色颜色阀值"), Localizable(true)]
public int ColorThreshold
{
get { return colorThreshold; }
set
{
colorThreshold = value;
ResetBorderPath();
Invalidate();
}
}
/// <summary>
/// The bit cache
/// </summary>
private Bitmap _bitCache;
在大小改变或图片改变时重新计算边界
/// <summary>
/// The m border path
/// </summary>
GraphicsPath m_borderPath = new GraphicsPath();
/// <summary>
/// Handles the SizeChanged event of the UCSampling control.
/// </summary>
/// <param name="sender">The source of the event.</param>
/// <param name="e">The <see cref="EventArgs"/> instance containing the event data.</param>
void UCSampling_SizeChanged(object sender, EventArgs e)
{
ResetBorderPath();
}
/// <summary>
/// Resets the border path.
/// </summary>
private void ResetBorderPath()
{
if (samplingImag == null)
{
m_borderPath = this.ClientRectangle.CreateRoundedRectanglePath(5);
}
else
{
var bit = new Bitmap(this.ClientRectangle.Width, this.ClientRectangle.Height);
using (var bitg = Graphics.FromImage(bit))
{
bitg.DrawImage(samplingImag, this.ClientRectangle, 0, 0, samplingImag.Width, samplingImag.Height, GraphicsUnit.Pixel);
}
_bitCache = bit;
m_borderPath = new GraphicsPath();
List<PointF> lstPoints = GetBorderPoints(bit, transparent ?? samplingImag.GetPixel(0, 0));
m_borderPath.AddLines(lstPoints.ToArray());
m_borderPath.CloseAllFigures();
}
}
/// <summary>
/// Gets the border points.
/// </summary>
/// <param name="bit">The bit.</param>
/// <param name="transparent">The transparent.</param>
/// <returns>List<PointF>.</returns>
private List<PointF> GetBorderPoints(Bitmap bit, Color transparent)
{
float diameter = (float)Math.Sqrt(bit.Width * bit.Width + bit.Height * bit.Height);
int intSplit = 0;
intSplit = (int)(7 - (diameter - 200) / 100);
if (intSplit < 1)
intSplit = 1;
List<PointF> lstPoint = new List<PointF>();
for (int i = 0; i < 360; i += intSplit)
{
for (int j = (int)diameter / 2; j > 5; j--)
{
Point p = GetPointByAngle(i, j, new PointF(bit.Width / 2, bit.Height / 2));
if (p.X < 0 || p.Y < 0 || p.X >= bit.Width || p.Y >= bit.Height)
continue;
Color _color = bit.GetPixel(p.X, p.Y);
if (!(((int)_color.A) <= alpha || IsLikeColor(_color, transparent)))
{
if (!lstPoint.Contains(p))
{
lstPoint.Add(p);
}
break;
}
}
}
return lstPoint;
}
/// <summary>
/// Determines whether [is like color] [the specified color1].
/// </summary>
/// <param name="color1">The color1.</param>
/// <param name="color2">The color2.</param>
/// <returns><c>true</c> if [is like color] [the specified color1]; otherwise, <c>false</c>.</returns>
private bool IsLikeColor(Color color1, Color color2)
{
var cv = Math.Sqrt(Math.Pow((color1.R - color2.R), 2) + Math.Pow((color1.G - color2.G), 2) + Math.Pow((color1.B - color2.B), 2));
if (cv <= colorThreshold)
return true;
else
return false;
}
#region 根据角度得到坐标 English:Get coordinates from angles
/// <summary>
/// 功能描述:根据角度得到坐标 English:Get coordinates from angles
/// 作 者:HZH
/// 创建日期:2019-09-28 11:56:25
/// 任务编号:POS
/// </summary>
/// <param name="angle">angle</param>
/// <param name="radius">radius</param>
/// <param name="origin">origin</param>
/// <returns>返回值</returns>
private Point GetPointByAngle(float angle, float radius, PointF origin)
{
float y = origin.Y + (float)Math.Sin(Math.PI * (angle / 180.00F)) * radius;
float x = origin.X + (float)Math.Cos(Math.PI * (angle / 180.00F)) * radius;
return new Point((int)x, (int)y);
}
#endregion
取边界的思路如下:
1,以控件中心为原点,按照一定的角度顺时针依次进行旋转,
2、每次旋转后,按照此角度从外向内,找到第一个不是透明的点记录下来,这就是外边界点
这个取边界算法感觉并不是太好,如果哪位小伙伴有更好的算法,希望可以探讨一下
重绘
protected override void OnPaint(PaintEventArgs e)
{
base.OnPaint(e);
e.Graphics.SetGDIHigh();
this.Region = new System.Drawing.Region(m_borderPath);
if (_bitCache != null)
e.Graphics.DrawImage(_bitCache, 0, 0);
}
最后的话
如果你喜欢的话,请到 https://gitee.com/kwwwvagaa/net_winform_custom_control 点个星星吧
作者:冰封一夏
出处: http://www.hzhcontrols.com/doc.html
HZHControls官网:http://www.hzhcontrols.com
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,
且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
GitHub:https://github.com/kwwwvagaa/NetWinformControl
码云:https://gitee.com/kwwwvagaa/net_winform_custom_control.git