Scratch劇場式動畫效果

對于《電腦報》的忠實讀者來說，小陳老師之前帶著大家做了很多Scratch小游戲，像貪吃蛇、貓抓老鼠、火箭降落等等，這些游戲作品都有一個共同點，背景基本上是不動的，運動的只是角色本身而已，如果只通過簡單的積木代碼只能實現簡單的切換背景圖片效果。但是在現實的游戲和案例中，不少游戲背景地圖都非常龐大。而且背景是變化多樣的，需要在背景圖切換的過程中做到無縫銜接，有時還需要把背景圖進行翻轉對接等。

不要覺得這些效果非常簡單，無非就是改變坐標加上旋轉角度參數產生變化，其實里面有著大學問呢，今天就和大家一起完成劇場式逼真的動畫效果。這次我們要完成小貓奔跑的動畫場景，隨著小貓的奔跑我們主要目標是實現背景圖片的無縫切換。

1. 高精度小貓

首先我們需要一個高精度版的小貓替換原版小貓。這個小貓角色“Scratch Cat”已上傳至百度云，請關注“壹零社”，點擊編程相關獲取網盤地址，你可以在2021-39文件夾中找到它。這個小貓角色中包含了更多造型比如奔跑、旋轉跳街舞等，大家可以復用在各種程序中（圖1）。

在程序中，我們只要把小貓放入指定的位置，切換成跑步的初始造型，重復循環執行切換下一個造型，當超出跑步編號（編號小于7）的數值范圍后，換回到初始的造型（run-01），周而復始，重復跑步的造型，效果還是非常逼真的（圖2）。

2. 山岳背景動畫

完成角色的運動動畫之后，我們把編程重點轉向背景。背景分成三個部分，陸地和山丘還有天空。

最簡單的天空背景就是在舞臺背景中填充藍色，加上一個小太陽就完成了。

重點在陸地和山丘，這兩個背景圖都是我們手工繪制完成的，大家也可以發揮自己的繪畫能力去美化一下。

圖3是山丘的背景圖，注意用紅色數字標記的四個區域，我們在制作背景的時候需要做出重合堆疊拼接的效果，所以要注意紅框區域左右兩邊高度盡量保持一致。我在左右兩邊點上一個不起眼的小點（這樣在移動的過程中可以保持比較好的美感）。完成好一幅背景后，可以通過復制后修改顏色的方法做出有區別的造型。

代碼方面我們需要增加三個新的變量：變量“scroll speed”表示背景運動速度，用來控制背景移動的快慢。我將scroll speed值設置為0.25，可自行調整（值越大速度越快）。

變量“CAMERA X”表示運動的距離，該變量僅適用于當前角色，并且設置為滑桿動態效果，修改成滑桿效果，我們只需要拖動滑桿就可以看到類似回播視頻的效果。

變量“X”代表X軸長度，我們已知舞臺寬度480所以X每次需增加480。

當程序運行后，設置默認背景運動速度0.25，切換到背景造型1，克隆自己，并且切換下一個造型，將X增加480（把克隆體平移一個舞臺的距離），執行廣播begin（圖4）。

在廣播中用變量控制背景的移動，當背景循環拼接結束后又可以重新恢復到初始的位置繼續進行循環移動。這里要求大家有空間思維能力和數學計算能力設計出合適的計算公式，背景的移動等于舞臺寬度減去背景移動速度乘目前已經移動的距離（CAMERA X）除以960（造型有兩個背景寬度480×2）減去480（圖5）。

3. 地面背景動畫

山丘背景完成后，我們新建一個角色用來表示近處地面的場景，這里大家可以發揮自己的創意多繪制一些小石頭、花花草草等，放在不同的造型中。小陳老師只隨便動手繪制了三幅不同的背景，有石頭有蘋果樹等，目的是背景移動的過程中可以看到更多不同的場景實現切換效果，僅供參考。

代碼和山丘部分的代碼類似，因為增加了一個造型，所以相應克隆代碼也多了一份，480的寬度也需要乘以3了（圖6）。

另外還增加了變量“CAMERA Y”，可以控制地面部分在背景中上下移動，代碼編寫成功后運行程序可以看到一只歡快的小貓在森林中奔跑的場景，細節滿滿（圖7）。

通過本次實驗我們又學會了新的知識，大家在空余時間可以研究一下是否可以將背景也制作融入進去，變成一幅白天到黑夜的漸變過程，期待你們帶來驚喜哦（圖8）。