96 lines
7.8 KiB
HTML
96 lines
7.8 KiB
HTML
<?xml version="1.0" encoding="UTF-8"?>
|
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
|
|
<!-- generated by to_html.pl from EventSystem.xml -->
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
|
<title>イベントシステム</title>
|
|
<meta name="author" content="W.Dee" />
|
|
<meta http-equiv="Content-Style-Type" content="text/css" />
|
|
<meta http-equiv="Content-Script-Type" content="text/javascript" />
|
|
<link href="browser.css" type="text/css" rel="stylesheet" title="吉里吉里関連リファレンス用標準スタイル" />
|
|
<link href="mailto:[email protected]" rev="Made" />
|
|
<link href="index.html" target="_top" rel="Start" title="トップページ" />
|
|
</head>
|
|
<body>
|
|
<h1><a id="id96" name="id96">イベントシステムについて</a>
|
|
</h1><div class="para"><div>
|
|
吉里吉里で TJS スクリプトを記述する場合、イベント駆動型のプログラミングモデルを採る必要があります。<br />
|
|
イベントは「何かが起こった」ときに、他のオブジェクトや、自分のオブジェクト内にそれを通知するために発生します。イベントハンドラにはこれに応答する処理を書くことになります。<br />
|
|
吉里吉里では一つのイベントハンドラで必要以上に長い時間がかかることは好ましくありません。時間を待ちたいときは <a target="main" class="jump" href="f_Timer.html">Timer</a> クラスを用いることをおすすめします。<br />
|
|
</div></div>
|
|
<h1><a id="id97" name="id97">同期イベントと非同期イベント</a>
|
|
</h1><div class="para"><div>
|
|
同期イベントとは、たとえばサウンドバッファで再生を開始した場合に、その play メソッド内で onStatusChanged イベントが発生するように、オブジェクトの操作を行うとすぐにその場で発生するイベントです。<br />
|
|
これに対し、非同期イベントとは、吉里吉里内部にあるイベントキュー ( 発生させるイベントを一時保管している場所 ) に一時的に蓄積されます。このイベントはすべての他のイベントハンドラの処理が終わるまで発生せず、他のイベントハンドラ内では発生しません(ただし例外があるので下記 note を参照してください)。タイマー周期が来て発生する onTimer イベントなどや、ユーザからの入力により発生するすべてのイベントは非同期イベントです。<br />
|
|
<br /><div class="note"><div class="notehead"><span class="noteheadspan">Note</span></div>
|
|
Window.showModal のような一部の、ユーザからの入力を得ようとするような機能は、イベントキューを動作させる (イベントを配信する) ことがあります。これにより、イベントハンドラ中で別の非同期イベントが発生する可能性はあります。</div><br />
|
|
非同期イベントをスクリプトの操作で発生させるために <a target="main" class="jump" href="f_AsyncTrigger.html">AsyncTrigger</a> クラスがあります。<br />
|
|
</div></div>
|
|
<h1><a id="id98" name="id98">画面反映のタイミング</a>
|
|
</h1><div class="para"><div>
|
|
ウィンドウにレイヤを表示するための画面反映のタイミングは非同期イベントと同じで、すべての他のイベントハンドラの処理が行われたあとです。一つのイベントハンドラ内で何度描画を行っても、内部的な画像バッファには描画されていますが、画面にはすぐに反映はされません。イベントハンドラからぬけて、吉里吉里が描画のタイミングを得たときに初めてウィンドウに内容が描画され、反映されます。<br />
|
|
</div></div>
|
|
<h1><a id="id99" name="id99">クラス内でのイベントハンドラ</a>
|
|
</h1><div class="para"><div>
|
|
クラス内で発生したイベントはそのクラス内で、スーパークラスのイベントハンドラをオーバーライドすることによりハンドリングする事ができます。<br />
|
|
たとえば、Timer クラスからサブクラスを作成し、以下のようにイベントハンドラを作成することができます。<br />
|
|
|
|
<br />
|
|
<code class="bq">class MyTimer extends Timer<br />
|
|
{<br />
|
|
function MyTimer()<br />
|
|
{<br />
|
|
super.Timer(...);<br />
|
|
}<br />
|
|
<br />
|
|
function onTimer()<br />
|
|
{<br />
|
|
<span class="comment">// ( ここに onTimer の処理 )</span><br />
|
|
super.onTimer(...); <span class="comment">// スーパークラスのメソッドは一応呼び出す</span><br />
|
|
}<br />
|
|
}<br />
|
|
</code>
|
|
<br />
|
|
|
|
スーパークラスのメソッドは呼び出す必要はありませんが、一般的には呼び出します。また、スーパークラスのメソッドは呼ばないと後述の action メソッドによるイベントハンドリングができません。<br />
|
|
</div></div>
|
|
<h1><a id="id100" name="id100">actionメソッド</a>
|
|
</h1><div class="para"><div>
|
|
<a target="main" class="jump" href="f_Layer.html">Layer</a> クラスや <a target="main" class="jump" href="f_WaveSoundBuffer.html">WaveSoundBuffer</a> クラスなどは、コンストラクタに指定したオーナーの action メソッドにイベントを発生する機能があります。<br />
|
|
action メソッドには辞書配列オブジェクトの引数が一つ渡され、ここにイベントの情報が入っています。<br />
|
|
辞書配列のメンバのうち、 target はイベントの発生元オブジェクトを表しています。type はイベント名を表しています。<br />
|
|
その他のメンバはイベントによって異なります。たとえば、<a target="main" class="jump" href="f_Layer_onClick.html">Layer.onClick</a> イベントならば、x と y というメンバがあり、レイヤ上をクリックされた場所を表します。<br />
|
|
|
|
<br />
|
|
<code class="bq">例:<br />
|
|
class MyWindow extends Window<br />
|
|
{<br />
|
|
var layer;<br />
|
|
(略)<br />
|
|
function MyWindow()<br />
|
|
{<br />
|
|
super.Window(...);<br />
|
|
add(layer = new Layer(this <span class="comment">/* this = オーナー */</span>, null));<br />
|
|
layer.visible = true;<br />
|
|
}<br />
|
|
(略)<br />
|
|
function action(ev)<br />
|
|
{<br />
|
|
if(ev.type == "onClick" && ev.target == layer)<br />
|
|
{<br />
|
|
<span class="comment">// layer がクリックされた</span><br />
|
|
System.inform(ev.x, ev.y);<br />
|
|
}<br />
|
|
}<br />
|
|
}<br />
|
|
</code>
|
|
<br />
|
|
|
|
</div></div>
|
|
<script type="text/javascript" charset="UTF-8" src="documentid.js" ></script>
|
|
<script type="text/javascript" charset="UTF-8" src="postcontent.js" ></script>
|
|
</body>
|
|
</html>
|