reinit

2024-06-12 16:09:12 +08:00
commit d8b781011b
156 changed files with 26489 additions and 0 deletions
--- a/TankMan/Mapping.md
+++ b/TankMan/Mapping.md
@ -0,0 +1,170 @@
+# 地圖製作教學
+
+此文將會介紹如何使用`Tiled`這個軟體製作一個地圖，並放進[PAIA坦克大作戰](https://github.com/Jesse-Jumbo/TankMan) 中，讓我們的坦克車可以跑在自己客製化的地圖。
+
+建立好的地圖除了可以直接放入[PAIA坦克大作戰](https://github.com/Jesse-Jumbo/TankMan) ，在個人環境中做使用之外，也可以分享給其他人，讓所有人使用。
+
+---
+# 檔案更新
+
+- [圖塊集](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/TankManObj.png)
+---
+
+# 軟體安裝
+    ⚙ 製作地圖需要安裝Tiled這個軟體，請大家到 [官網](https://www.mapeditor.org) 中下載適合自己電腦作業系統的版本：
+
+## 安裝流程：
+
+1. 進入到[官網](https://www.mapeditor.org)後點擊「Donload on itch.io」跳轉到下載頁面。
+    ![](https://i.imgur.com/dCbcYXs.png)
+
+    
+    
+2. 點擊「Download Now」後將會顯示捐款浮動視窗。
+    ![](https://i.imgur.com/FAk59CN.png)
+
+    
+3. 點選最上方「No thanks, just take me to the downloads」的選項後，即可看到不同作業系統適用的安裝檔。
+    ![](https://i.imgur.com/VUjvlKz.png)
+
+    
+4. 選擇與自己電腦相容的安裝檔即可下載並安裝。
+    ![](https://i.imgur.com/OpnUnXD.png)
+
+    
+
+---
+
+# 新增地圖專案
+    ⚙ 這部分主要說明如何建立一個地圖檔案並儲存。
+
+
+
+1. 開啟Tiled，建立新地圖
+第一次開啟Tiled的時候，可以在左上角看到以下截圖畫面。其中紅框內是比較常用到的功能。
+選擇「New Map」，進入到軟體中。
+    ![](https://i.imgur.com/hvcCuC0.png)
+
+    
+
+---
+
+1. 設定地圖大小
+    
+    選擇建立新地圖後會跳出地圖屬性設定視窗，其中「地圖大小」的設定將會直接影響迷宮大小。
+    
+    將「圖塊大小」的高與寬都調整回50px，並設定好地圖大小之後就可以按下「Save As」
+    ![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/mapping/define_map_format.jpg)
+
+
+
+---
+
+1. 儲存檔案
+    
+    存檔時需要注意存檔類型，預設為`.tmx`，也是Tiled可以直接打開編輯的檔案格式；而坦克車使用的也是TMX檔。
+    
+    ![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/mapping/save_file.jpg)
+    
+
+---
+
+1. 新增圖塊集
+    
+    存好檔案之後就會進入到編輯頁面。
+    
+    - 點選圖塊區域中間的「New Tileset」
+        
+      ![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/mapping/new_tilsests.png)
+
+        
+- 再點擊「Browser」並打開[圖片檔](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/TankManObj.png) 。
+    ![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/TankManObj.png)
+
+
+- 將圖片寬度與高度調整為50px，邊距與間距分別為0px與0px。
+    ![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/mapping/tilsest_format.png)
+
+
+- 成功新增圖庫集之後就可以開始編輯地圖了
+    ![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/mapping/object_image.png)
+
+
+---
+
+# 編輯地圖
+
+
+    ⚙ Tiled的基本編輯方式相當簡單，只需要使用滑鼠選取圖塊集的方塊，再移動到編輯區點擊方格即可。
+    也可以持續按著滑鼠左鍵拖曳繪製
+![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/mapping/map.png)
+
+---
+## 積木種類
+
+圖塊集的每個格子都會有相對應的編號，其順序從1開始，由左至右、由上至下。
+
+目前坦克車使用到的編號為1~5，對應到的圖塊如圖所示，這5種圖塊的功能分別為：
+
+1. 綠色坦克，玩家1P的起始位置，面向西方。
+2. 藍色坦克，玩家2P的起始位置，面向東方。
+3. 磚牆，遊戲中的牆壁，被擊中3次會消失。
+4. 子彈圖示，子彈補給站的起始位置，每次經過可獲得5顆子彈。
+5. WiFi圖示，油料補給站的起始位置，每次經過可獲得30點油料。
+
+![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/mapping/image_no.png)
+
+
+---
+
+## 地圖圖塊與遊戲物件的關係
+
+- 地圖圖塊的大小 = 遊戲物件的大小。
+
+---
+
+## 常用工具與功能列
+
+- 橡皮擦
+    
+    在上方工具列可以找到，使用方式與圖塊集相同。
+    
+    ![](https://i.imgur.com/8O9nkvX.png)
+
+    
+- 調整地圖大小
+    
+    在上方的選單選擇「地圖」→「調整地圖大小」
+    
+    可以調整當前地圖的長寬，並移動原先的地圖物件，在視窗中間將會出現預覽圖。
+    ![](https://i.imgur.com/A1vp255.png)
+
+
+---
+
+# FAQ 與 注意事項
+
+## 地圖存放路徑
+```python
+Game/asset/maps/
+```
+![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/mapping/image_path.png)
+
+## 地圖檔名命名規則
+
+- 檔名最後的數字（`x`）就是地圖的編號。
+    - 地圖格式：map_0`x`.tmx
+    
+---
+
+## 如何更換新版圖塊集
+當更新了新版圖塊集。過去有使用過舊版的使用者有可能遇到編號不相容的問題，在此提供解決方法。
+
+1. 避免在同一個檔案下使用兩個圖塊集
+2. 刪除舊版圖塊集
+
+![](https://raw.githubusercontent.com/Jesse-Jumbo/TankMan/main/asset/image/mapping/del_image.png)
+
+當軟體中存在一個以上的圖塊集時編號將會存在衝突，導致載入遊戲時無法順利產生物件，因此建議使用者在同一個地圖檔案內不要使用兩個圖塊集。例如：在曾經以舊版編輯過的地圖裡直接使用新版圖塊集，可以選擇重新開新的地圖檔案套用新版的圖塊集。如果還是擔心會有混用的問題，在圖塊集的下方有垃圾桶的Icon，可以直接刪除舊的圖塊集。
+
+---