GameMaker｜Camera｜滑鼠點方塊｜幼幼班08

這篇內容，將會以實戰教學的方式，讓各位認識GameMaker中的Camera。

本篇教學所使用的系統是Windows 10，如果有按鍵相關的說明，會用Windows的系統來解釋。如果你用的是Mac系統，再麻煩自行換成相對應的按鍵。

前置知識

在學習本篇內容之前，最好具備以下的前置知識，以免看不懂這篇教學的內容。

• GameMaker｜教學分類指南
• GameMaker｜遊戲製作原理｜簡易介紹｜幼幼班01
• GameMaker｜安裝教學｜更改語系｜幼幼班02
• GameMaker｜開啟Project｜調整Layout｜幼幼班03
• GameMaker｜介面導覽｜幼幼班04
• GameMaker｜Sprite｜滑鼠點方塊｜幼幼班05
• GameMaker｜Object｜滑鼠點方塊｜幼幼班06
• GameMaker｜Room｜滑鼠點方塊｜幼幼班07

實戰範例：滑鼠點方塊

從幼幼班05開始，我會一邊講解GameMaker的基礎功能，一邊加入實戰的操作，讓各位能完成這個，看起來蠻無聊的「滑鼠點方塊」遊戲。

實戰範例：滑鼠點方塊

Camera的簡介

Camera的中文翻譯是相機，他的用途，是用來設定，玩家們能看到的「鏡頭畫面」。

各位可以理解成，有一台相機，他會依照遊戲的需求，在Room上面進行移動。而我們最終看到的，就是這台相機在移動中，所攝影出來的畫面。

用一台相機來顯示遊戲畫面，是比較基礎的用法。如果開發者有需要，也能使用多個Camera，來顯示多個遊戲畫面，概念就很像是，保全室裡面的監視器畫面。

另外，至少會需要有一個Camera，GameMaker才能正常執行遊戲，這點是跟Room的需求是一樣的。

設定Camera的方法

Camera是比較特別的物件，無法直接在Asset Browser中直接生成，而是只能透過Room裡面的參數，或是利用程式碼的方式，來進行相關設定。

假設我們沒有透過程式碼，來設定相機的話，那GameMaker就會使用Room裡面的設定，來生成一個預設的相機。

本次的實戰範例，只會使用到Room裡面的設定。用程式碼來設定Camera，是屬於中高階的用法，並不適合當作幼幼班的教學內容。

Viewport的簡介

在正式設定Camera的參數之前，我們還需要了解，什麼是Viewport。

Viewport的中文翻譯是視窗，各位可以把他理解成是「Camera的外接螢幕」。簡單來說，他的用途就是用來放大(或縮小)Camera的輸出畫面。

舉例來說，我們設計了一款遊戲，使用的Camera大小是640*360，但這對主流的電腦螢幕來說太小了。

因此我們能設定一個Viewport，大小為1920*1080，並把這個Camera「串接」到Viewport上。這樣就能在電腦螢幕上，顯示出1920*1080的遊戲畫面了。

進行Camera的設定

先在Asset Browser中，雙擊叫出rm_main，此時在左側的Inspector中，可以找到「Viewports and Cameras」的標籤，點擊後，下方會出現設定的選項。

首先，我們先把「Enable Viewports」的參數打勾，這樣Camera才能串接到Viewport上面。在沒有勾選的狀況下，會直接顯示Camera的畫面大小。

接著，我們能看到下方有很多的Viewport，這表示我們能一次使用多個Viewport。而在實戰範例中，我們只需要使用到一個，所以我們點擊「Viewport 0」的標籤。

點擊後，會出現很多的參數，找到「Visible」的參數並打勾，這樣表示我們要顯示Viewport 0這個畫面。

串接完成後，接著只要設定好寬高大小，Camera的設定就算完成了。

在這次的實戰範例中，Camera的大小和Room是一樣大的，而且不需要進行任何的移動。而Viewport寬高則是Camera大小的5倍。

在Viewport 0的標籤裡，能找到Camera和Viewport的寬(Width)高(Height)參數。將Camera設定成240*160，Viewport則是設定成1200*800。

_{備註：其他的參數請保持不變，未來的教學裡如果有使用到，會在進行詳細的說明。}

調整寬高的流程圖

🔔如果內容對你有幫助，可以按個喜歡，這樣就能讓更多人，接觸到這些棒棒的內容🔔

✨祝各位也能開心的做出好遊戲✨