1

私は、基本的な複合パターンを使用してネストされたスプライトを使用して、html キャンバス上に単純なアニメーションを作成するための JavaScript フレームワークに取り組んでいます。

Clutter と Flash (非常によく似た構造) で自分の作品をモデリングしてきました。「ステージ」は、「DisplayObjects」である画面上のすべてのアイテムを保持します。これらは、「DisplayObject」から継承する「DisplayObjectContainer」に集約できます。「ステージ」自体も「DisplayObjectContainer」です。これらはすべて「EventDispatcher」から継承されます。

私はここ数日の大半を、これらのシステムのイベント フローについて読んだり、さまざまなオープン ソース プロジェクトの例を探したりすることに費やしてきました。

私が理解していることから、イベントがディスパッチされると、特定の伝播経路をたどる必要があります。イベントはステージから表示オブジェクト階層 (「キャプチャ」フェーズ) に流れ、そのイベントの「ターゲット」に到達します。 「バブル」は表示階層をバックアップします。これが十分に明確でない場合は、ここにある画像が説明に役立ちます。

http://help.adobe.com/en_US/as3/dev/WS5b3ccc516d4fbf351e63e3d118a9b90204-7e4f.html

http://docs.clutter-project.org/docs/clutter/1.4/event-flow.png

これには私が理解できていない側面があり、それが私だけなのか、それとも私が思っているほど不明確なのかはわかりません。

クリックを扱っているとします。ディスプレイをクリックし、ブラウザーのネイティブ イベント処理を使用してクリックの x/y 座標を取得し、それをディスプレイ階層に送信して、クリックしたオブジェクトを特定します。

今まで、これは私のコードの「キャプチャ」フェーズでした。しかし、これは、ターゲットがイベント フローに入るまでに既にイベントにアタッチされている必要があるというドキュメントとは完全に矛盾しています。

表示項目のグラフを 2 回トラバースする必要がありますか?

この問題に関するアドバイスや専門知識をいただければ幸いです。

4

1 に答える 1

0

興味深い質問です！はい、イベントフローのフェーズを開始する前に、最初にトラバースしDisplayListてイベントを計算する必要があると思います。イベント システムを設計したことがないため、これについては完全にはわかりませんが、おそらくオブジェクトを計算するときに、階層ルートをキャッシュし、それを再度トラバースするのではなく、イベント フローの基礎として使用できます。targetcapturetargetDisplayList

イベント システムの設計 (および既存のイベント システムの用語) の抽象化ではなく、実装の観点から考えると、あなたが不明確な点がより明確になると思います。親オブジェクトと、マウスのクリックに反応する必要があるいくつかの子アイテムで構成されるウィジェットを想像してみてください。親オブジェクトのみのイベントをリッスンし、イベントの発生元であるターゲット オブジェクトに従って反応したい場合があります。ではActionScript、イベント フローのキャプチャ フェーズを使用している場合、イベントのターゲットに到達する前にハンドラーが起動しますが、この場合、ターゲットはイベント オブジェクトの必須プロパティです。

コメントで示唆されているように、「Flash 開発者になじみのある」API を提供すると主張しているため、 easeljsのソース コードを調べる価値があるかもしれません。ただし、easeljs は現在、パフォーマンス上の理由からフル機能のイベント フローをサポートしていないことに注意してください (こちらを参照)。

私の2ペニー。イベント フローは (設計は言うまでもなく) 理解するのが難しいため、完全な機能を備えたイベント システムを実装することは、軽量ライブラリを作成するという目標と相いれない可能性があります。この段階ではシンプルに保ち、イベントなどの機能bubblingが必要な場合にのみ追加することをお勧めします。

于 2012-08-14T23:06:22.033 に答える