■注意事項■
※如果你剛接觸krkr，那麼閱讀前強烈推薦先閱讀水螅姐的教程把KAG等基本知識學明白：猛擊這裏
※本文建立在讀者已經讀過一遍krkr自帶tjs文檔的前提下而撰寫，所以不對其中出現的一些在tjs文檔裏已經詳盡說明的函數、方法、語法等基礎知識再做過多的說明，如果閱讀過程中有看不懂的地方，請去參考tjs文檔。
※本文使用的KRKR版本爲KCDDP上分享的KCDDP KAGeXpress 3.0漢化版。
※爲了照顧非IT人士，一些IT方面的基礎知識會附帶一些說明鏈接，僅供參考，百度google纔是您更好的選擇。
學習Kag的過程是一帆風順的，但是學習tjs的過程確實有些小坎坷。最大的原因就是網上能找到的資料基本全是日文的，中文的關於寫、改tjs的教程實在是很少有人做。對於沒有一些基礎的人來說，這真是略難啃的一個東西。所以一直想做這樣的一個教程，把一些學習到的東西分享給大家。
廢話不多說，下面開始正文。
第一篇將介紹基礎中的基礎……從最簡單的捕獲鼠標位置應用說起，相信許多人都用過這個功能了吧，因爲KAG文檔後部分對這些常用TJS都進行了一些說明來着……這個也很適合拿來做TJS的入門。
下面範例的腳本，在這裏下載：請點擊。你需要自己新建一個工程，然後用這些東西去覆蓋，就可以跑起來了。
假如說我們現在要做一個存檔界面，準備一張背景，然後幾個存檔按鈕，似乎就OK了。假如設計四個存檔點，我們用最最古老的辦法這樣寫：
[current layer=message0]
[er]
;存檔位1號
[locate x=50 y=120]
[button normal=save_1 over=save_2 on=save_1 storage="first.ks" target=*save exp="tf.savePos=1"]
;存檔位2號
[locate x=220 y=120]
[button normal=save_1 over=save_2 on=save_1 storage="first.ks" target=*save exp="tf.savePos=2"]
;存檔位3號
[locate x=390 y=120]
[button normal=save_1 over=save_2 on=save_1 storage="first.ks" target=*save exp="tf.savePos=3"]
;存檔位4號
[locate x=560 y=120]
[button normal=save_1 over=save_2 on=save_1 storage="first.ks" target=*save exp="tf.savePos=4"]
這就是所謂的hardcode，寫一個存檔點的代碼，然後各種複製粘貼就可以了。如果想要十個存檔點，就再複製粘貼六次。如果想要100個存檔點，就再複製粘貼90次……是不是略多啊！明明是重複率很高的代碼，可不可以寫得更簡潔一點呢？
於是可能好多人都嘗試過用標籤和jump構成的循環。下面用循環來畫12個存檔塊
[current layer=message0]
[er]
[eval exp="tf.i=0"]
*startFor
[locate x=&(50+tf.i%4*170) y=&(120+tf.i\4*130)]
[button normal=save_1 over=save_2 on=save_1 storage="first.ks" target=*save exp="tf.savePos=tf.i+1"]
[eval exp="tf.i++"]
[jump target=*startFor cond="tf.i<12"]
[s]
代碼量超少有木有，一下子就高端洋氣了許多。但是真正嘗試這樣寫過的朋友可能都遇到過最致命的一個問題……那就是這12個存檔點無論點擊哪一個，都會顯示”存檔到13號位置”……也就是說這12個點擊最後觸發的exp="tf.savePos=?"的這個？值都一律是13
這是由於tf.i在你把整個頁面都畫好的時候，它的值已經是12了，這時候再點擊觸發exp，只會得到12+1＝13，12個檔位都是如此。於是這個存檔瞬間就變得沒有任何意義了，因爲它的功能是有缺陷的。爲了解決這個問題，我們需要使用座標獲取。
[button normal=save_1 over=save_2 on=save_1 storage="first.ks" target=*save
exp="getSavePos()"]
點擊的時候不是直接給變量賦值而是調用了一個函數，函數當然需要我們自己寫。
@iscript
// 點擊時獲取點擊的檔位號
function getSavePos(){
var x=kag.lastMouseDownX; // 獲取上次點擊時的鼠標X座標
var y=kag.lastMouseDownY; // 獲取上次點擊時的鼠標Y座標
tf.savePos = calSavePos(x, y)+1;
}
// 根據座標x,y，計算所在的檔位號
function calSavePos(x, y){
//計算方式參照我們畫檔位按鈕時的座標[locate x=&(50+tf.i%4*170) y=&(120+tf.i\4*130)]
var xIndex = (x-50)\170;
var yIndex = (y-120)\130;
return xIndex + yIndex*4;
}
@endscript
恭喜從石器時代進化到了蒸汽時代，下面試着讓系統再豐滿一些，增加存檔預覽功能。
我們只需要把鼠標移到存檔位上，便會自動顯示此存檔的相關訊息（比如存檔日期、存檔標題、存檔時角色正在說的話等內容）。不是點擊，只是鼠標移到上面就可以顯示，這要怎麼實現呢。
[button normal=save_1 over=save_2 on=save_1 storage="first.ks" target=*save exp="getSavePos()"
onenter="savePreview()" onleave="hideSavePreview()"]
savePreview()和hideSavePreview()函數也需要我們自已來寫。
// 點擊時獲取點擊的檔位號
function savePreview(){
var x=kag.fore.base.cursorX; // 獲取目前鼠標所在X座標
var y=kag.fore.base.cursorY; // 獲取目前鼠標所在Y座標
var pos = calSavePos(x, y)+1;
var msgLayer = kag.fore.messages[1];
msgLayer.font.height=24;
msgLayer.drawText(0,0,"存檔位"+pos+"的預覽信息XXXXXX在此！",0xffffff);
msgLayer.visible=true;
}
// 預覽信息消失
function hideSavePreview(){
var msgLayer = kag.fore.messages[1];
msgLayer.clear();
msgLayer.visible=false;
}這樣的話鼠標移到檔位上時，會顯示預覽信息。從檔位移開時，預覽信息就消失了。
對這部分代碼簡單提幾點。kag.fore.base.cursorX得到的是鼠標的位置。kag.fore.base就是我們一般在KAG裏寫的那個layer=base層，而cursorX是它的一個屬性。裏面記錄的就是鼠標在其之上的X座標，因爲大家知道base層是和屏幕等大小並且不能移動，所以鼠標在base層上的座標也就一定是在屏幕上的座標了。它跟lastMouseDownX的區別在於，lastMouseDownX需要點擊之後纔會變化，而cursorX是隨時變化的。
calSavePos()函數就是上面寫過的那個函數啦，這裏直接調用它了。把通用的、多次用到的代碼寫成函數然後再調用是很好的習慣。
var msgLayer = kag.fore.messages[0];是拿到message0層，然後對它直接進行操作。
drawText就是在圖層上寫字的功能啦。0,0分別是X，Y座標，第三個參數是要寫的文字，第四個參數是字的顏色。注意這個寫字是瞬間寫上去的，不會一個一個蹦。
除了可以在message層上寫字，直接在圖片層上寫字也是可以的。
font.height就是設置字號
visible就顧名思義了，爲true時可見，false不可見。
clear()方法是用來把這個圖層上的東西清空的，在message層功能就相當於[er]了。
效果圖：
至此，本次的教程就結束了。介紹了一些獲取鼠標位置的常用屬性，獲取圖層的方法，在圖層上寫字的方法，以及它們在一個界面中的實際應用。這些都是基礎中的基礎，對於有一定的KRKR使用經驗的人，就算是KAG黨恐怕也早就瞭解了吧。何況這些知識的使用方法其實在KAG的說明檔裏也都有提到過。因爲本着“實用教程”的原則，是希望這裏提到的東西能在實際使用中能夠派上用場的。下次爭取講些更“高端”的內容……如果還有下回的話。。。
