当前位置:编程学习 > C#/ASP.NET >>

c#怎样可以弄得这样漂亮

补充:
答案:我们要创建的控件简单说就是一个动态渐变的图片按钮,示例程序界面如下:

如何用C#实现漂亮的动态图像按钮(图一)

这个button控件依旧继承自UserControl,UserControl是制作自定义UI控件绝对的父类,这里不再细说。我们为这个button取名为DynamicImageButton。制作图像按钮当然离不开绘制,所以还得用到GDI+,我曾经写过多篇关于界面元素的文章,比如”利用.Net绘图技术制作水晶按钮控件”、” 利用C#实现任务栏通知窗口”、” 利用C#为数码照片添加拍照日期”、” C#实现运行时拖动控件并调整控件大小”等等,其中都会涉及到GDI+的诸多方面,可见GDI+在设计制作UI上是多么的重要啊!

对于按钮图片透明度渐变的操作则比较有技巧,采取了个人认为比较另类却极其高效的方法。制作图片按钮肯定是要为这个button赋值一个图像文件的,我们需要公开一个属性,代码如下:

public Bitmap Image { get { return bmp[0]; } set { bmp[0] = value; bmp[1] = returnAlpha(value, 60); bmp[2] = returnAlpha(value, 120); ; bmp[3] = returnAlpha(value, 180); ; draw(); } }

大家注意到,当给这个DynamicImageButton的image属性赋值一幅图片后,立即就会对这个原始图片经过4种不同的alpha过滤后分别存放到bmp位图数组下。bmp[0]保存原始图像,bmp[3]的图像则最透明。这就是本程序的特点所在,也就是在运行时是不进行图像透明度渐变计算的,在给image属性赋值时计算工作同时也已经完成了,这样可以省下鼠标移动事件的巨大计算量。

returnAlpha方法就是将原始图像中的每一个像素按照相应的alpha值进行重新绘制后保存在bmp数组中,不同透明度的图像作为bmp数组的不同元素进行保存。代码如下:

public static Bitmap returnAlpha(Bitmap bmp, int alpha) { Color col; Bitmap bmp2 = new Bitmap(bmp); for (int i = 0; i < bmp.Width; i++) for (int j = 0; j < bmp.Height; j++) { col = bmp.GetPixel(i, j); if (col.A > 0) bmp2.SetPixel(i, j, Color.FromArgb(min(col.A - alpha), col.R, col.G, col.B)); } return bmp2; }

到这里大家可能就已经明白我的用意了,没错!从原始图像到最终图像的透明渐变我只设计了4帧!其实,这对于一个小小的button动画来说已经完全足够了。对于图像的绘制方法我们仍旧采用双缓冲区绘制,也就是内存复制,实际上就是双bitmap对象交替使用,这样可以更好的防止图像闪烁

 .NET框架下使用双缓冲技术绘图”)。相关代码如下:

private void DynamicImageButton_Paint(object sender, System.EventArgs e) { g2 = Graphics.FromImage(dblbuffer); g2.Clear(this.BackColor); curx = (int)((double)Width) / 6; cury = (int)((double)Height) / 6; curwidth = (int)((double)Width) / 3 * 2; curheight = (int)((double)Height) / 3 * 2; itvwidth = (Width - curwidth) / 2; g2.DrawImage(bmp[3], curx, cury, curwidth, curheight); g.DrawImageUnscaled(dblbuffer, 0, 0); }

然后就是对图像大小渐变的控制了,如下图所示:

如何用C#实现漂亮的动态图像按钮(图二)

a、b、c和d四个矩形代表不同大小的4个帧,a帧是装载图像时的默认大小,就是bmp[0]的图像,也是4帧中最大的一帧,width=75和height=72是我们示例程序控件的大小,网友可以随意对长宽进行重新设定。这两个数值是基础,bmp[0]的图像会完全填充到这个区域内,在这个给定的长和宽的基础上我们计算出b、c和d三帧的图像大小和位置。然后创建一个计数器,当鼠标Enter或者Leave我们创建的这个DynamicImageButton时对图像的透明度和大小的渐变进行控制。相关代码如下:

private void timer1_Tick(object sender, EventArgs e) { if (mp == enumMousePosition.Enter) { if ((curx <= 0) || (cury <= 0) || (Width == curwidth) || (Height == curheight)) { return; } g2 = Graphics.FromImage(dblbuffer); g2.Clear(this.BackColor); //g2.Clear(Color.White); if (curx &gt;= itvwidth-2) { g2.DrawImage(bmp[3], curx - 1, cury - 1, curwidth + 2, curheight + 2); } else if ((curx&gt;= itvwidth / 3 * 2) && (curx < itvwidth)) { g2.DrawImage(bmp[2], curx - 1, cury - 1, curwidth + 2, curheight + 2); } else if ((curx &gt;= itvwidth / 3) && (curx <= itvwidth / 3 * 2)) { g2.DrawImage(bmp[1], curx - 1, cury - 1, curwidth + 2, curheight + 2); } else if ((curx &gt;= 0) && (curx <= itvwidth / 3)) { g2.DrawImage(bmp[0], curx - 1, cury - 1, curwidth + 2, curheight + 2); } g.DrawImageUnscaled(dblbuffer, 0, 0); curx--; cury--; curwidth = curwidth + 2; curheight = curheight + 2; if ((curx <= 0) || (cury <= 0) || (Width == curwidth) || (Height == curheight)) { timer1.Stop(); } } else if (mp == enumMousePosition.Leave) { if ((curx &gt;= (int)((double)Width) / 6) || (cury &gt;= (int)((double)Height) / 6) || (curwidth <= (int)((double)Width) / 3 * 2) || (curheight == (int)((double)Height) / 3 * 2)) { return; } g2 = Graphics.FromImage(dblbuffer); g2.Clear(this.BackColor); //g2.Clear(Color.White); if (curx &gt;= itvwidth-2) { g2.DrawImage(bmp[3], curx - 1, cury - 1, curwidth + 2, curheight + 2); } else if ((curx &gt;= itvwidth / 3 * 2) && (curx < itvwidth)) { g2.DrawImage(bmp[2], curx - 1, cury - 1, curwidth + 2, curheight + 2); } else if ((curx &gt;= itvwidth / 3) && (curx <= itvwidth / 3 * 2)) { g2.DrawImage(bmp[1], curx - 1, cury - 1, curwidth + 2, curheight + 2); } else if ((curx &gt;= 0) && (curx <= itvwidth / 3)) { g2.DrawImage(bmp[0], curx - 1, cury - 1, curwidth + 2, curheight + 2); } g.DrawImageUnscaled(dblbuffer, 0, 0); curx++; cury++; curwidth = curwidth - 2; curheight = curheight - 2; if ((curx &gt;= (int)((double)Width) / 6) || (cury &gt;= (int)((double)Height) / 6) || (curwidth <= (int)((double)Width) / 3 * 2) || (curheight == (int)((double)Height) / 3 * 2)) { timer1.Stop(); } } }

至此,一个超酷的动态图像按钮就制作完毕了,该程序在Windows XP SP3 +VS2005 C# SP1环境下编译调试通过。

发了,使用很简单,不懂再Q我。不过用了皮肤之后,打开窗体会有点闪,有点卡,因为不是为你量身定做的

就一些皮肤而已 没啥大不了的。

上一个:C# winform 连接mysql 最大连接数
下一个:谁知道CNC#代码呀 急需

CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,