GMS2官方教程系列5/8——繪製文字

這節教程的目的是在遊戲畫面中繪製文字，我們在遊戲中經常會使用一些文字性的內容，比如生命值、人物等級、遊戲分數等等，當然有一些遊戲中可能會用圖片直接取代文字，或是用圖片繪製出一些華麗的文字效果，但還是有一些場合更適合直接寫字，畢竟文字更靈活可變，並且消耗性能也更低一些。這個教程將以繪製積分為例來介紹文字繪製的操作以及如何調整字體。首先我們要創建一個對象，不過這個對象不同以往，我們不需要指定關聯的精靈，因為這個對象並不需要被玩家看到，這是一個不可見的對象，它存在的意義只是為了觸發和控制繪製文字，創建好這個對象以後，我們先設置一個「create」事件，然後在其中定義一個分數變數，並設置為0:

這個變數是我們用來記錄遊戲中玩家取得的積分的，這樣我們在繪製文字的時候才有一個確切的內容可以去寫。

可能會有人注意到，我一直都是在說「繪製文字」，因為在遊戲中所有可見的內容都是被」繪製「出來的，因此我們要想在遊戲中繪製文字，就需要用到」繪製「事件，繪製事件有很多，而我們在這裡需要用的是最基本的」繪製事件「如下圖：

我們在這個繪製方法中寫入以下內容：

var cx = camera_get_view_x(view_camera[0]);var cy = camera_get_view_y(view_camera[0]);var cw = camera_get_view_width(view_camera[0]);draw_text (cx+cw/2,cy+25,string(thescore))

在這裡我們又定義了三個變數，但是我們在定義變數時在前面使用了「var」這個方法，這樣定義出來的變數只在當前方法中有效，這樣可以儘可能節約內存佔用提升性能。然後我們所定義的cx、cy和cw都是根據上節教程中所使用的鏡頭「view_camera[0]"的不同屬性而來的

• cx就是鏡頭在場景中的x坐標值
• cy就是鏡頭在場景中的y坐標值
• cw就是鏡頭本身的寬度屬性

我們設置這樣三個變數，是為了確認我們積分文字繪製的位置，看上圖最下方，我們使用了一個「draw_text」的方法來繪製文字，而這個方法在下方的參數提示區中可以看到一共需要三個參數，分別是繪製文字位置的x、y坐標和需要繪製的文字內容。而我們設定的三個值就是為了用來確定這個繪製位置的，因為我希望將分數放在畫面中央靠上的位置，而且上節課我們已經設定過鏡頭，知道遊戲畫面會隨著遊戲鏡頭滾動，但我們不希望這個積分也跟著滾動，我們希望積分永遠固定在鏡頭中的某個位置，這樣不管我們控制飛船跑到什麼地方，都能隨時觀察自己獲得的積分。所以我們要把文字的繪製坐標關聯到鏡頭的坐標上，確保積分相對於鏡頭的位置是固定不變的。

• x ： cx + cw/2

因為鏡頭的原點在左上角，因此相對於遊戲場景而已，鏡頭的x在0的位置，而我們希望文字能在水平方向上位於鏡頭的中央，所以需要加上鏡頭寬度的一半來作為文字繪製的x坐標

• y ： cy + 25

同樣的，鏡頭在遊戲場景中的y坐標也是0，我們希望積分稍微向下而不是完全貼在邊上，所以加了25個像素的偏移量因此我們用這兩個算式計算出了文字的繪製位置，然後把他們填到了參數中，當然我們也可以單獨寫一個變數定義到這兩個算式上，然後子啊參數中填入我 們自己定義的變數，這個視頻中沒有，但是自己可以嘗試操作一下，並不難。而最後的文字，只要是字元串（String）類型的內容都可以任意書寫，而我們因為希望繪製分數，但是分數並不是字元串類型的變數，而是數字類型的，所以要用「String」這個方法先把數字類型的分數轉換成字元串類型才可以使用。

小TIPS時間：之前說了一下，所有的可見元素都是被「繪製」出來的，所以其實在遊戲中所有的可見對象其實都默認自帶了一個繪製方法來把自身繪製到遊戲中：

雖然你在對象里看不到這個方法的存在，但其實都是默認存在的

在完成以上的內容後，理論上我們已經可以繪製出一個積分的文字，但是這個文字所對應的分數默認設置為0，那我們怎麼才能讓分數增加呢？首先，我們要設定一個規則，這裡我們希望在玩家摧毀敵人的時候獲得積分，每個敵人5分，那我們就可以想到，要在敵人被摧毀的時候去執行一個命令來增加分數是最合適不過了，那我們就要去敵人對象中找到摧毀自身的那個方法：

如上圖，我們當時在敵人對象的「step」事件中寫過一個if的判斷，判斷敵人的hp小於等於0時就自動摧毀，那我們就要在它被摧毀之前再做一個增加分數的操作：

with (obj_score) thescore = thescore + 5 ;

在之前的教程中曾經說過，如果我們要在A對象中修改B對象內的變數就需要用「with」這個方法，這裡我們就可以用這個方法來修改分數對象中的分數值了，每次增加5。然後我們測試一下遊戲，就會看到在遊戲畫面的中央靠上的位置已經有了一個十分難以辨識的分數文字了，下圖放大處理便於確認。

我們會發現這個分數很難被發現的原因是兩個，第一是字體太小，第二是黑色的文字在這個深色背景上太不顯眼了，因此下面我們要學習如何設置字體和字體顏色。

首先我們要在右側資源樹中新增一個字體文件，如下圖所示：

圖中我已經大致標註了一些關鍵區域的簡要說明，如果想詳細了解字體編輯器的各項功能可以去看我翻譯的官方文檔，起碼字體編輯器這一塊已經翻譯完了:)

在這裡，我們可以從系統字體中隨便挑一個喜歡的字體來用，然後把尺寸設置到24，這樣文字就會顯得比較大了，在字體創建好後就可以去設置使用了：

回到我們剛才繪製分數的方法里，在繪製之前增加了兩行代碼

draw_set_font(fnt_score) ;draw_set_colour(c_white);

這兩行方法分別是用來設置文字字體和顏色的，其中字體就使用了我們剛才新創建的那個，而顏色這裡使用的是GameMaker Studio 2自帶的顏色，不光又"c_white"，同樣還有"c_blue"，"c_red"等常見的顏色，當然如果你對顏色有明確的要求，也可以在這裡直接指定RGB值。最後測試一下遊戲就大功告成啦！

這部分內容雖然簡單但是卻很常用，這裡其實還有一個沒說就是中文字體的設置，因為GMS中是不能直接繪製中文的，需要在創建字體的時候單獨選擇文字編碼範圍，不過這套教程是跟著官方教程走的就不多說明了，以後另外單獨說一下中文字體的設置和使用。