{
這一課我會教您如何使用三種不同的紋理濾波方式。
教您如何使用鍵盤來移動場景中的對象，也會教您在OpenGL場景中應用簡單的光線。
這一課包含了很多內容，如果您對前面的課程有疑問的話，先回頭複習一下。
進入後面的程式碼之前，很好的理解基礎知識十分重要。
我們還是在第一課的程式碼上加以修改。
跟以前不一樣的是，只要有任何重大的改動，我都會寫出整段程式碼。
首先我們還要加進SysUtils單元和Glaux單元。
}
Uses
SysUtils,
opengl,
windows,
Messages,
Glaux In '../../GLAUX/Glaux.pas';
//下面幾行是增加新的變數。
//我們增加三個布林變數。
// light 變數追蹤光照是否開啟。
//變數lp和fp用來儲存'L' 和'F'鍵是否按下的狀態。
//後面我會解釋這些變數的重要性。現在，先放在一邊吧。
light : Boolean; // 光源的開/關
lp : Boolean; // L鍵按下了麼?
fp : Boolean; // F鍵按下了麼?
//現在設定5個變數來控制繞x軸和y軸旋轉角度的步長，
//以及繞x軸和y軸的旋轉速度。
//另外也創建了一個z變數來控制進入螢幕深處的距離。
xrot : GLfloat; // X 旋轉
yrot : GLfloat; // Y 旋轉
xspeed : GLfloat; // X 旋轉速度
yspeed : GLfloat; // Y 旋轉速度
z : GLfloat = -5.0 f; // 深入螢幕的距離
//接著設定用來建立光源的陣列。
//我們將使用兩種不同的光。
//第一種稱為環境光。環境光來自於四面八方。
//所有場景中的物件都處於環境光的照射中。
//第二種類型的光源叫做漫射光。
//漫射光由特定的光源產生，並在您的場景中的物件表面上產生反射。
//處於漫射光直接照射下的任何物件表面都變得很亮，
//而幾乎未被照射到的區域就顯得要暗一些。
//這樣在我們所創造的木板箱的稜邊上就會產生的很不錯的陰影效果。
//建立光源的過程和顏色的創建完全一致。
//前三個參數分別是RGB三色分量，最後一個是alpha通道參數。
//因此，下面的程式碼我們得到的是半亮(0.5f)的白色環境光。
//如果沒有環境光，未被漫射光照到的地方會變得十分黑暗。
LightAmbient : Array[0..3] Of GLfloat = (0.5, 0.5, 0.5, 1.0); //環境光參數( 新增)
//下一行程式碼我們產生最亮的漫射光。
//所有的參數值都取成最大值1.0f。
//它將照在我們木板箱的前面，看起來挺好。
LightDiffuse : Array[0..3] Of GLfloat = (1.0, 1.0, 1.0, 1.0); // 漫射光參數( 新增)
//最後我們儲存光源的位置。
//前三個參數和glTranslate中的一樣。
//依序分別是XYZ軸上的位移。
//由於我們想要光線直接照射在木箱的正面，所以XY軸上的位移都是0.0。
//第三個值是Z軸上的位移。
//為了確保光線總是在木箱的前面，
//所以我們將光源的位置朝著觀察者(就是您哪。)挪出螢幕。
//我們通常將螢幕也就是顯示器的螢幕玻璃所處的位置稱為Z軸的0.0點。
//所以Z軸上的位移最後定為2.0。
//假如您能看見光源的話，它就浮在您顯示器的前方。
//當然，如果木箱不在顯示器的螢幕玻璃後面的話，您也無法看見箱子。
//『譯者註：我很欣賞NeHe的耐心。
//說真的有時我都很煩了，這麼簡單的事他這麼廢話幹嘛？
//但如果什麼都清楚，您還會翻著這樣的頁面看個沒完麼？ ’
//最後一個參數取為1.0f。
//這將告訴OpenGL這裡指定的座標就是光源的位置，以後的教學我會多加解釋。
LightPosition : Array[0..3] Of GLfloat = (0.0, 0.0, 2.0, 1.0); // 光源位置( 新增)
//filter 變數追蹤顯示時所採用的紋理類型。
//第一種紋理(texture 0) 使用gl_nearest(不光滑)濾波方式建構。
//第二種紋理(texture 1) 使用gl_linear(線性濾波) 方式，
//離螢幕越近的影像看起來就越光滑。
//第三種紋理(texture 2) 使用mipmapped濾波方式,
//這將會創造一個外觀十分優秀的紋理。
//根據我們的使用類型，filter 變數的值分別等於0, 1 或2 。
//下面我們從第一種紋理開始。
//texture為三種不同紋理分配儲存空間。
//它們分別位於在texture[0], texture[1] 和texture[2]中。
filter : GLuint; // 濾波型
texture : Array[0..2] Of GLuint; // 3種紋理的儲存空間
PRocedure glGenTextures(n: GLsizei; Var textures: GLuint); stdcall; external
opengl32;
Procedure glBindTexture(target: GLenum; texture: GLuint); stdcall; external
opengl32;
Function gluBuild2DMipmaps(target: GLenum; components, width, height: GLint;
format, atype: GLenum; data: Pointer): Integer; stdcall; external glu32 name
'gluBuild2DMipmaps';
{
現在載入一個點陣圖，並用它來建立三種不同的紋理。
這一課使用glaux輔助庫來載入點陣圖，
因此在編譯時您應該確認是否包含了glaux函式庫。
我知道Delphi和VC++都包含了glaux庫，但別的語言不能保證都有。
『譯者註：glaux是OpenGL輔助庫，根據OpenGL的跨平台特性，
所有平台上的程式碼都應通用。但輔助庫不是正式的OpenGL標準函式庫，
沒有出現在所有的平台上。但正好在Win32平台上可用。
呵呵，BCB當然也沒問題了。 ’這裡我只對新增的程式碼做註解。
如果您對某行程式碼有疑問的話，請查看教學六。
那一課很詳細的解釋了載入、創造紋理的內容。
在上一段程式碼後面及glResizeWnd ()之前的位置，
我們增加了下面的程式碼。這和第六課中載入點陣圖的程式碼幾乎相同。
}
Function LoadBmp(filename: pchar): PTAUX_RGBImageRec;
Var
BitmapFile : Thandle; // 檔案句柄
Begin
If Filename = '' Then // 確保檔案名稱已提供。
result := Nil; // 如果沒提供，回傳NULL
BitmapFile := FileOpen(Filename, fmOpenWrite); //嘗試開啟文件
If BitmapFile > 0 Then // 檔案存在麼?
Begin
FileClose(BitmapFile); // 關閉句柄
result := auxDIBImageLoadA(filename); //載入點陣圖並傳回指針
End
Else
result := Nil; // 如果載入失敗，回傳NiL。
End;
Function LoadTexture: boolean; // 載入點陣圖並轉換成紋理
Var
Status : boolean; // Status 指示器
TextureImage : Array[0..1] Of PTAUX_RGBImageRec; // 建立紋理的儲存空間
Begin
Status := false;
ZeroMemory(@TextureImage, sizeof(TextureImage)); // 將指標設為NULL
TextureImage[0] := LoadBMP('Walls.bmp');
If TextureImage[0] <> Nil Then
Begin
Status := TRUE; // 將Status 設為TRUE
glGenTextures(1, texture[0]); // 建立紋理
//第六課我們使用了線性濾波的紋理貼圖。
//這需要機器有相當高的處理能力，但它們看起來很不錯。
//這一課中，我們接著要創造的第一種紋理使用GL_NEAREST方式。
//從原理上講，這種方式沒有真正進行濾波。
//它只佔用很小的處理能力，看起來也很差。
//唯一的好處是這樣我們的工程在很快和很慢的機器上都可以正常運作。
//您會注意到我們在MIN 和MAG 時都採用了GL_NEAREST,
//你可以混合使用GL_NEAREST 和GL_LINEAR。
//紋路看起來效果會好些，但我們更在乎速度，所以全採用低品質貼圖。
//MIN_FILTER在影像繪製時小於貼圖的原始尺寸時採用。
//MAG_FILTER在影像繪製時大於貼圖的原始尺寸時採用。
// 建立Nearest 濾波貼圖
glBindTexture(GL_TEXTURE_2D, texture[0]);
// 產生紋理
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST); // ( 新增)
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST); // ( 新增)
glTexImage2D(GL_TEXTURE_2D, 0, 3, TextureImage[0].sizeX,
TextureImage[0].sizeY, 0, GL_RGB, GL_UNSIGNED_BYTE,
TextureImage[0].data);
//下個紋理與第六課的相同，線性濾波。唯一的不同是這次放在了
//texture[1]中。因為這是第二個紋理。如果放在
//texture[0]中的話，他將覆蓋前面創建的GL_NEAREST紋理。
glBindTexture(GL_TEXTURE_2D, texture[1]); // 使用來自點陣圖資料產生的典型紋理
// 產生紋理
glTexImage2D(GL_TEXTURE_2D, 0, 3, TextureImage[0].sizeX,
TextureImage[0].sizeY, 0, GL_RGB, GL_UNSIGNED_BYTE,
TextureImage[0].data);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR); // 線形濾波
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR); // 線形濾波
//下面是建立紋理的新方法。 Mipmapping!
//『譯者註：這個字的中文我翻不出來，不過沒關係。看完這一段，就知道意思最重要。 ’
//您可能會注意到當圖像在螢幕上變得很小的時候，很多細節將會丟失。
//剛才還很不錯的圖案變得很難看。當您告訴OpenGL創建一個mipmapped的紋理後，
//OpenGL將嘗試創建不同尺寸的高品質紋理。當您向螢幕繪製一個mipmapped紋理的時候，
//OpenGL將選擇它已經創建的外觀最佳的紋理(帶有更多細節)來繪製，
//而不僅僅是縮放原先的圖像(這將導致細節丟失)。
//我曾經說過有辦法可以繞過OpenGL對紋理寬度和高度所加的限制－64、128、256，等等。
//辦法就是gluBuild2DMipmaps。根據我的發現，您可以使用任意的點陣圖來創建紋理。
//OpenGL將自動將它縮放到正常的大小。
//因為是第三個紋理，我們將它存到texture[2]。這樣本課中的三個紋理全都創建好了。
// 建立MipMapped 紋理
glBindTexture(GL_TEXTURE_2D, texture[2]);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER,
GL_LINEAR_MIPMAP_NEAREST); // ( 新增)
//下面一行產生mipmapped 紋理。
//我們使用三種顏色(紅，綠，藍)來產生一個2D紋理。
//TextureImage[0].sizeX 是位圖寬度，
//TextureImage[0].sizeY 是點陣圖高度，
//(====不知為什麼，delphi下這個函數沒有height這個參數,
//但幫助中卻有，不知delphi再搞什麼,鬱悶ing......
//最後我在前面自己寫了一個gluBuild2DMipmaps,
//來載入glu32.dll中的gluBuild2DMipmaps函數=====)
//GL_RGB意味著我們依序使用RGB色彩。
//GL_UNSIGNED_BYTE 意味著紋理資料的單位是位元組。
//TextureImage[0].data指向我們建立紋理所使用的點陣圖。
gluBuild2DMipmaps(GL_TEXTURE_2D, 3, TextureImage[0].sizeX,
TextureImage[0].sizey, GL_RGB, GL_UNSIGNED_BYTE,
TextureImage[0].data); //(新增) }
End;
If assigned(TextureImage[0]) Then // 紋理是否存在
If assigned(TextureImage[0].data) Then // 紋理影像是否存在
TextureImage[0].data := Nil; // 釋放紋理影像所佔用的內存
TextureImage[0] := Nil; // 釋放圖像結構
result := Status; // 回傳Status
End;
//接著應該載入紋理並初始化OpenGL設定了。
//GLInit函數的第一行使用上面的程式碼載入紋理。
//建立紋理之後，我們呼叫glEnable(GL_TEXTURE_2D)啟用2D紋理映射。
//陰影模式設為平滑陰影( smooth shading ）。
//背景色設為黑色，我們啟用深度測試，然後我們啟用最佳化透視計算。
Procedure glInit(); // 此處開始對OpenGL進行所有設置
Begin
If (Not LoadTexture) Then // 呼叫紋理載入子例程
exit; // 若未能載入，退出
glEnable(GL_TEXTURE_2D); // 啟用紋理映射
glShadeModel(GL_SMOOTH); // 啟用陰影平滑
glClearColor(0.0, 0.0, 0.0, 0.0); // 黑色背景
glClearDepth(1.0); // 設定深度緩存
glEnable(GL_DEPTH_TEST); // 啟用深度測試
glDepthFunc(GL_LESS); // 所做深度測試的型別
glHint(GL_PERSPECTIVE_CORRECTION_HINT, GL_NICEST); //高度最佳化的透視投影計算
//現在開始設定光源。下面下面一行設定環境光的發光量，
//光源light1開始發光。
//這一課的開始處我們我們將環境光的發光量存放在LightAmbient數組中。
//現在我們就使用此數組(半亮度環境光)。
glLightfv(GL_LIGHT1, GL_AMBIENT, @LightAmbient[0]); // 設定環境光
//接下來我們設定漫射光的發光量。它存放在LightDiffuse數組中(全亮度白光)。
glLightfv(GL_LIGHT1, GL_DIFFUSE, @LightDiffuse[0]); // 設定漫射光
//然後設定光源的位置。
//位置存放在LightPosition 陣列中
//(剛好位於木箱前方的中心，X－0.0，Y－0.0，Z方向移向觀察者2個單位<位於螢幕外面>)。
glLightfv(GL_LIGHT1, GL_POSITION, @LightPosition); // 光源位置
//最後，我們啟用一號光源。我們還沒有啟用GL_LIGHTING，
//所以您看不見任何光線。
//記住：只對光源進行設定、定位、甚至啟用，光源都不會運作。
//除非我們啟用GL_LIGHTING。
glEnable(GL_LIGHT1); // 啟用一號光源
End;
//下一段程式碼繪製貼圖立方體。我只對新增的程式碼進行註解。
//如果您對沒有註解的程式碼有疑問，請回頭看看第六課。
Procedure glDraw(); // 從這裡開始進行所有的繪製
Begin
glClear(GL_COLOR_BUFFER_BIT Or GL_DEPTH_BUFFER_BIT); // 清除螢幕與深度緩存
glLoadIdentity(); // 重置目前的模型觀察矩陣
//下三行程式碼放置並旋轉貼圖立方體。
//glTranslatef(0.0,0.0,z)將立方體沿著Z軸移動Z單位。
//glRotatef(xrot,1.0f,0.0f,0.0f)將立方體繞X軸旋轉xrot。
//glRotatef(yrot,0.0f,1.0f,0.0f)將立方體繞Y軸旋轉yrot。
glTranslatef(0.0, 0.0, z); // 移入/移出螢幕z 個單位
glRotatef(xrot, 1.0, 0.0, 0.0); // 繞X軸旋轉
glRotatef(yrot, 0.0, 1.0, 0.0); // 繞Y軸旋轉
//下一行與我們在第六課的類似。
//有所不同的是，這次我們綁定的紋理是texture[filter]，
//而不是上一課中的texture[0]。
//任何時候，我們按下F鍵，filter 的值就會增加。
//如果這個數值大於2，變數filter 將會被重設為0。
//程式初始時，變數filter 的值也會設為0。
//使用變數filter 我們就可以選擇三種紋理中的任一種。
glBindTexture(GL_TEXTURE_2D, texture[filter]); // 選擇filter決定的紋理
glBegin(GL_QUADS); // 開始繪製四邊形
//glNormal3f是這一課的新東西。 Normal就是法線的意思，
//所謂法線是指經過面(多邊形）上的一點且垂直於這個面(多邊形)的直線。
//使用光源的時候必須指定一條法線。法線告訴OpenGL這個多邊形的朝向，並指明多邊形的正面和背面。
//如果沒有指定法線，什麼怪事情都可能發生：不該照亮的面被照亮了，多邊形的背面也被照亮....。
//對了，法線應該指向多邊形的外側。看著木箱的前面您會注意到法線與Z軸正向同向。
//這表示法線正指向觀察者－您自己。這正是我們所希望的。
//對於木箱的背面，也正如我們所要的，法線背對著觀察者。
//如果立方體沿著X或Y軸轉個180度的話，前側面的法線仍然朝著觀察者，背面的法線也還是背對著觀察者。
//換句話說，不管是哪個面，只要它朝向觀察者這個面的法線就指向觀察者。
//由於光源緊鄰觀察者，任何時候法線對著觀察者時，這個面就會被照亮。
//而且法線越朝著光源，就顯得越亮一些。
//如果您把觀察點放到立方體內部，你就會法線裡面一片漆黑。
//因為法線是向外指的。如果立方體內部沒有光源的話，當然是一片漆黑。
// 前面
glNormal3f(0.0, 0.0, 1.0); // 法線指向觀察者
glTexCoord2f(0.0, 0.0);
glVertex3f(-1.0, -1.0, 1.0); // 紋理與四邊形的左下
glTexCoord2f(1.0, 0.0);
glVertex3f(1.0, -1.0, 1.0); // 紋理與四邊形的右下
glTexCoord2f(1.0, 1.0);
glVertex3f(1.0, 1.0, 1.0); // 紋理和四邊形的右上
glTexCoord2f(0.0, 1.0);
glVertex3f(-1.0, 1.0, 1.0); // 紋理和四邊形的左上
// 後面
glNormal3f(0.0, 0.0, -1.0); // 法線背向觀察者
glTexCoord2f(1.0, 0.0);
glVertex3f(-1.0, -1.0, -1.0); // 紋理與四邊形的右下
glTexCoord2f(1.0, 1.0);
glVertex3f(-1.0, 1.0, -1.0); // 紋理和四邊形的右上
glTexCoord2f(0.0, 1.0);
glVertex3f(1.0, 1.0, -1.0); // 紋理和四邊形的左上
glTexCoord2f(0.0, 0.0);
glVertex3f(1.0, -1.0, -1.0); // 紋理與四邊形的左下
// 頂面
glNormal3f(0.0, 1.0, 0.0); // 法線向上
glTexCoord2f(0.0, 1.0);
glVertex3f(-1.0, 1.0, -1.0); // 紋理和四邊形的左上
glTexCoord2f(0.0, 0.0);
glVertex3f(-1.0, 1.0, 1.0); // 紋理與四邊形的左下
glTexCoord2f(1.0, 0.0);
glVertex3f(1.0, 1.0, 1.0); // 紋理與四邊形的右下
glTexCoord2f(1.0, 1.0);
glVertex3f(1.0, 1.0, -1.0); // 紋理和四邊形的右上
// 底面
glNormal3f(0.0, -1.0, 0.0); // 法線朝下
glTexCoord2f(1.0, 1.0);
glVertex3f(-1.0, -1.0, -1.0); // 紋理和四邊形的右上
glTexCoord2f(0.0, 1.0);
glVertex3f(1.0, -1.0, -1.0); // 紋理和四邊形的左上
glTexCoord2f(0.0, 0.0);
glVertex3f(1.0, -1.0, 1.0); // 紋理與四邊形的左下
glTexCoord2f(1.0, 0.0);
glVertex3f(-1.0, -1.0, 1.0); // 紋理與四邊形的右下
// 右邊
glNormal3f(1.0, 0.0, 0.0); // 法線朝右
glTexCoord2f(1.0, 0.0);
glVertex3f(1.0, -1.0, -1.0); // 紋理與四邊形的右下
glTexCoord2f(1.0, 1.0);
glVertex3f(1.0, 1.0, -1.0); // 紋理和四邊形的右上
glTexCoord2f(0.0, 1.0);
glVertex3f(1.0, 1.0, 1.0); // 紋理和四邊形的左上
glTexCoord2f(0.0, 0.0);
glVertex3f(1.0, -1.0, 1.0); // 紋理與四邊形的左下
// 左面
glNormal3f(-1.0, 0.0, 0.0); // 法線朝左
glTexCoord2f(0.0, 0.0);
glVertex3f(-1.0, -1.0, -1.0); // 紋理和四邊形的左下
glTexCoord2f(1.0, 0.0);
glVertex3f(-1.0, -1.0, 1.0); // 紋理與四邊形的右下
glTexCoord2f(1.0, 1.0);
glVertex3f(-1.0, 1.0, 1.0); // 紋理和四邊形的右上
glTexCoord2f(0.0, 1.0);
glVertex3f(-1.0, 1.0, -1.0); // 紋理和四邊形的左上
glEnd();
xrot := xrot + xspeed; // xrot 增加xspeed 單位
yrot := Yrot + yspeed; // yrot 增加yspeed 單位
End;
//現在轉入WinMain()主函式。
//我們將在這裡增加開關光源、旋轉木箱、切換過濾方式以及將木箱移近移遠的控制代碼。
//在接近WinMain()函式結束的地方你會看到SwapBuffers(hDC)這行程式碼。
//然後就在這一行後面加入如下的程式碼。
//程式碼將檢查L鍵是否按下過。
//如果L鍵已按下，但lp的值不是false的話，表示L鍵還沒放開，這時什麼事都不會發生。
SwapBuffers(h_DC); // 交換緩存(雙緩存)
If (keys[ord('L')] And Not lp) Then
Begin
//如果lp的值是false的話，
//表示L鍵還沒按下，或是已經放開了，接著lp將被設為TRUE。
//同時檢查這兩個條件的原因是為了防止L鍵被按住後，
//這段程式碼被重複執行，並導致窗體不停閃爍。
//lp設為true之後，計算機就知道L鍵按了，
//我們則據此可以切換光源的開/關：布林變數light控制光源的開關。
lp := true; // lp 設為TRUE
light := Not light; // 切換光源的TRUE/FALSE
If Not light Then // 如果沒有光源
glDisable(GL_LIGHTING) //停用光源
Else // Otherwis
glEnable(GL_LIGHTING); //啟用光源
End;
If Not keys[ord('L')] Then //L鍵鬆開了麼?
lp := FALSE; // 若是，則將lp設為FALSE
//然後對"F"鍵作相似的檢查。
//如果有按下"F"鍵且"F"鍵沒有處於按著的狀態或它就從來沒有按下過，
//將變數fp設為true。這意味著這個鍵正被按著呢。
//接著將filter變數加一。如果filter變數大於2
//(因為這裡我們的使用的陣列是texture[3],大於2的紋理不存在)，
//我們重置filter變數為0。
If (keys[ord('F')] And Not fp) Then // F鍵按下了什麼?
Begin
fp := TRUE; // fp 設為TRUE
inc(filter); // filter的值加一
If filter > 2 Then // 大於2了麼?
filter := 0; // 若是重設為0
End;
If Not keys[ord('F')] Then //F鍵放開了什麼?
fp := FALSE; // 若是fp設為FALSE
//這四行檢查是否按下了PageUp鍵。若是的話，減少z變數的值。這樣DrawGLScene函數中包含的glTranslatef(0.0f,0.0f,z)呼叫將使木箱離觀察者更遠一點。
If keys[VK_PRIOR] Then //PageUp按下了?
z := z - 0.02; // 若按下，將木箱移向螢幕內部。
//接著四行檢查PageDown鍵是否按下，若是的話，增加z變數的值。這樣DrawGLScene函數中所包含的glTranslatef(0.0f,0.0f,z)呼叫將使木箱向著觀察者移近一點。
If keys[VK_NEXT] Then // PageDown按下了麼?
z := z + 0.02; //若按的話，將木箱移向觀察者。
//現在檢查方向鍵。按下左右方向鍵xspeed相應減少或增加。
//按下上下方向鍵yspeed會相應減少或增加。
//記得在以後的教學中如果xspeed、yspeed的值增加的話，立方體就轉的更快。
//如果一直按著某個方向鍵，立方體會在那個方向上轉的越快。
If keys[VK_UP] Then // Up方向鍵按下了麼?
xspeed := xspeed - 0.01; //若是,減少xspeed
If keys[VK_DOWN] Then //Down方向鍵按下了麼?
xspeed := xspeed + 0.01; //若是,增加xspeed
If keys[VK_RIGHT] Then //Right方向鍵按下了麼?
yspeed := yspeed + 0.01; //若是,增加yspeed
If keys[VK_LEFT] Then //Left方向鍵按下了麼?
yspeed := yspeed - 0.01; //若是, 減少yspeed
If (keys[VK_ESCAPE]) Then // 若按下了ESC鍵
finished := True
運行看看效果