畫面是怎麼動起來的

翻頁動畫

不知道小朋友們有沒有玩過手翻書。當我們用很快的速度翻書時，因為相鄰的兩頁圖畫是連續且不同的，所以就會產生動畫的效果。這個例子告訴我們：

動畫其實是由一系列相似但不同的圖畫快速切換形成的，包括

• 位置的移動
• 畫面的切換

位置的移動

一個最簡單的動畫可以這樣製作：

1. 大家在一頁紙上畫一個吃豆人
2. 然後再下一頁紙上畫同樣的吃豆人，只是小球在紙上的位置不同
3. 重複第２步，直到畫夠了

因為每次吃豆人的位置不同，所以在快速翻動的時候會形成移動的效果

• 因為吃豆人的位置是會變的，所以我們用變量來存放它的位置

畫面的切換

在奔跑的吃豆人中，我們總共只用到了兩張圖片。吃豆人的嘴巴吧唧吧唧的效果就是通過在這兩張圖片之間的不斷切換形成的

用C++畫出上面的兩個吃豆人有些複雜，所以在我們用其他方式畫好這兩個吃豆人之後，將它們保存成圖片，接下來我們需要把圖片加載到程序里

循環——重複的藝術

循環就是重複地做某些事情，計算機做起重複的事情來要比人類優雅很多

吃豆人在跑起來的時候，只做了兩件事情。整個過程其實就是這兩件事情的循環往複，也就是１，２，１，２，１，２…………

1. 位置在前一次的基礎上右移１０個單位
2. 張嘴或者閉嘴，也就是呈現一張圖片

計算機很擅長做重複的事情的，只要你通過正確的語句告訴他怎麼做，做多少次

• ｆｏｒ循環——重複指定的次數

我們讓吃豆人圖片每次向右移動１０，當第奇數次移動時張嘴，第偶數次移動時閉嘴。做５０次。用ｆｏｒ循環可以這樣寫

全部代碼

以下就是我們完整的代碼，你學會了嗎？

#include <graphics.h>  
#include <conio.h>
#include <stdio.h>
int main()
{
	initgraph(1000, 1000);
	int left = 10;
	int top = 50;
	setbkcolor(WHITE);
	cleardevice();

	IMAGE img1, img2;
	loadimage(&img1, L"C:\Users\ginger\Desktop\ball.png", 200, 200); //載入圖片，使用L+"絕對路徑"
	loadimage(&img2, L"C:\Users\ginger\Desktop\ball2.png", 200, 200);
	for (int i = 1; i <= 50; i++) {
		if (i % 2 == 0) {
			cleardevice();
			putimage(left, top, &img1);
		}
		else if (i % 2 == 1) {
			cleardevice();
			putimage(left, top, &img2);
		}
		left += 10;
		Sleep(150);
	}
	_getch();  
	closegraph();  
	return 0;
}