轉帖|其它|編輯:郝浩|2012-10-23 11:48:21.000|閱讀 576 次
概述:玻璃效果的實現大多采用圖片的方式,對于資源是很大的浪費;其實用程序的方法也是可以實現的,我用的是圖表控件TeeChart,下面的描述將向你展示玻璃效果如何用程序來實現,所列的代碼可以放心地應用到你的工程中。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
現代軟件對于用戶體驗的要求越來越高,特別是對于界面,當人們不再喜歡乏味的經典風格時,漸變效果的界面出來了,這一點在Office2003可以體顯出來。但現在,漸變效果似乎也不能滿足審美要求了,越來越多的軟件嘗試用玻璃效果來呈現,Vista整個就是玻璃的界面。
玻璃效果的實現大多采用圖片的方式,對于資源是很大的浪費;其實用程序的方法也是可以實現的,我用的是圖表控件TeeChart,下面的描述將向你展示玻璃效果如何用程序來實現,所列的代碼可以放心地應用到你的工程中。
仔細研究一些玻璃的表面,發現其實可以用漸變來組合,假設有一個矩形區域,那么玻璃效果可以分解成下面的部分:
邊框可能不是必須的,但對于一個實體來說,加上邊框會顯得完整一些,我們將邊框分成外邊框和內邊框,內邊框是為了突顯一些3D的效果。漸變分成兩個部分,這也是玻璃效果最重要的表現形式,其中的配色將決定玻璃效果的好壞。如何確定漸變的顏色?很簡單,找一些玻璃效果的圖然后取色就是了,下面是MSN Space的一個效果:
為了不分散代碼,我將整個單元列出來,可以直接拷貝到你的工程中:
unit GlassUtils; interface uses Graphics, Windows, Classes; type { 漸變API的聲明 } PTriVertex = ^TTriVertex; TTriVertex = packed record x: Longint; y: Longint; Red: WORD; Green: WORD; Blue: WORD; Alpha: WORD; end; function GradientFill(DC: HDC; Vertex: PTriVertex; NumVertex: ULONG; Mesh: Pointer; NumMesh, Mode: ULONG): BOOL; stdcall; type {漸變方向: 從左到右,從上到下} TGradDirection = (gdLeftRight, gdTopBottom); { 玻璃效果的顏色配置 } TGlassColorCfg = record OutBorder, //外框,如果為clNone將不繪制 InBorder, //內框,如果為clNone將不繪制 Grad1Start, //上半部分漸變的開始顏色 Grad1End, //上半部分漸變的結束顏色 Grad2Start, //下半部分漸變的開始顏色 Grad2End: TColor //下半部分漸變的結束顏色 end; var { 默認顏色配置,藍色玻璃 } DefGlassColorCfg: TGlassColorCfg = (OutBorder: clBlack; InBorder: $00E1D0AA; Grad1Start: $00D1AE7A; Grad1End: $00B98835; Grad2Start: $00975F00; Grad2End: $00C6A46A); { 顏色值轉RGB } procedure GetRGB(C: TColor; out R, G, B: Integer); { 漸變函數 } procedure FillGradient(const Canvas: TCanvas; const ARect: TRect; const StartColor, EndColor: TColor; const Direction: TGradDirection); { 玻璃效果繪制函數 } procedure DrawGlassFace(Canvas: TCanvas; ARect: TRect; const GlassColorCfg: TGlassColorCfg); implementation function GradientFill; external msimg32; procedure GetRGB(C: TColor; out R, G, B: Integer); begin if Integer(C) < 0 then C := GetSysColor(C and $000000FF); R := C and $FF; G := C shr 8 and $FF; B := C shr 16 and $FF; end; procedure FillGradient(const Canvas: TCanvas; const ARect: TRect; const StartColor, EndColor: TColor; const Direction: TGradDirection); var Vert: array[0..1] of TTriVertex; gRect: TGradientRect; nMode: Cardinal; R, G, B: Integer; begin vert[0].x := ARect.Left; vert[0].y := ARect.Top; GetRGB(StartColor, R, G, B); Vert[0].Red := R shl 8; Vert[0].Green := G shl 8; Vert[0].Blue := B shl 8; vert[0].Alpha := 0; vert[1].x := ARect.Right; vert[1].y := ARect.Bottom; GetRGB(EndColor, R, G, B); Vert[1].Red := R shl 8; Vert[1].Green := G shl 8; Vert[1].Blue := B shl 8; vert[1].Alpha := 0; gRect.UpperLeft := 0; gRect.LowerRight := 1; if Direction = gdLeftRight then nMode := GRADIENT_FILL_RECT_H else nMode := GRADIENT_FILL_RECT_V; GradientFill(Canvas.Handle, @vert, 2, @gRect, 1, nMode); end; procedure DrawGlassFace(Canvas: TCanvas; ARect: TRect; const GlassColorCfg: TGlassColorCfg); var R: TRect; begin Canvas.Brush.Style := bsClear; with GlassColorCfg do begin if OutBorder <> clNone then begin //外框 Canvas.Pen.Color := OutBorder; Canvas.Rectangle(ARect); end; if InBorder <> clNone then begin //內框 InflateRect(ARect, -1, -1); Canvas.Pen.Color := InBorder; Canvas.Rectangle(ARect); end; //上下漸變效果 InflateRect(ARect, -1, -1); with ARect do R := Rect(Left, Top, Right, Top + (Bottom - Top) div 2); FillGradient(Canvas, R, Grad1Start, Grad1End, gdTopBottom); R := Rect(R.Left, R.Bottom, R.Right, ARect.Bottom); FillGradient(Canvas, R, Grad2Start, Grad2End, gdTopBottom); end; end; end.
這個單元中FillGradient繪制漸變效果,DrawGlassFace繪制玻璃效果,這兩個都是非常有用的界面函數。TGlassColorCfg是玻璃效果的顏色配置,而DefGlassColorCfg則默認實現了藍色的玻璃效果,事實上與上面的MSN Space的效果一樣。
下面看看怎么用這個單元,新建一個工程,在主窗體上放三個按鈕,再放一個PaintBox,主窗體的代碼如下:
unit Unit1; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms, Dialogs, StdCtrls, ExtCtrls, GlassUtils; type TForm1 = class(TForm) btnBlue: TButton; pbGlass: TPaintBox; btnGreen: TButton; btnBlack: TButton; procedure pbGlassPaint(Sender: TObject); procedure FormCreate(Sender: TObject); procedure btnGreenClick(Sender: TObject); procedure btnBlueClick(Sender: TObject); procedure btnBlackClick(Sender: TObject); private { Private declarations } public { Public declarations } FGlassColorCfg: TGlassColorCfg; end; var Form1: TForm1; implementation {$R *.dfm} procedure TForm1.pbGlassPaint(Sender: TObject); begin DrawGlassFace(pbGlass.Canvas, pbGlass.ClientRect, FGlassColorCfg); end; procedure TForm1.FormCreate(Sender: TObject); begin FGlassColorCfg := DefGlassColorCfg; end; procedure TForm1.btnGreenClick(Sender: TObject); begin //綠色玻璃配色方案 FGlassColorCfg.OutBorder := clNone; //clBlack FGlassColorCfg.InBorder := clNone; //$00C4E3CF; FGlassColorCfg.Grad1Start := $00AED2BA; FGlassColorCfg.Grad1End := $0067AD7D; FGlassColorCfg.Grad2Start := $001F8741; FGlassColorCfg.Grad2End := $00359F58; pbGlass.Invalidate; end; procedure TForm1.btnBlueClick(Sender: TObject); begin FGlassColorCfg := DefGlassColorCfg; pbGlass.Invalidate; end; procedure TForm1.btnBlackClick(Sender: TObject); begin //黑色玻璃配色方案 FGlassColorCfg.OutBorder := clBlack; FGlassColorCfg.InBorder := $00AFAFAF; FGlassColorCfg.Grad1Start := $007D7D7D; FGlassColorCfg.Grad1End := $00353535; FGlassColorCfg.Grad2Start := clBlack; FGlassColorCfg.Grad2End := $0071716A; pbGlass.Invalidate; end; end.
例子工程實現了三個種玻璃效果:藍色,綠色,和黑色,看看下面的效果圖:
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉載自:CSDN