【JSFL】込み入ったダイアログを作るためのXMLUI(XUL)についてのいくつかのメモ

込み入ったダイアログを作るためのXMLUI(XUL)についてのいくつかのメモを書いておきます。

通常JSFLで使えるダイアログ関連

まず、通常、JSFLで使えるダイアログ関連は

「OK」ボタンのみを警告ダイアログボックスを出すalert()。
Adobe Flash Professional CS5 & CS5.5 * alert()

「OK」ボタンと「キャンセル」ボタンのついた警告ダイアログボックスを出すconfirm()
Adobe Flash Professional CS5 & CS5.5 * confirm()

ストリングの入力を促すダイアログボックスを出すprompt()
Adobe Flash Professional CS5 & CS5.5 * prompt()

というのがありますが、これだけだと貧弱なのは否めません。

これだけだと貧弱

例えば「ある挙動のON/OFFをラジオボタンで切り替えつつ、それを表示中の全ファイルに対応させることもチェックボックスで切り替える。」といったようなものがあるとしましょう。

こういったHTMLにおけるFORMタグのように複数の入力項目を細かな動きを作ることは難しいです。それゆえ、JSFLで作る機能もそれに引っ張られて単発になりがちです。

複雑な入力UIを作れるXMLUI

さて、それをカバーするのが、XMLUIというのはJSFLで込み入ったダイアログを作るための技術です。

コードは

myXMLUIObject = fl.getDocumentDOM().xmlPanel(fileURI);

といったように書き fileURI にXUL(XML User Interface Language)で書かれたXMLを指定するとダイアログが表示されます。

JSFLリファレンスでは以下に使い方が書いています。参考までに。

Adobe Flash Professional CS5 & CS5.5 * document.xmlPanel()

具体的な使い方

さて、具体的な使い方です。先ほど話に挙げたダイアログの例の場合、

以下のように書きます。

<?xml version="1.0"?>
<dialog buttons="accept, cancel"  title="レイヤーを変更します" >
<label value="レイヤーを変更します" />
<radiogroup id="flagLayerVisible">
  <hbox>
    <radio label="ON" value="true"/>
    <radio label="OFF" value="false"/>
  </hbox>
</radiogroup>
<checkbox id="flagAllFlaMode" label="いま開いているflaをすべて変更" checked="false"/>
</dialog>

これを例えば、dialog.xmlとしてfile:///C:/dialog.xmlに置いた場合、

myXMLUIObject = fl.getDocumentDOM().xmlPanel("file:///C:/dialog.xml");

として読み込みます。パスの書き方はURLぽく書くのは癖がありますね。

値の取得方法の例

さて、上記のXMLUIの場合、

OKの状態を取得するのは

 if ( myXMLUIObject.dismiss == "accept" ) { 

といったように取得できます。

またチェックボックスのON/OFF状態は、HTMLのFORM周りの取得に近く

if( myXMLUIObject.flagAllFlaMode == "true" ){ 

といった形で判定できます。

あくまで例なので、このあたりは試行錯誤して試してみてください。

ところでXUL(XML User Interface Language)ってなに?

と、ここまで来たのですが

Adobe Flash Professional CS5 & CS5.5 * document.xmlPanel()

には、読み込み方は書かれていても、XUL自体の作り方は載っておらず、上記のように試行錯誤と言われても戸惑うと思います。丸投げかよと。わりとイライラします。実際に私も使えるようになるにはちょっと手間取りました。

というわけで、もう少し、XULについてメモっておきます。

まず、XULは以下のような技術。UI周りのXML汎用技術ってところですね。

XUL – Wikipedia

XUL(ずーる、XML User Interface Language)はMozilla FirefoxやMozilla ThunderbirdなどのMozillaアプリケーションを作成するためのユーザインタフェースマークアップ言語である。UIMLのようなXMLアプリケーションの一つであり、ユーザインタフェースを記述するための言語である。
XUL自体は標準とはなっていないが、CSS、JavaScript、DOM、DTD、RDF等の既存の標準技術を多く利用しているため、すでにこれらの技術に親しんでいるプログラマやデザイナにとっては比較的習得しやすい言語となっている。
XULの持つ最も大きな利点は単純でポータブルなウィジェットの記述が可能であることである。これは第4世代言語 (4GL) がソフトウェア開発の場で果たしたのとよく似た労力の削減に繋がっている。

そして、肝心のリファレンスはと言うと近場のAdobeのサイトにはありませんでした。よく探せばあるかもですが私は見つけられませんでした。なので、目線を変えてこの技術をよく採用しているMozillaのサイトに探しにいったところ、ありました。

XUL – MDN

私もここにたどり着いたお陰で、かなり学習が進みました。やってみればHTMLのFORMっぽくてわかりやすいんですけどね。

なお上記リンクの中でも、特にわかりやすいのがXUL controlsの部分です。

XUL controls – MDN

おわりに

いかがでしたでしょうか。私はXULのおかげで、今までダイアログをできるだけ出さず単発にしがちだった複数のJSFLを一気に集約できるようになりました。

みなさんも標準のダイアログ(alert,confirm,prompt)に満足できなくなったら試してみてください。

それでは、よき JSFL Lifeを!