Delphi中的图形显示技巧

======================================================
注：本文源代码点此下载
======================================================

目前在许多学习软件、游戏光盘中,经常会看到各种图形显示技巧,凭着图形的移动、交错、雨滴状、百页窗、积木堆叠等显现方式,使画面变得更为生动活泼,更能吸引观众。本文将探讨如何在delphi中实现各种图形显示技巧。

基本原理

----在delphi中,实现一副图象的显示是非常简单的,只要在form中定义一个timage组件,设置其picture属性,然后选择任何有效的.ico、.bmp、.emf或.wmf文件,进行load,所选文件就显示在timage组件中了。但这只是直接将图形显示在窗体中,毫无技巧可言。为了使图形显示具有别具一格的效果,可以按下列步骤实现:

----定义一个timage组件,把要显示的图形先装入到timage组件中,也就是说,把图形内容从磁盘载入内存中, 做为图形缓存。

----创建一新的位图对象,其尺寸跟timage组件中的图形一样。

----利用画布(canvas)的copyrect功能(将一个画布的矩形区域拷贝到另一个画布的矩形区域),使用技巧,动态形成位图文件内容,然后在窗体中显示位图。

下面介绍各种图形显示技巧:

1.推拉效果:将要显示的图形由上、下、左、右方向拉进屏幕内显示,同时将屏幕上原来的旧图盖掉,此种效果可分为四种,上拉、下拉、左拉、右拉,但原理都差不多,以上拉效果为例。

原理:首先将放在暂存图形的第一条水平线,搬移至要显示的位图的最后一条,接着再将暂存图形的前两条水平线,依序搬移至要显示位图的最后两条水平线,然后搬移前三条、前四条叄?直到全部图形数据搬完为止。在搬移的过程中即可看到显示的位图由下而上浮起,而达到上拉的效果。

程序算法:

procedure tform1.button1click(sender: tobject);

var

newbmp: tbitmap;

i,bmpheight,bmpwidth:integer;

begin

newbmp:=tbitmap.create;

newbmp.width:=image1.width;

newbmp.height:=image1.height;

bmpheight:=image1.height;

bmpwidth:=image1.width;

for i:=0 to bmpheight do

begin

newbmp.canvas.copyrect(rect

(0,bmpheight-i,bmpwidth,bmpheight),

image1.canvas,

rect(0,0,bmpwidth,i));

form1.canvas.draw(120,100,newbmp);

end;

newbmp.free;

end;

2.垂直交错效果

原理:将要显示的图形拆成两部分,奇数条扫描线由上往下搬移,偶数条扫描线的部分则由下往上搬移,而且两者同时进行。从屏幕上便可看到分别由上下两端出现的较淡图形向屏幕中央移动,直到完全清楚为止。

程序算法:

procedure tform1.button4click(sender: tobject);

var

newbmp:tbitmap;

i,j,bmpheight,bmpwidth:integer;

begin

newbmp:=tbitmap.create;

newbmp.width:=image1.width;

newbmp.height:=image1.height;

bmpheight:=image1.height;

bmpwidth:=image1.width;

i:=0;

while i0 do

begin

newbmp.canvas.copyrect(rect(0,j-1,bmpwidth,j),

image1.canvas,

rect(0,bmpheight-i+j-1,bmpwidth,bmpheight-i+j));

newbmp.canvas.copyrect(rect

(0,bmpheight-j,bmpwidth,bmpheight-j+1),

image1.canvas,

rect(0,i-j,bmpwidth,i-j+1));

j:=j-2;

end;

form1.canvas.draw(120,100,newbmp);

i:=i+2;

end;

newbmp.free;

end;

3.水平交错效果

原理:同垂直交错效果原理一样,只是将分成两组后的图形分别由左右两端移进屏幕。

程序算法:

procedure tform1.button5click(sender: tobject);

var

newbmp:tbitmap;

i,j,bmpheight,bmpwidth:integer;

begin

newbmp:= tbitmap.create;

newbmp.width:=image1.width;

newbmp.height:=image1.height;

bmpheight:=image1.height;

bmpwidth:=image1.width;

i:=0;

whilei0 do

begin

newbmp.canvas.copyrect(rect(j-1,0,j,bmpheight),

image1.canvas,

rect(bmpwidth-i+j-1,0,bmpwidth-i+j,bmpheight));

newbmp.canvas.copyrect(rect

(bmpwidth-j,0,bmpwidth-j+1,bmpheight),

image1.canvas,

rect(i-j,0,i-j+1,bmpheight));

j:=j-2;

end;

form1.canvas.draw(120,100,newbmp);

i:=i+2;

end;

newbmp.free;

end;

4.雨滴效果

原理:将暂存图形的最后一条扫描线,依序搬移到可视位图的第一条到最后一条扫描线,让此条扫描线在屏幕上留下它的轨迹。接着再把暂存图形的倒数第二条扫描线,依序搬移到可视位图的第一条到倒数第二条扫描线。其余的扫描线依此类推。

程序算法:

procedure tform1.button3click(sender: tobject);

var

newbmp:tbitmap;

i,j,bmpheight,bmpwidth:integer;

begin

newbmp:=tbitmap.create;

newbmp.width:=image1.width;

newbmp.height:=image1.height;

bmpheight:=image1.height;

bmpwidth:=image1.width;

for i:=bmpheight downto 1 do

for j:=1 to ido

begin

newbmp.canvas.copyrect(rect(0,j-1,bmpwidth,j),

image1.canvas,

rect(0,i-1,bmpwidth,i));

form1.canvas.draw(120,100,newbmp);

end;

newbmp.free;

end;

5.百叶窗效果

原理:将放在暂存图形的数据分成若干组,然后依次从第一组到最后一组搬移,第一次每组各搬移第一条扫描线到可视位图的相应位置,第二次搬移第二条扫描线,接着搬移第三条、第四条扫描线.

程序算法:

procedure tform1.button6click(sender: tobject);

var

newbmp:tbitmap;

i,j,bmpheight,bmpwidth:integer;

xgroup,xcount:integer;

begin

newbmp:= tbitmap.create;

newbmp.width:=image1.width;

newbmp.height:=image1.height;

bmpheight:=image1.height;

bmpwidth:=image1.width;

xgroup:=16;

xcount:=bmpheight div xgroup;

for i:=0 to xcount do

for j:=0 toxgroup do

begin

newbmp.canvas.copyrect(rect

(0,xcount*j+i-1,bmpwidth,xcount*j+i),

image1.canvas,

rect(0,xcount*j+i-1,bmpwidth,xcount*j+i));

form1.canvas.draw(120,100,newbmp);

end;

newbmp.free;

end;

6.积木效果

原理:是雨滴效果的一种变化,不同之处在于,积木效果每次搬移的是一块图形,而不只是一根扫描线。

程序算法:

procedure tform1.button7click(sender: tobject);

var

newbmp:tbitmap;

i,j,bmpheight,bmpwidth:integer;

begin

newbmp:= tbitmap.create;

newbmp.width:=image1.width;

newbmp.height:=image1.height;

bmpheight:=image1.height;

bmpwidth:=image1.width;

i:=bmpheight;

while i>0 do

begin

for j:=10 to i do

begin

newbmp.canvas.copyrect(rect(0,j-10,bmpwidth,j),

image1.canvas,

rect(0,i-10,bmpwidth,i));

form1.canvas.draw(120,100,newbmp);

end;

i:=i-10;

end;

newbmp.free;

end;

结束语

上述图形显示效果均已上机通过。使用效果很好。

绿色通道:好文要顶关注我收藏该文与我联系

======================================================
在最后，我邀请大家参加新浪APP，就是新浪免费送大家的一个空间，支持PHP+MySql，免费二级域名，免费域名绑定 这个是我邀请的地址，您通过这个链接注册即为我的好友，并获赠云豆500个，价值5元哦！短网址是http://t.cn/SXOiLh我创建的小站每天访客已经达到2000+了，每天挂广告赚50+元哦，呵呵，饭钱不愁了，\(^o^)/