因為工作的關係，之前做了12/30/56片的拼圖遊戲
整理了原理之後重複的動作過多，所以是用Excel批量修DETA資料
但是每次找資料整理資料也是劇傷眼，就開始慢慢研究腳本撰寫
這次的重點是所有數值統一整理，如果有需要使用
只需要在最開始調整變數，之後系統就能直接出遊戲
無論幾片的拼圖都適用（前提是整體必須為四方形）
這篇針對對腳本完全不會的新人可以參考，老手歡迎優化指教
也算是本人的一個腳本筆記（雞腦太久沒用超容易忘記）
設定概念
１．遊戲開始時，拼圖塊會隨機出現在畫面左側
２．當滑鼠左鍵點著時，滑鼠座標在拼圖塊的範圍內，會選取該拼圖塊
３．拼圖塊放在正確範圍內時，會自動校正到正確座標
４．拼圖完成時會顯示完成提示
非腳本的範例圖只顯示2片內
對比腳本製作就會知道為什麼我改用腳本了
１．初始設定
非腳本製作
＊設定固定數值＊
拼圖寬、高(變數4、5)
每一塊拼圖塊的大小
拼圖座標(4/塊)
每一塊拼圖塊都需要一個XY座標
另依照拼圖寬高自動計算出另一邊界
這樣就可以算出拼圖塊顯示範圍
滑鼠座標(變數2、3)
由於要判斷滑鼠座標在圖片範圍內
因此需要存滑鼠座標
寫入變數 $gameVariables.setValue(ID, n);
滑鼠座標 TouchInput.x TouchInput.y
將滑鼠座標X寫入變數2
$gameVariables.setValue(2, TouchInput.x);
將滑鼠座標Y寫入變數3
$gameVariables.setValue(3, TouchInput.y);
＊注意＊
需先將開關數量上限，設置為總片數+10以上
例如做4X4的拼圖，專案開關上限需要最少26個
腳本製作
＊設定固定數值＊
拼圖名稱(變數3)
儲存拼圖塊的檔名"名稱"的部分
例如我的拼圖塊檔名是puzzle1~puzzle9
那puzzle就存入名稱，編號後面由系統加入
拼圖寬、高(變數4、5)
每一塊拼圖塊的大小
拼圖片橫直數(變數6、7)
你的拼圖是幾成幾，例如本範例是3X3
拼圖起始點XY是(變數8、9)
你的第一塊拼圖會在畫面的位置
搭配拼圖寬高即可計算出其餘拼圖位置
感應允許範圍(變數10)
因為要分毫不差放到正確座標太難
因此有一個容許誤差值
例如拼圖要放在X=20為正確點，誤差值20
那當你拼圖在X=0~40時都會判定為放入正確位置
拼圖顯示範圍(變數11～14)
一開始拼圖塊會出現的範圍
XY各有兩個邊界值
正確數（自動帶入）(變數2)
這是判斷目前已放入正確位置的拼圖有幾塊
正常來說就是拼圖總數，也就是3X3=9
帶入變數
$gameVariables.value(ID)
變數2我要寫入拼圖總數，也就是9
因此就是$gameVariables.setValue(2, 9);
拼圖總數是拼圖片橫直數相乘，也就是變數6 X 變數7
也就是$gameVariables.value(6)*$gameVariables.value(7)
因此完整寫法為$gameVariables.setValue(2, $gameVariables.value(6)*$gameVariables.value(7));
若要寫入的是文字，就要添加""
例如我的拼圖名稱是puzzle，要寫入變數3
$gameVariables.setValue(3, "puzzle");
２．顯示拼圖塊
接著先判定是否開始遊戲了
如果還沒，那先把場上的圖片通通淨空
然後放入拼圖塊
最後開始遊戲
非腳本製
顯示拼圖塊１
設定拼圖塊1出現的範圍
X會在範圍20~200(圖片筆誤)，Y會在範圍20~500
然後設定顯示圖片
以上為一組，接著看你有幾片就重複幾次...
建議用直接修改DETA檔案製作(如果你跟我一樣很懶)
另外非腳本忘記寫清除圖片功能，但我建議直接看下面的腳本一行解決
腳本製作
＊清除圖片＊
for迴圈
for (var i=最小值;i<=最大值;i++){ 執行內容 }
設定一個整數i，與i的最小值，當i不大於等於最大值時
i會以當前值執行內容後，i+1再執行內容，直到i大於等於最大值。
圖片擦除 $gameScreen.erasePicture(ID)
若我想清除畫面中所有的圖片(系統最高99張)
for (var i=1;i<=99;i++){ $gameScreen.erasePicture(i) }
倘若只想擦除ID為20~50的圖片
for (var i=20;i<=50;i++){ $gameScreen.erasePicture(i) }
＊放入拼圖塊＊
圖片顯示
$gameScreen.showPicture(圖片ID, 圖片名稱, 座標點位置, 圖片X座標, 圖片Y座標, X縮放, Y縮放, 不透明度, 融合模式);
我的拼圖是3X3=9，儲存拼圖長與寬的變數為變數6、7
因此我的迴圈i最大值就是$gameVariables.value(6)*$gameVariables.value(7)
最小值是1，這樣就能顯示1~9共9張圖片
現已知i會跑1~9，因此我的圖片ID就是i
圖片名稱是拼圖塊的名稱，我的命名為puzzle+編號，puzzle已存入變數3中
因此圖片名稱為$gameVariables.value(3)+i
如此當i=1，圖片ID1 圖片名稱puzzle1，i=2 圖片名稱puzzle2...以此類推
X,Y座標由於是隨機的，使用隨機語法Math.randomInt(隨機數量)
由於由0起算，因此若隨機數量為5，會骰出的數為0~4
因此圖片座標點是左上，因此我設定的XY範圍還需減去拼圖長寬
才能確保拼圖不會距離邊界過近導致超出太多
所以隨機座標為 350[右邊界，變數11]-140[拼圖寬，變數4]
另外加上20[左邊界，變數13]
套入X座標=Math.randomInt($gameVariables.value(11)-$gameVariables.value(4))+$gameVariables.value(13)
Y座標同理替替換變數即可
座標點位置，圖片左上為0，圖片中心點為1
縮放皆為100原始，不透明度255，融合為預設0
完整的圖片顯示語法為
$gameScreen.showPicture(i, $gameVariables.value(3)+i, 0, Math.randomInt($gameVariables.value(11)-$gameVariables.value(4))+$gameVariables.value(13), Math.randomInt($gameVariables.value(12)-$gameVariables.value(5))+$gameVariables.value(14), 100, 100, 255, 0);
將其放入for迴圈執行內容中即可
for (var i=1;i<=$gameVariables.value(6)*$gameVariables.value(7);i++){
$gameScreen.showPicture(i, $gameVariables.value(3)+i, 0, Math.randomInt($gameVariables.value(11)-$gameVariables.value(4))+$gameVariables.value(13), Math.randomInt($gameVariables.value(12)-$gameVariables.value(5))+$gameVariables.value(14), 100, 100, 255, 0);}
第一篇顯示拼圖塊的部分先到這邊
下一篇來講移動拼圖塊
重要語法
寫入變數 $gameVariables.setValue(ID, n);
帶入變數 $gameVariables.value(ID)
滑鼠座標 TouchInput.x TouchInput.y
for迴圈 for (var i=最小值;i<=最大值;i++){ 執行內容 }
圖片擦除 $gameScreen.erasePicture(ID)
隨機語法 Math.randomInt(隨機數量)
圖片顯示
$gameScreen.showPicture(圖片ID, 圖片名稱, 座標點位置, 圖片X座標, 圖片Y座標, X縮放, Y縮放, 不透明度, 融合模式);
