視差效果

這篇文章會介紹，如何在 Scratch 裡建立五個角色，透過重複無限次、定位、圖層、跟隨滑鼠...等積木，實作簡單的視差效果。

• 什麼是「視差效果」呢？就是當眼睛在看東西時，越靠近眼睛的東西移動幅度愈大，越遠離的東西移動幅度越小，所以只需要計算不同角色的 x 或 y 座標，就能做出視差效果。

• 相關文章參考：重複、x/y 設為、圖層、跟隨滑鼠。

角色設定

在角色編輯區，刪除貓咪角色，加入三隻恐龍和一棵樹的新角色 ( 參考：Scratch 角色設定 )。

接著使用繪畫，使用「方形」，繪製一個地面的新角色 ( 參考：造型與繪圖 )。

完成後，在角色區域應該可以看到五個角色 ( 三隻恐龍、一棵樹和一個土地 )。

積木程式原理

除了地面之外，其他四個角色都需要撰寫對應的程式，程式積木如下：

• 紅色三角龍：

  紅色三角龍因為是在最前方，所以進行 xy 座標定位之後，使用「圖層移到最上層」，避免被其他角色遮住，接著使用重複無限次積木，將角色的 x 座標設定為滑鼠 x 座標的相反方向，除以滑鼠座標的數字設定為 -5 ( 數字越小，則移動的幅度越小 )。

  定位的 x 數值，在移動時要先加入計算，避免位置跑掉。

  

• 藍色雷龍：

  藍色雷龍角色積木和紅色三角龍角色類似，但因為藍色雷龍是在第二層，所以「先將圖層移到最上層，再降低一層」，然後除以滑鼠座標的數字設定為 -10 ( 比紅色三角龍小，所以移動的幅度會比較小 )

  

• 綠色暴龍：

  綠色暴龍角色積木和藍色雷龍角色幾乎相同，差別只在於圖層要下移 2 層，然後除以滑鼠座標的數字設定為 -20 ( 比藍色雷龍小，所以移動的幅度會比較小 )

  

• 樹木：

  樹木角色積木和綠色暴龍角色幾乎相同，差別只在於使用圖層移到最下層，然後除以滑鼠座標的數字設定為 -30 ( 比綠色暴龍小，所以移動的幅度會比較小 )

  

完成效果

完成後，點擊綠旗，用滑鼠在舞台上移動，就可以看到簡單的視差效果。

範例解答

範例解答：視差效果

延伸練習

如果已經熟悉了視差效果的原理，還可以嘗試更多好玩的作法：

• 加入「上下移動」也可以有視差效果。( 解答 )

  

意見回饋

如果有任何建議或問題，可傳送「意見表單」給我，謝謝～