簡単な関数の作り方#

例1 imageオブジェクトのクリック時に何かが起きる#

<image name="img1" src="img1.png">
   <onMouseUp>
    log("img1がクリックされました");
  </onMouseUp>
</image>

XML上に直接関数を書くのが一番お手軽な方法です。
ただしXML上なので一箇所落とし穴があります。

失敗例 XML上では<>記号を使ってはいけない#

   <onMouseUp>
    if(1<2){
        log("img1がクリックされました");
    }
  </onMouseUp>

修正例 <を<に置き換える#

   <onMouseUp>
    if(1&lt;2){
        log("img1がクリックされました");
    }
  </onMouseUp>

こうすると通るようになります。

4.5の注意点#

Widget Engine4.5では、関数の仕様が変わっています。

イベントハンドラはすべてファンクションである必要があります。
また、XMLの属性で指定された全てのイベントハンドラをファンクションにコンパイルします。
特にonLoadハンドラの場合は、これらは、変数のスコープに違いがある場合があります。
通常、onLoadハンドラコードで進行するコードを<script>要素に記述する必要があります。
これはグローバルスコープで常に実行され、一方ファンクションであるハンドラは全て各々のスコープを備えています。

ということで、イベントの関数で書き換えが必要になるケースがあります。

また、minVersionをwidget.xmlに設定しておけば4.0のコードのままで動くことになっていますが、まれにそのままでは動かないケースがあるようです。
JavaScriptでは同じ動作をいろんなコードで書くことが出来るので、ユニークな書き方をしているとこういうことになるようです。

//4.0以前では通る例
mainReset.onMouseEnter = "mainReset.color=\"#ffffff\"";  
//4.5以降、<platform minVersion="4.0" />を設定していても書き換えが必要になることがある
mainReset.onMouseEnter = new Function("mainReset.color=\"#FFFFF\"");