UIを一気に追加する

リソース文字列を使って、add,add,add,add,...しなくても一気にまとめてぶち込む。

リソース仕様文字列

JavaScript Tools Guideより。Google翻訳をベースに一部改変。

リソース仕様文字列を使えば、一度に1つ以上のユーザーインターフェイスを作成できます。この特別な形式の文字列は、コンテナとそのコンポーネントを含む要素を作成するシンプルでコンパクトな方法を提供します。リソース仕様文字列はtypeパラメーターとしてWindow()またはadd()コンストラクター関数に渡されます。

リソース仕様の一般的な書き方は、まずタイプ(dialogなど)、それに続けて1つ以上のプロパティ定義を中括弧で囲みます。

var myResource = "dialog{ /*コントロールの設定をここに*/ }";

var myDialog = new Window ( myResource );

コントロールは、ウィンドウやコンテナ(Panel、Group)のプロパティとして定義します。各コントロールのクラス名を指定し、中かっこの中にコントロールのプロパティを指定します。プロパティ名(下の例で言うtestBtn)は、親のコンテナが予め持っているプロパティと被らない名前であれば好きに決められます。たとえば、次の例ではボタンを作成します。

testBtn: Button { text: 'Test' }

次のリソース文字列は、StaticTextとEditTextコントロールを含むパネルを作成します。

"msgPnl: Panel { orientation:'column', alignChildren:['right', 'top'], text: 'Messages', \

title: Group { \

st: StaticText { text:'Alert box title:' }, \

et: EditText { text:'Sample Alert', characters:35 } \

}

msg: Group { \

st: StaticText { text:'Alert message:' }, \

et: EditText { properties:{multiline:true}, text:'<your message here>' \

} \

}"

properties という名前のプロパティは、作成プロパティ(creation_properties)を指定できます。「作成プロパティ」のページを参照してください。

プロパティの値は、null、true、false、文字列、数値、インライン配列、またはオブジェクトが指定できます。

▶インライン配列は、1つ以上の値が含まれます。次のような形式です。

[value, value,...]

▶オブジェクトは、インラインオブジェクトまたは名前付きオブジェクトです。次のような形式です。

{classname inlineObject}

この場合、classnameは、「コントロールのタイプ」のコントロールクラス名リストのいずれかでなければなりません。

▶インラインオブジェクトには、次の形式で1つ以上のプロパティが含まれます。

{propertyName:propertyValue,propertyName:propertyValue,... }

要するに

add()で一個一個コントロールを追加しなくても、文字列で一気に複数追加出来るってこと。例えばPanelには、alignment、text、boundsを始め、もっと沢山のプロパティがあるが、Panelのプロパティを自分で追加しちゃって、そこにUIコントロールをぶち込んじゃえって話。個人的にはadd()よりもこっちのやり方が好きなので、基本こっちにしてる。