いよいよ、AIR SDKを使ってシンプルなAIRアプリケーションを作成してみましょう。ここでは、HTMLで記述されたドキュメントをAIR SDKコマンドでアプリケーションに変換します。なお、今回は使用していませんが、HTMLにはJavaScriptを記述できますので、JavaScriptを使った機能もAIRアプリケーションに盛り込めます。
「Hello AIR」――HTMLからAIRアプリケーションを作成する
まず、HTMLドキュメントがどのようなAIRアプリケーションになるか、完成画面を見てみましょう。以下は、元になるHTMLドキュメントをブラウザーで表示したところです。
アプリケーションの元になるHTML
このHTMLドキュメントは、下の画面のようなAIRアプリケーションになります。タイトルバーなどを見ると、ブラウザー上ではなくアプリケーションとして動作していることが分かります。このようなアプリケーションを作成するには、Windowsの場合、Visual Basic.NETなどの開発ツールを使用するのが一般的でしたが、AIRによって手軽に作成できるようになりました。しかも作成したアプリケーションは手を加えることなく、Mac OSやLinuxでも動作します。
「Hello AIR」アプリケーションの完成画面
■HTMLドキュメントを用意する
AIRアプリケーションの元になるHTMLドキュメントは、下のようなシンプルなものです。テキストエディターでドキュメントを作成し、文字コードをUTF-8形式にして保存します。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2//EN">
<html>
<head>
<title>タイトル:Hello AIR</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8 " />
</head>
<body>
<h1>Hello AIR</h1>
<p>最もシンプルなAIRアプリケーション</p>
</body>
</html>
■AIRアプリケーション記述ファイルを作成する
HTMLファイルをAIRアプリケーションに変換して実行する前に、アプリケーションの情報を記述したXML形式のファイルを作成する必要があります。情報ファイルには、「アプリケーション名」「バージョン」「使用するHTMLファイル」「起動時のウィンドウのサイズ」といった、作成するアプリケーションの基本情報が含まれます。このXML形式ファイルを「AIRアプリケーション記述ファイル（application descriptor file）」と呼びます。
SDKによるAIRアプリケーションの作成
AIRアプリケーション記述ファイルは、HTML/Flash/Flexの作成方法に関わらず必要な設定情報です。ここでは、次のようなアプリケーション記述ファイルを作成します。
<?xml version="1.0" encoding="utf-8" ?>
<application xmlns="http://ns.adobe.com/air/application/1.5" minimumPatchLevel="0">
<id>example.html.HelloAIR</id>
<version>1.0</version>
<filename>HelloAIR</filename>
<initialWindow>
<content>HelloAIR.html</content>
<visible>true</visible>
<width>400</width>
<height>200</height>
</initialWindow>
</application>
このファイルには、次のような情報が記述されています。
- <?xml version="1.0" encoding="UTF-8"?>
- xmlバージョン1.0で、UTF-8エンコーディングで記述するという宣言です。
- <application xmlns=”http://ns.adobe.com/air/application/1.5” minimumPatchLevel="0">
- AIRの名前空間を指定しています。application/1.5の「1.5」は使用するAIRランタイムのバージョンを示します。2009年8月現在のカレントバージョンはAIR1.5です。このバージョンのSDKを使用する場合、このままの記述でOKです。
- <id>com.websysd. HelloAIR</id>
- アプリケーションに固有のIDを記述します。通常「com.company.アプリケーション名」のような、「reverse-DNS」と呼ばれるIDが使用されます。
- <version>1.0</version>
- 作成するアプリケーションのバージョンは1.0であることを示します。
- <filename>HelloAIR</filename>
- AIR実行ファイルの名前を示します。
- <initialWindow>
- ここから初期ウィンドウの設定であることを示します。
- <content>HelloAIR.html</content>
- メインHTMLソースファイル名
- <visible>true</visible>
- 起動後にウィンドウを表示
- <width>400</width>
- ウィンドウの幅=400ピクセル
- <height>200</height>
- ウィンドウの高さ=200ピクセル
- < /initialWindow<
- 初期ウィンドウの設定はここで終了です。
- </application>
- アプリケーション記述はここで終了です。
AIRアプリケーション記述ファイルは、HTMLと同じフォルダーに作成します。今回は次のようなファイル名で作成します。
- HTMLファイル： c:¥air_app¥HelloAIR.html
- アプリケーション記述ファイル： c:¥air_app¥HelloAIR-app.xml
必要なファイルが用意ができたら、すぐに実行してみましょう。コマンドプロンプトで保存フォルダー(c:¥air_app)に移動し、adlプログラムを実行します。
C:¥air_app>adl HelloAIR-app.xml
以下のように、「Hello AIR」アプリケーションが無事に表示されれば成功です。
なお、HTMLファイルをShift-JISなどで保存すると次のように日本語が正しく表示されません。UTF-8形式で保存すると日本語が正しく表示されますので、文字化けが発生した場合は確認してください。Windows VistaなどのOSに付属する新しいメモ帳では、文字コードを指定して保存できます。
アドビ製品でAIRアプリケーションを作成する
今回ご紹介したSDKによるAIRアプリケーションの開発は、あまり効率のよい方法ではありません。あくまでもAIR SDKの基本処理を手動で確認するためのものであり、本格的なAIRアプリケーションの構築にはアドビ製品を利用するのが近道です。
アドビはすべてのWeb制作者、Flashデベロッパー、Flex開発者がそれぞれのスキルを生かしてAIRアプリケーションを作成できるように、 Dreamweaver CS3以降／Flash Professional CS3以降／Flex Builder3以降（Flex 4からはFlash Builder）で、AIRアプリケーションの開発をサポートしています。これらのツールを使えば、AIRアプリケーションの作成やテストを効率よくできます。
最後に
今回はAIRランタイムの入手、シームレスインストールによるAIRアプリケーションとランタイムのインストール方法、AIR SDKとテキストエディタによるHTML版AIRアプリケーションの作成方法をご紹介しました。AIR SDKだけを使ったアプリケーションの作成はあまり効率的ではありませんが、AIR SDKはAIR開発環境に共通する、ベースとなるツールですので覚えておくとよいでしょう。
次回より、本格的なAIRアプリケーション開発の基本手順をご紹介します。
■次回のトピック
- DreamweaverによるAjax版AIRアプリケーションの開発手順
著者：宮田 亮氏
Webシステム開発株式会社代表取締役 開発・教育エンジニア。アドビ認定Flex/AIR/Flashデベロッパー、同Flex/AIR/Flashインストラクター。20年を超えるIT開発・教育・マネジメントキャリアを持ち、Flex、AIR、Java、C/C++、Oracle、MySQL、.NET等を駆使したシステム開発経験多数。同社サイトでは、Flex/AIRの技術情報やサンプルコードの公開している。技術者養成の専門スクールIT塾（Adobe認定トレーニングセンター）でFlex/AIRセミナーも随時開講。著書は「Flex 3プログラミング入門」（秀和システム）、「AIRプログラミング入門」（秀和システム）。
