Delphi實現百葉窗、雨滴、交錯顯示效果代碼分析

用Delphi實現百葉窗、雨滴、交錯和漸變顯示效果，此文將重點介紹代碼的編寫過程，向你一步一步分析如何實現該程序。

（1）實現垂直交錯效果的原理是：將要顯示的圖形拆成兩部分，奇數條掃描線由上往下搬移，偶數條掃描線的部分則由下往上搬移，而且兩者同時進行。從屏幕上便可看到分別由上下兩端出現的較淡圖形向屏幕中央移動，直到完全清楚為止。代碼如下：

procedure TForm1.Button2Click(Sender: TObject);
var
newbmp:Tbitmap;
i,j,bmpHeight,bmpWidth:integer;
begin
Image1.Visible:=False;//設置Image1 和Scrollbox1 的可見性
scrollbox1.Visible:=False;
panel1.Align:=albottom;//設置Panel1 的位置
newbmp:= Tbitmap.Create;//創建一個圖像對象
//設置圖像的各項屬性
newbmp.Width:=Image1.Width;
newbmp.Height:=Image1.Height;
bmpHeight:=Image1.Height;
bmpWidth:=Image1.Width;
i:=0;
while i<=bmpHeight do
begin
j:=i;
while j >0 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(0,0,newbmp);//窗體重繪
i:=i+2;
end;
newbmp.free;//釋放圖像對象
end;

（2）推拉效果將要顯示的圖形是由上、下、左、右方向拉進屏幕內顯示地，同時將屏幕上原來的舊圖覆蓋，此種效果可分為四種，上拉、下拉、左拉、右拉，但原理都差不多，以上拉效果為例。原理：首先將放在暫存圖形的第一條水平線，搬移至要顯示位圖的最後一條水平線，接著再將暫存圖形的前兩條水平線，依序搬移至要顯示位圖的最後兩條水平線，然後搬移前三條、前四條⋯⋯直到全部圖形數據搬完為止。在搬移的過程中即可看到顯示的位圖由下而上浮起，而達到上拉的效果：

//推拉效果
procedure TForm1.Button3Click(Sender: TObject);
var
newbmp: Tbitmap;
i,bmpHeight,bmpWidth:integer;
begin
Image1.Visible:=False;//設置Image1 和Scrollbox1 的可見性
scrollbox1.Visible:=False;
panel1.Align:=albottom;//設置Panel1 的位置
newbmp:= Tbitmap.Create;//創建一個圖像對象
//設置圖像的各項屬性
newbmp.Width:=Image1.Width;
newbmp.Height:=Image1.Height;
bmpHeight:=Image1.Height;
bmpWidth:=Image1.Width;
for i:=0 to bmpHeight do
//將一個畫布的矩形區域拷貝到另一個畫布的矩形區域
begin ewbmp.Canvas.copyrect(rect(0,bmpHeight-i,bmpWidth,bmpHeight),Image1.
Canvas,rect(0,0,bmpWidth,i));
Form1.Canvas.draw(0,0,newbmp);//窗體重繪
end;
newbmp.free;//釋放圖像對象
end;

（3）水平交錯效果的原理同垂直交錯效果的原理一樣，只是將分成兩組後的圖形分別由左右兩端移進屏幕。代碼如下：

//水平交錯效果
procedure TForm1.Button4Click(Sender: TObject);
var
newbmp:Tbitmap;
i,j,bmpHeight,bmpWidth:integer;
begin
Image1.Visible:=False;//設置Image1 和Scrollbox1 的可見性
scrollbox1.Visible:=False;
panel1.Align:=albottom;//設置Panel1 的位置
newbmp:= Tbitmap.Create;//創建一個圖像對象
//設置圖像的各項屬性
newbmp.Width:=Image1.Width;
newbmp.Height:=Image1.Height;
bmpHeight:=Image1.Height;
bmpWidth:=Image1.Width;
i:=0;
while i<=bmpWidth do
begin
j:=i;
while j >0 do
//將一個畫布的矩形區域拷貝到另一個畫布的矩形區域
begin
Image1.Visible:=False;
scrollbox1.Visible:=False;
panel1.Align:=albottom;
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(0,0,newbmp);//窗體重繪
i:=i+2;
end;
newbmp.free;//釋放圖像對象
end;

（4）雨滴效果的原理：將暫存圖形的最後一條掃描線，依序搬移到顯示位圖的第一條到最後一條掃描線，讓此條掃描線在屏幕上留下它的軌跡。接著再把暫存圖形的倒數第二條掃描線，依序搬移到顯示位圖的第一條到倒數第二條掃描線。其余的掃描線依此類推：

//雨滴效果
procedure TForm1.Button5Click(Sender: TObject);
var
newbmp:Tbitmap;
i,j,bmpHeight,bmpWidth:integer;
begin
Image1.Visible:=False;//設置Image1 和Scrollbox1 的可見性
scrollbox1.Visible:=False;
panel1.Align:=albottom;//設置Panel1 的位置
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 i do
//將一個畫布的矩形區域拷貝到另一個畫布的矩形區域
begin
newbmp.Canvas.copyrect(rect(0,j-1,bmpWidth,j),Image1.Canvas,rect(0,i-1,bmpWidth,i));
Form1.Canvas.draw(0,0,newbmp);//窗體重繪
end;
newbmp.free;//釋放圖像對象
end;

（5）積木效果的原理是雨滴效果的一種變化，不同之處在於，積木效果每次搬移的是一塊圖形，而不只是一根掃描線。代碼如下：

//積木效果
procedure TForm1.Button7Click(Sender: TObject);
var
newbmp:Tbitmap;
i,j,bmpHeight,bmpWidth:integer;
begin
Image1.Visible:=False;//設置Image1 和Scrollbox1 的可見性
scrollbox1.Visible:=False;
panel1.Align:=albottom;//設置Panel1 的位置
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(0,0,newbmp);//窗體重繪
end;
i:=i-10;
end;
newbmp.free;//釋放圖像對象
end;

（6）百葉窗效果的原理：將放在暫存圖形的數據分成若干組，然後依次從第一組到最後一組搬移，第一次每組各搬移第一條掃描線到顯示位圖的相應位置，第二次搬移第二條掃描線，接著搬移第三條、第四條掃描線。代碼如下：

//百葉窗效果
procedure TForm1.Button6Click(Sender: TObject);
var
newbmp:Tbitmap;
i,j,bmpHeight,bmpWidth:integer;
xgroup,xcount:integer;
begin
Image1.Visible:=False;//設置Image1 和Scrollbox1 的可見性
scrollbox1.Visible:=False;
panel1.Align:=albottom;//設置Panel1 的位置
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 to xgroup 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(0,0,newbmp);//窗體重繪
end;
newbmp.free;//釋放圖像對象
end;

（7）點擊“打開圖像”按鈕，可以導入選定的圖像文件。代碼如下：

procedure TForm1.Button1Click(Sender: TObject);
begin
OpenPictureDialog1.filter:=’Bitmap file(*.bmp)|*.bmp’;//文件格式過濾
Form1.OpenPictureDialog1.Title:=’請選擇一個圖像文件打開’;//打開對話框標題
Form1.OpenPictureDialog1.InitialDir:=’C:\My Documents\My Pictures’;//導入文件初始路徑
if OpenPictureDialog1.Execute then
Image1.Picture.LoadFromFile(openpicturedialog1.FileName);//導入圖像文件
Image1.Visible:=true;//設置Image1 和Scrollbox1 的可見性
scrollbox1.Visible:=true;
end;