AIR SDK を使用した初めての HTML ベースの AIR アプリケーションの作成

目次 [非表示]

プロジェクトファイルの作成
AIR アプリケーション記述ファイルの作成
アプリケーションの HTML ページの作成
アプリケーションのテスト
AIR インストールファイルの作成
次のステップ

Adobe® AIR™ の機能を簡潔かつ実践的に説明するため、以下の手順に従って、HTML ベースの単純な AIR アプリケーション「Hello World」を作成してパッケージ化します。

作業を開始するには、ランタイムをインストールし、AIR SDK を設定しておく必要があります。このチュートリアルでは、AIR Debug Launcher（ADL）および AIR 開発ツール（ADT）を使用します。ADL および ADT は、コマンドラインユーティリティプログラムで、AIR SDK の bin ディレクトリにあります（HTML 開発ツールの設定を参照）。このチュートリアルは、コマンドラインからのプログラムの実行に慣れていること、および使用しているオペレーティングシステムに必要なパス環境変数の設定方法を理解していることを前提にしています。

プロジェクトファイルの作成

すべての HTML ベースの AIR プロジェクトには、2 つのファイルを含める必要があります。1 つはアプリケーションメタデータを指定するアプリケーション記述ファイルで、もう 1 つは最上位の HTML ページです。これらの必須ファイルに加えて、このプロジェクトには、AIR API クラスの便利なエイリアス変数を定義する JavaScript コードファイル AIRAliases.js が含まれます。

最初に次の操作を実行します。

HelloWorld という名前のディレクトリを作成し、プロジェクトファイルを含めます。
HelloWorld-app.xml という名前の XML ファイルを作成します。
HelloWorld.html という名前の HTML ファイルを作成します。
AIR SDK のフレームワークフォルダからプロジェクトディレクトリに AIRAliases.js をコピーします。

AIR アプリケーション記述ファイルの作成

AIR アプリケーションの構築を開始するには、次の構造の XML アプリケーション記述ファイルを作成します。

<application> 
    <id>…</id> 
    <version>…</version> 
    <filename>…</filename> 
    <initialWindow> 
        <content>…</content> 
        <visible>…</visible> 
        <width>…</width> 
        <height>…</height> 
    </initialWindow> 
</application>

編集用の HelloWorld-app.xml を開きます。
次の AIR 名前空間属性を含め、ルートの <application> エレメントを追加します。

<application xmlns="http://ns.adobe.com/air/application/1.0"> 名前空間の最後のセグメントである「1.0」は、アプリケーションに必要なランタイムのバージョンを指定します。
<id> エレメントを追加します。

<id>examples.html.HelloWorld</id> アプリケーション ID は、（アプリケーションパッケージに署名するために使用された証明書から AIR が派生させる）発行者 ID と共にアプリケーションを一意に識別します。推奨される形式は、「com.company.AppName」などのピリオド区切りの逆 DNS スタイルのストリングです。アプリケーション ID は、インストール、プライベートなアプリケーションファイルシステムストレージディレクトリへのアクセス、プライベートな暗号化ストレージへのアクセスおよびアプリケーション間の通信に使用されます。
<version> エレメントを追加します。

<version>0.1</version> インストールしているアプリケーションのバージョンをユーザが確認できるようにします。
<filename> エレメントを追加します。

<filename>HelloWorld</filename> アプリケーション実行可能ファイル、インストールディレクトリおよびオペレーティングシステムでのアプリケーションに対するその他の参照に使用される名前です。
次の子エレメントを含む <initialWindow> エレメントを追加して、初期アプリケーションウィンドウのプロパティを指定します。

<content>HelloWorld.html</content> 読み込む対象となる AIR のルート HTML ファイルを識別します。

<visible>true</visible> ウィンドウがすばやく表示されるようにします。

<width>400</width> ウィンドウの幅（ピクセル単位）を設定します。

<height>200</height> ウィンドウの高さを設定します。

ファイルを保存します。完全なアプリケーション記述ファイルは、次のとおりです。

<?xml version="1.0" encoding="UTF-8"?> 
<application xmlns="http://ns.adobe.com/air/application/1.0"> 
    <id>examples.html.HelloWorld</id> 
    <version>0.1</version> 
    <filename>HelloWorld</filename> 
    <initialWindow> 
        <content>HelloWorld.html</content> 
        <visible>true</visible> 
        <width>400</width> 
        <height>200</height> 
    </initialWindow> 
</application>

この例では、設定可能なアプリケーションプロパティのうち、一部のみが設定されています。ウィンドウクロム、ウィンドウサイズ、透明度、デフォルトのインストールディレクトリ、関連付けられているファイルの種類、およびアプリケーションアイコンなどを指定できるようにする、アプリケーションプロパティの完全なセットについては、AIR アプリケーションプロパティの設定を参照してください。

アプリケーションの HTML ページの作成

次に、AIR アプリケーションのメインファイルとして機能する簡単な HTML ページを作成する必要があります。

編集用の HelloWorld.html ファイルを開きます。次の HTML コードを追加します。

<html> 
<head> 
    <title>Hello World</title> 
</head> 
<body onLoad="appLoad()"> 
    <h1>Hello World</h1> 
</body> 
</html>

HTML の <head> セクションで、AIRAliases.js ファイルを読み込みます。
```
<script src="AIRAliases.js" type="text/javascript"></script>
```
AIR は、HTML window オブジェクトで runtime という名前のプロパティを定義します。runtime プロパティでは、クラスの完全修飾パッケージ名を使用して、ビルトインの AIR クラスにアクセスできます。例えば、AIR File オブジェクトを作成するには、JavaScript で次のステートメントを追加します。
```
var textFile = new runtime.flash.filesystem.File("app:/textfile.txt");
```
AIRAliases.js ファイルは、最も有用な AIR API の便利なエイリアスを定義します。AIRAliases.js を使用すると、File クラスへの参照を次のように短縮できます。
```
var textFile = new air.File("app:/textfile.txt");
```
AIRAliases の script タグの下に、onLoad イベントを処理する JavaScript 関数を含む別の script タグを追加します。
```
<script type="text/javascript"> 
function appLoad(){ 
    air.trace("Hello World"); 
} 
</script>
```
appLoad() 関数は、単純に air.trace() 関数を呼び出します。ADL を使用してアプリケーションを実行すると、トレースメッセージがコマンドコンソールに出力されます。トレースステートメントは、デバッグ時に非常に役に立つ場合があります。
ファイルを保存します。

HelloWorld.html ファイルは次のようになります。

<html> 
<head> 
    <title>Hello World</title> 
    <script type="text/javascript" src="AIRAliases.js"></script> 
    <script type="text/javascript"> 
        function appLoad(){ 
            air.trace("Hello World"); 
        }  
    </script> 
</head> 
<body onLoad="appLoad()"> 
    <h1>Hello World</h1> 
</body> 
</html>

アプリケーションのテスト

コマンドラインからアプリケーションを実行およびテストするには、AIR Debug Launcher（ADL）ユーティリティを使用します。ADL 実行可能ファイルは、AIR SDK の bin ディレクトリにあります。AIR SDK をまだ設定していない場合は、HTML 開発ツールの設定を参照してください。

最初に、コマンドコンソールまたはシェルを開きます。このプロジェクト用に作成したディレクトリに変更します。続いて、次のコマンドを実行します。

adl HelloWorld-app.xml

AIR ウィンドウが開き、アプリケーションが表示されます。また、コンソールウィンドウには、air.trace() を呼び出した結果のメッセージが表示されます。

詳しくは、AIR Debug Launcher（ADL）の使用を参照してください。

AIR インストールファイルの作成

アプリケーションが正常に実行されたら、ADT ユーティリティを使用して、アプリケーションを AIR インストールファイルにパッケージ化できます。AIR インストールファイルは、ユーザに配布できるアプリケーションファイルを格納するアーカイブファイルです。パッケージ化された AIR ファイルをインストールする前に Adobe AIR をインストールする必要があります。

アプリケーションのセキュリティを確保するには、すべての AIR インストールファイルに電子署名する必要があります。開発のために、ADT または別の証明書生成ツールを使用して基本的な自己署名入り証明書を生成できます。VeriSign や Thawte などの商用の証明機関から商用コード署名証明書を購入することもできます。ユーザが自己署名入り AIR ファイルをインストールした場合、インストールプロセスの間、発行者は「不明」として表示されます。これは、自己署名入り証明書は AIR ファイルが作成されてから変更されていないことだけを保証するからです。なりすましの AIR ファイルの自己署名や、それをアプリケーションとして提示することを防ぐことはできません。AIR ファイルを一般にリリースする場合は、検証可能な商用証明書を強くお勧めします。AIR のセキュリティに関する問題については、AIR のセキュリティを参照してください。

自己署名入り証明書とキーのペアの生成

コマンドプロンプトから次のコマンドを入力します（ADT 実行可能ファイルは、AIR SDK の bin ディレクトリにあります）。

adt –certificate -cn SelfSigned 1024-RSA sampleCert.pfxsamplePassword

ADT は、証明書と関連の秘密キーを含む sampleCert.pfx という名前のキーストアファイルを生成します。

この例では、証明書に対して設定できる最小限の数の属性を使用しています。イタリックのパラメータに対しては任意の値を使用できます。キーのタイプは 1024-RSA または 2048-RSA にする必要があります（AIR ファイルへの電子署名を参照してください）。

AIR インストールファイルの作成

コマンドプロンプトから、次のコマンドを入力します（1 つのライン）。

adt -package -storetype pkcs12 -keystore sampleCert.pfx HelloWorld.air 
HelloWorld-app.xml HelloWorld.html AIRAliases.js

キーストアファイルパスワードを求めるプロンプトが表示されます。

HelloWorld.air 引数は、ADT によって作成される AIR ファイルです。HelloWorld-app.xml はアプリケーション記述ファイルです。後続の引数は、アプリケーションによって使用されるファイルです。この例では 2 つのファイルだけが使用されますが、任意の数のファイルとディレクトリを含めることができます。

AIR パッケージが作成された後に、パッケージファイルをダブルクリックすることによって、アプリケーションをインストールおよび実行できます。シェルウィンドウまたはコマンドウィンドウで、コマンドとして AIR ファイル名を入力することもできます。

次のステップ

AIR では、HTML と JavaScript コードは通常、一般的な Web ブラウザと同じように動作します（実際、AIR は Safari Web ブラウザで使用されているものと同じ WebKit レンダリングエンジンを使用します）。ただし、AIR で HTML アプリケーションを開発する際に理解しておく必要がある重要な違いがいくつかあります。これらの違いと、その他の重要なトピックについて詳しくは、次を参照してください。