Home > 翻訳
Web 酒 肴
[翻訳]Flex3 Cookbook 1.11 イベントバブリングの使用
- 2008-10-21 (Tue)
- Flash/Flex , 翻訳 , ActionScript
Flex3 Cookbookが不親切な上に誤植があったため、ついでに翻訳してみる。 僕が英語読めてないだけだったりして。
とってもテキトー翻訳だと断っておきます。
注
3つのMXMLファイルのソースが出てきますが、BubblingComponent.xml, BubblingComponentHolder.mxmlはソースの配置場所に以下のフォルダを作成し、そこに配備してください。
oreilly/cookbook
上記２ソースの先頭にある
xmlns="oreilly.cookbook.*"
で察しろということなんだろうけど、僕はいまいちその辺の知識がないので少しハマりました。
1.11 Use Event Bubbling の翻訳
課題
あなたは子要素のコンポーネントから親要素のコンポーネントへと順次呼び出されるイベント処理を書きたい。 もちろんイベントリスナ内で呼び出し処理を書くというような手間のかかる方法ではなく。
解決法
子要素から順次通知されるイベントバブリングの仕組みを使いましょう。
検討
イベントのバブリングを理解するにはいくつかのクラスを作成してみる必要があります。 MOUSE_DOWNイベント、CLICKイベント、KEYBORDイベントなど、いくつかの種類のイベントを発生させることができます。 バブリングという言葉はイベントがディスプレイの階層をアプリケーションコンテナまで上っていく様子をあらわします。 泡が水中を上っていくかのように。
ユーザが何らかのコンポーネントをクリックしたとき、そのイベントはコンポーネントの階層を上っていきます。 つまり親コンポーネントは子コンポーネントのクリックイベントを監視し、子要素で発生したイベントを検知できるということです。 親コンポーネントに、子要素のある種類のイベントすべてを監視させるには、単に子コンポーネントの記述部にリスナを追加すればよい。
oreilly/cookbook/BubblingComponent.mxml
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="200">
<mx:Script>
<![CDATA[
private function sendClick():void
{
trace(" BubblingComponent:: click ");
}
]]>
</mx:Script>
<mx:Button click="sendClick()"/>
</mx:HBox>
上記のコンポーネントはボタンを保持しており、そのボタンはクリックイベントを発生させる。 そのイベントはBubblingComponentのインスタンスを保持するコンポーネントにイベントを伝えていく。 そのイベントを検知するにはBubblingComponentを含むコンポーネント内でクリックハンドラを用意すればよい。
<cookbook:BubblingComponent click="handleClick()" id="bubbler"/>
上記の要素を含むようにBubblingComponentHolderを以下のように作成する。
oreilly/cookbook/BubblingComponentHolder.mxml
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300"
xmlns:cookbook="oreilly.cookbook.*">
<mx:Script>
<![CDATA[
private function handleClick():void
{
trace(" BubblingComponentHolder:: click ");
}
]]>
</mx:Script>
<cookbook:BubblingComponent click="handleClick()" id="bubbler"/>
</mx:Canvas>
上記のコンポーネントは他にもイベントを監視するコンポーネントがあれば、アプリケーションレベルまでイベントを通知する。 メインアプリケーションBubblingHolderを作成すればBubblingComponent.mxmlで発生したクリックイベントは最終的にアプリケーションレベルにまで通知される。
BubblingHolder.mxml
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:cookbook="oreilly.cookbook.*">
<mx:Script>
<![CDATA[
public function createName():void{
name = "Flex Cookbook";
}
]]>
</mx:Script>
<cookbook:BubblingComponentHolder/>
</mx:Application>
MouseEventの一連のイベントはクリック位置などの付属情報を、それを監視する子要素を持つコンポーネント階層を特定し、Stageにイベントを通知する。
StageはMouseEventを検知すると先ほどのコンポーネント階層を、ユーザがマウス操作した最後のコンポーネントにたどり着くまでイベントを通知していく。 これはキャプチャリングと呼ばれる。次にイベントを処理すべきイベントハンドラが実行される。これはターゲッティングと呼ばれ、イベントに実際のターゲットが与えられる段階である。最後にバブリングの段階に入り、コンポーネント階層をさかのぼってStageまで順にイベントを通知する。
[勝手に日本語訳] Getting Started With Ruby and Rails
- 2008-02-10 (Sun)
- 翻訳 , NetBeans , Ruby On Rails
以下の記事の日本語訳が無いようなので、勝手に翻訳してみた。
それが許されるのかどうかはこれから問い合わせて、問題があるなら削除します。 日本語訳もだいぶ適当だし。伝わりやすい意味を重視したつもりですので、正確な訳にはなっていない場所も多々あると思います。意味としてもおかしい部分があれば、ぜひご指摘ください。
元記事は以下。
Getting Started With Ruby and Rails
このチュートリアルはあなたが即座にNetBeans IDEでRubyやRuby on Railsのアプリケーションを開発できるようにしてくれるでしょう。このチュートリアルはアプリケーション開発におけるいくつかのよくあるケースにおいて、あなたがどのようにIDEのRubyサポートを使用するかを教えてくれます。
このチュートリアルは順番どおり進める必要がありません。必要なところだけを素早く拾い読みし、時間があれば各セクションを見直すという読み方で構いません。順番どおり進める形式のチュートリアルがよければ、まずRubyでBlogを10分で作るを参照するのがよいでしょう。
目次
Home > 翻訳