TOP
＞
システム開発
＞ メニューウィンドウを作る
Ruby on RailsとAdobe AIRでデスクトップアプリを作る
第４回：AIRでメニューウィンドウ作成！
著者：
ワイズノット 増井 雄一郎
2007/9/25
前のページ
1
2
3
次のページ
メニューウィンドウを作る
さて、前回はウィンドウに「はろーわーるど」と表示をするだけでした。今回はここに、複数のボタンとメッセージを表示する領域を設定します。
まず付箋紙アプリケーションを作るのに必要なファイルを用意しましょう。
AIRアプリケーションを作るには、アプリケーション記述ファイルが必要です。「Sticka-app.xml」として、下記のファイルを作成します。文字コードはUTF-8で作成してください。
stickies-app.xml
（画像をクリックすると別ウィンドウに拡大図を表示します）
今度は、メインウィンドウでmenu.swfというファイルが表示されます。前回は「はろーわーるど」を表示するtest.swfを、test.asというActionScriptファイルから生成しました。
test.asのようにプログラムでウィンドウの部品を生成する方法もあるのですが、この方法では多くの部品を配置したときに、プログラムが非常に長くなり、作成や修正が非常に困難になります。
そこで、GUIの設定には、MXML（Macromedia Flex Markup Language）を使います。これを使えば、HTMLのような文法でAIRのウィンドウを定義することができます。では前回のtest.asをMXML形式にしてみましょう。
test.mxml
（画像をクリックすると別ウィンドウに拡大図を表示します）
1行目はXML宣言です。MXMLはXMLの一種なので、この宣言を使います。
2行目からは表示されるウィンドウの定義です。2行目では一番親になるコンポーネントを定義します。今回はアプリケーションウィンドウなので「mx:WindowedApplication」というコンポーネントをベースにします。そして、このウィンドウの中に、文字を表示させるmx:Labelコンポーネントを置き、座標とテキストを指定します。
test.asでは、「TextFiled」というクラスを使っていますが、MXMLではmx:Labelというコンポーネントを使っています。MXMLで使うことのできるコンポーネントはmx.controlというパッケージで提供されているものですので注意してください。
下記URLの左上にあるPackageウィンドウから、「mx.control」を選ぶとその下のウィンドウに使うことができるコンポーネントが表示されます。
Package List - Flex 3 Language Reference
http://livedocs.adobe.com/labs/flex/3/langref/index.html
このMXMLはFlexで使われている形式です。「
第3回：実践！Flex 2でプログラム作成
」でも解説されるので、こちらも参考にしてください。
前のページ
1
2
3
次のページ
著者プロフィール
株式会社ワイズノット 増井 雄一郎
PukiWikiなどのオープンソース活動を経て、2005年からRuby on Railsに的を絞り、2006年はRubyに関する仕事のみで生計をたてる。これまでのフリー活動から転身し、アメリカ行きを目指して2007年4月に(株)ワイズノットに入社。クロスメディア事業部でSaaSプラットフォームの構築に従事。現在の興味はテキストマイニング。
INDEX
第4回：AIRでメニューウィンドウ作成！
付箋紙を表示するプログラムの作成
メニューウィンドウを作る
メニューウィンドウの定義
