▼Adobe AIRメモ▼
Flex Builder 3によるはじめてのAIRアプリケーションの作成


「Hello World!」という文字列を表示するだけのAIRアプリケーションを作成する。



開発ツールの準備


Flex Builder 3 Professional
Flexアプリケーションを開発するための統合開発環境。
ダウンロードするにはユーザー登録が必要。
有償だが60日間の体験版で試用できる。
スタンドアロンとEclipseプラグインがあるが、スタンドアロンを選んだほうが無難。
ダウンロードしてインストーラの指示に従ってインストール。


プロジェクトの作成


プロジェクトの作成
  1. Flex Builder 3を起動。
  2. メニュー「ファイル→新規→Flexプロジェクト」を選択。
  3. 「プロジェクト名」に「HelloWorld」、「アプリケーションの種類」に「デスクトップアプリケーション(Adobe AIRで実行)」を指定し、次へボタンを押す。
  4. 再度次へボタンを押す。
  5. 「メインアプリケーションファイル」に「HelloWorld.as」、「アプリケーションID」に「net.npaka.HelloWorld」を指定し、終了ボタンを押す。アプリケーションIDはIDの衝突を避けるため、自分の持つドメインを付加する方が良い。


追加コンパイラ引数の設定
  1. ナビゲータのHelloWorldを右クリックし、ポップアップの「プロパティー」を選択。
  2. プロジェクトのプロパティーダイアログが開くので、「Flex コンパイラ」を選択し、「追加コンパイラ引数」に以下のオプションを指定。

    -default-size 240 240 -default-frame-rate=30 -default-background-color=0xFFFFFF

    コンパイラ引数の書式は次の通り。

    -default-size 幅 高さ -default-frame-rate=フレームレート -default-background-color=背景色

  3. OKボタンを押す。


ソースコードの記述


プロジェクト生成時に追加された「HelloWorld.as」を次のように編集する。

HelloWorld.as
package {
    import flash.display.*;  
    import flash.text.*;  

    //HelloWorld
    public class HelloWorld extends Sprite {
        public function HelloWorld() {
            var textField:TextField=new TextField();
            textField.text="Hello World!";
            textField.autoSize=TextFieldAutoSize.LEFT;
            addChild(textField);
        }
    }
}


ADFの作成


「ADF」とは、AIRアプリケーションの属性を記述するXMLファイル。
次のように記述する。
HelloWorld-app.xml
<?xml version="1.0" encoding="UTF-8"?>
<application xmlns="http://ns.adobe.com/air/application/1.0">
    <id>net.npaka.HelloWorld</id>
    <version>1.0</version>
    <filename>HelloWorld</filename>
    <description>This is HelloWorld.</description>
    <copyright>(C) NPAKA 2007</copyright>

    <initialWindow>
        <title>HelloWorld</title>
        <content>HelloWorld.swf</content>
        <systemChrome>standard</systemChrome>
        <transparent>false</transparent>
        <visible>true</visible>
    </initialWindow>
</application>
属性間での改行は可能だが、タグに囲まれた部分(<hoge>〜</hoge>)での改行はNGとなる。


先頭1行目はXML宣言で決まり文句。
「applicationタグ」内の属性は次の1つ。
タグ 必須/オプション 説明
xmlns 必須 デフォルトの名前空間として必ず以下のURIを指定
http://ns.adobe.com/air/application/1.0
<application xmlns="http://ns.adobe.com/air/application/1.0">


「applicationタグ」内に配置するタグは次の13個。
タグ 必須/オプション 説明
id 必須 アプリケーションを識別するためのユニークなID
他の人のアプリとかぶらないように自分のホストを頭に付加すると良い
使用可能な文字は「0-9」「a-z」「A-z」「.」「-」
<id>net.npaka.HelloWorld</id>
version 必須 バージョン <name>1.0</name>
filename 必須 ファイル名 <filename>HelloWorld</filename>
name オプション タイトル名。インストール時に表示 <name>HelloWorld</name>
description オプション 説明。インストール時に表示 <description>This is HelloWorld.</description>
copyright オプション コピーライト。インストール時に表示 <copyright>(C) NPAKA 2007</copyright>
initialWindow 必須 初期ウィンドウ。次表で解説 <initialWindow>
 <title>HelloWorld</title>
 <content>HelloWorld.swf</content>
 <systemChrome>standard</systemChrome>
 <transparent>false</transparent>
 <visible>true</visible>
</initialWindow>
installFolder オプション インストール先フォルダ名 <installFolder></installFolder>
programMenuFolder オプション スタートメニューの配置(Windowsのみ) <programMenuFolder>Example Company/Example   Application</programMenuFolder>
icon オプション アイコンを指定 <icon>
<image16x16>16.png</image16x16>
<image32x32>32.png</image32x32>
<image48x48>48.png</image48x48>
<image128x128>128.png</image128x128>
</icon>
customUpdateUI オプション アプリケーションのバージョンアップの許可フラグ <customUpdateUI></customUpdateUI>
allowBrowserInvocation オプション Webブラウザでクリックした時のアプリケーション起動の許可フラグ <allowBrowserInvocation></allowBrowserInvocation>
fileTypes オプション ファイル拡張子登録
fileTpe(ファイル拡張子種別)
name(名前)
extension(拡張子)
description(説明)
contentType(コンテントタイプ)

icon(アイコン)
<fileTypes>
fileType>
<name>com.example</name>
<extension>xmpl</extension>
<description>Example file</description>
<contentType>example/x-data-type</contentType>
<icon>
<image16x16></image16x16>
<image32x32></image32x32>
<image48x48></image48x48>
<image128x128></image128x128>
</icon>
</fileType>
</fileTypes>

「initialWindowタグ」内に配置するタグは次の14個。
タグ 必須/オプション 説明
content 必須 最初にロードされるSWF/HTML <content>HelloWorld.swf</content>
title オプション タイトルバーの文字列 <title>HelloWorld</title>
systemChrome オプション standard:ウィンドウ枠を表示する
none:ウィンドウ枠を表示しない
<systemChrome>standard</systemChrome>
transparent オプション ウィンドウを透明にするかどうか
trueを指定できるのはsystemChrome="none"の時のみ
<transparent>false</transparent>
visible オプション アプリケーションの表示・非表示 <visible>true</visible>
minimizable オプション 最小化の有無(true/false) <minimizable>true</minimizable>
maximizable オプション 最大化の有無(true/false) <maximizable>true</maximizable>
resizable オプション リサイズの有無(true/false) <resizable>true</resizable>
width オプション ウィンドウ幅 <width>500</width>
height オプション ウィンドウ高さ <height>500</height>
x オプション ウィンドウX座標 <x>150</x>
y オプション ウィンドウY座標 <y>150</y>
minSize オプション 最小ウィンドウサイズ <minSize>300 300</minSize>
maxSize オプション 最大ウィンドウサイズ <maxSize>800 800</maxSize>


AIRアプリケーションの動作確認


メニュー「実行→HelloWorldの実行」で実行、「実行→HelloWorldのデバッグ」でデバッグ実行できる。


AIRファイルの生成


  1. メニュー「プロジェクト→リリースビルドの書き出し」を選択。
  2. 「プロジェクト」に「HelloWorld」、「アプリケーション」に最初に実行するActionScriptファイル「HelloWorld.as」を指定し次へボタンを押す。
  3. 「AIRファイルを書き出してデジタル証明書で署名」を選択し、作成ボタンを押す。
  4. 自分の署名情報を入力。
    項目 必須/オプション 指定
    発行者名 必須 {発行者名}
    組織単位 オプション
    組織名 オプション
    国名 必須 JP
    種類 必須 102-RSA
    パスワード 必須 {パスワード}
    確認パスワード 必須 {パスワード}
    別名で保存 必須 C:\sample.p12
  5. OKボタンを押す。署名ファイルの保存先に署名ファイル(*.p12 or *.pfx)が生成される。
  6. Certificateに生成した署名ファイルのパス、Passwordに生成した署名ファイルのパスワードを入力し、Finishボタンを押す。
  7. 警告ダイアログが表示されるのでOKボタンを押す。
    成功するとHelloWorld.airファイルがプロジェクトフォルダに生成される。
HelloWorld.airをダブルクリックすることで、アプリケーションのインストールおよび実行ができる。


−戻る−