现在的位置: 首页 > 综合 > 正文

渐变色(Gradient)窗体——一种简单的实现方法

2012年11月11日 ⁄ 综合 ⁄ 共 3726字 ⁄ 字号 评论关闭

 

我最近注意到很多程序员都不重视他们开发的软件的外观,这主要是因为他们觉得作个漂亮的界面通常很难或需要花很多时间。其实在
 
我在CodeProject上搜了一下,发现已经有一篇由Erdal Halici写的关于渐变色窗体的文章。但是我发现他的解决方法对于这个简单的任务显得既复杂又冗长。这也就促成我写这篇文章。
这篇文章主向您展示了处理这个问题的简单方法,而且还提供了一个很小的基类使你可以在应用程序中直接使用。我保证,你需要作的唯一一件事就是设置颜色。这总不困难吧?:)
 
女士们,先生们,打开您的Visual Studio吧!

好的、坏的和渐变的

使用这个代码 

基窗体(BaseForm)
当你把BaseFormGradient.cs添加到项目之后,让你的窗体继承“BaseFormGradient”就行了。(译注:添加之后必须先编译BaseFormGradient再作继承) 
使用渐变色
然后你所需要作的事情就是设置颜色和渐变度。没错,我可以很负责的说,这就是你全部要作的事。
ps:这篇文章比较短,也不是很难,提到的方法比较有意思,所以就选了这一篇。作者的语气很幽默,但也很罗嗦,有些地方就不好翻译。另外有两个问题在后面的答复中提到:1、如何将这种风格应用到其他控件上(Button、TabControl等),总不能每个控件都按相同的方法作一遍吧!2、它实现了左上到右下的渐变效果,但我想把它变成从左向右的渐变效果该怎么办?
对于第一个问题,作者也没提出什么好办法。第二个问题作者通过一个坐标变换解决了问题,我看的不是太明白,有兴趣的可以看原文。

好的
    的确有些人在花时间为自己的应用程序选个合适的颜色。寻找一个和谐的背景颜色的确可以使他们的产品显得突出而且容易被认可。但是我只能为它鼓掌,然后反问:为什么不能更进一步,选择两种颜色呢?:)
坏的
    还有些人甚至从不关心选择颜色的问题。他们的应用程序只是使用乏味的灰色作为背景色,这个你肯定在不少应用程序见过了。那些设计者应该为此羞愧!(译注:我汗哪!照这么说我该去跳楼了。)
渐变的
    同时你也知道有人使用渐变色作背景,在读了这篇文章之后,我相信你也能成为其中之一。你所作的就是选择颜色,但是你的应用程序却会表现出特别的视觉效果,知道为什么吗?因为用户喜欢这样的视觉效果。
 
打造BaseGradientForm
首先要了解的:
       BaseGradientForm与一个具有一些预定义属性和方法的常规窗体相比并没多什么东西。你按照通常的方法创建一个窗体,唯一要作的事就是添加一些属性。 
三个属性和一个方法:
    我们需要添加三个属性:
       -Color1:第一个渐变色(译注:即窗体左侧的颜色)
       -Color2:第二个渐变色(译注:即窗体右侧的颜色)
       -ColorAngle:渐变度(即Color2与Color1之间的连线与X轴正向夹角)
这只是三个普通的属性,像这样添加属性你可能已经作一千遍了吧。
当然,这里还是有个不同的地方:当我们设置一个值的时候(通过代码,或者通过派生窗体设计期的属性设置),我们需要窗体重绘自己。要达到这个目标,我们需要调用一个很小的方法来告诉我们的窗体(或者是控件,当我们要在控件上使用渐变色时)去重绘自己。那个被调用的方法就是使窗体无效(Invalidate)的方法。
 
 1        //窗体左侧显示的颜色
 2        public Color Color1
 3        {
 4            get return _Color1; }
 5            set 
 6            
 7                _Color1 = value; 
 8                this.Invalidate(); // Tell the Form to repaint itself
 9            }

10        }

11
12        //窗体右侧显示的颜色
13        public Color Color2
14        {
15            get return _Color2; }
16            set 
17            
18                _Color2 = value; 
19                this.Invalidate(); // Tell the Form to repaint itself
20            }

21        }

22
23        //颜色渐变度
24        public float ColorAngle
25        {
26            get return _ColorAngle; }
27            set 
28            
29                _ColorAngle = value; 
30                this.Invalidate(); // Tell the Form to repaint itself
31            }

32        }

33
 
像毕加索(picasso)那样绘画
       不论什么时候窗体调用重绘函数,都是因为我们调用使窗体无效的函数(Invalidated call)或者操作系统调度而发生的,这将会触发两个事件(Paint或PaintBackground)。如果你要在这两个事件的处理函数中添加代码也没什么关系,不过因为我们是有逻辑思维的人,所以我们选择重写(override)PaintBackground。

在这个方法中我们在窗体上绘制了一个矩形区域,这个区域与我们的窗体大小相同。这样就可以覆盖整个窗体,变成窗体背景。
 1        protected override void OnPaintBackground(PaintEventArgs pevent)
 2        {
 3            // Getting the graphics object
 4            Graphics g = pevent.Graphics;
 5
 6            // Creating the rectangle for the gradient
 7            Rectangle rBackground = new Rectangle(00this.Width, this.Height);
 8
 9            // Creating the lineargradient
10            System.Drawing.Drawing2D.LinearGradientBrush bBackground 
11                = new System.Drawing.Drawing2D.LinearGradientBrush(rBackground, _Color1, _Color2, _ColorAngle);
12
13            // Draw the gradient onto the form
14            g.FillRectangle(bBackground, rBackground);
15
16            // Disposing of the resources held by the brush
17            bBackground.Dispose();
18        }

 
Bugs
    当你测试编写好的代码的时候,你将发现当窗口大小改变的时候会出现一个很奇怪的现象。当那个东西(critters,译注:应该指操作系统)接管这个事件的时候并不会发生,它的发生是因为窗体大小发生变化时程序并没有捕获“Repaint Yourself Event”。看来我们要处理所有的事情了,不是吗 :) ?幸运的是,我们不需要通过重写Resize Event完成这个困难的任务,我们只用在BaseFormGradient的构造函数中加上这么一行代码告诉窗体当大小改变时重绘就行了。
this.SetStyle( ControlStyles.ResizeRedraw, true );
最后记住一点:充分享受生活吧!(One last note to all : Enjoy Life To The Fullest !
 

.NET中你可以付出很少的精力就使自己的应用程序变得好看些,其中的一个方法就是在窗体的背景上使用渐变色。有时候,一个明快的渐变色就足以使你的产品鹤立鸡群了。

简介

抱歉!评论已关闭.