お気に入り | 日本語 | ログイン

Google Maps API for Flash - FlexBuilder チュートリアル

開発環境を設定する

このセクションでは、ActionScript でプログラミングを行い、Adobe の FlexBuilder IDE を使って初めての Google Maps API for Flash 地図が作成できるように、Adobe FlexBuilder の入手とセットアップ、Google Maps API for Flash ライブラリの参照、開発環境の準備を行う方法について説明します。

注: Free Flex SDK を使用する場合は、Flex SDK チュートリアルをご覧ください。

FlexBuilder のセットアップ

Google Maps をお使いの Flex アプリケーションに組み込むには、ActionScript コードだけでなく Flex MXML ファイルについての理解も必要です。このチュートリアルでは、FlexBuilder (Adobe の Flex 開発用 IDE) の中で地図アプリケーションを運用する方法について説明します。FlexBuilder は下記の URL から入手できます。

http://www.adobe.com/jp/products/flex/features/flex_builder/

このチュートリアルは、読者が FlexBuilder アプリケーションを購入し、セットアップしていることを前提としています。

プロジェクトの作成

アプリケーションのコーディングを始める前に、FlexBuilder でプロジェクトをセットアップしてください。そのための手順は、以下のとおり簡単です。

  1. FlexBuilder で [ファイル] -> [新規] -> [Flex プロジェクト] の順に選択します。[New Flex Project] ダイアログ ボックスが表示されます。プロジェクトの名前とそのプロジェクトに関するファイルの保存場所を入力します。[Application Type] は [Web Application] のままにします。

  2. [Finish] をクリックすると、プロジェクトが作成されます。FlexBuilder では、下図のようなテンプレートの MXML ファイルが自動的に作成されます。

  3. Google Maps API for Flash ライブラリへのリンク

  4. コードをコンパイルするには、事前にコードを Google Maps API for Flash SWC ファイルにリンクする必要があります。これを行うには、[Project] -> [Properties] の順に選択します。該当するプロジェクトの [Properties] ダイアログ ボックスが表示されます。[Flex Build Path] をクリックして、[Library Path] タブを選択します。

  5. [Library Path] パネル内の [Add SWC] をクリックします。[Add SWC] ダイアログ ボックスが表示されます。Google Maps API for Flash SDK を保存した場所に移動し、該当する lib/map_flex_*.swc ファイルを選択して [OK] をクリックします (注: SWC は正しいものを選択してください。FlexBuilder では Flex 以外の SWC ライブラリは使用できません)。これでダイアログ ボックスは下図のようになります。

  6. [OK] をクリックします。FlexBuilder によってプロジェクトが更新され、画面はスケルトンの MXML ファイルを表示する Flex Development Perspective に戻ります。

  7. この時点でスケルトンの MXML ファイルのコンパイルをテストして、開発環境が正しく機能しているか確認するとよいでしょう。

開発ディレクトリの設定

New! Google Maps API for Flash は Flex 内の com.google.maps.Map オブジェクトに対するネイティブ サポートを提供します。Map クラスを拡張して Map アプリケーション クラスを定義する必要はもうありません。Flex の中で Map コンポーネントを直接使用できます。

Flex アプリケーションは MXML 宣言の中で定義されます。通常、これらの MXML アプリケーションの定義は、ソース コード ディレクトリのルートに配置してください。デフォルトでは、FlexBuilder はソース コードを格納するための src ディレクトリを該当プロジェクトの中に作成します。MXML ファイルはそのディレクトリのルートに配置してください。

新しい MXML ファイルを作成するには、[File] -> [New] -> [MXML Application] の順に選択します。MXML ファイルの名前は HelloWorld.mxml とします。このスケルトンの MXML アプリケーションについて、以下のセクションで説明します。

名前空間を使った拡張の管理

既存の Google Maps API for Flash コンポーネントを「拡張」するコンポーネントは通常、一意の名前空間の中で ActionScript ファイルとして用意します。他のアプリケーションとの衝突を防ぐため、所有している名前空間を使用することを推奨します。これが特に重要なのは、多数のデベロッパーが複数の flash アプリケーションの作業を同時に行う場合です。名前空間を使用すれば、アプリケーション コードを「パッケージ」にまとめることもできるので、共通するコードの共有が簡単になります。

パッケージと名前空間は、 トップ レベル ドメイン、組織ドメイン、サブドメインを使って定義します。たとえば、Google Maps 名前空間は com.google.maps と定義され、その名前空間の中の examples パッケージは com.google.maps.examples と定義されます。この名前空間を使えば、アプリケーションのディレクトリ構造 (たとえば com/google/maps/examples/) を暗示的に定義することもできます。

この名前空間を使って、ActionScript コードの中でパッケージを定義し、MXML 宣言の中でアプリケーションを定義します。一般に、ActionScript コード (*.as ファイル) は名前空間の定義にかかわらず最も深いディレクトリにありますが、MXML 宣言 (*.mxml ファイル) はディレクトリ構造の「ルート」にあります。

Maps API for Flash の「Hello World」の記述

Google Maps API for Flash について学習する場合、簡単な例を見るのが最もやさしい方法です。このチュートリアルでは、FlexBuilder を使って簡単な MXML ファイルを作成し、いくつかの ActionScript コードを追加します。また、Flex SDK を使って、その MXML ファイルを SWF ファイルにコンパイルし、この SWF ファイルを実行して目で確認します。

MXML 宣言

MXML 宣言は Flex アプリケーションの中で UI 要素を定義し、<mx:Script> タグの中に埋め込んだ ActionScript コードはそれらの UI 要素のアクションを定義します。最も簡単な例では、MXML の中で com.google.maps.Map オブジェクトを宣言し、ActionScript コードを使って地図を初期化します。

HelloWorld.mxml ファイルを下図のように変更します。このファイル内のコードを順番に説明しましょう。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<maps:Map xmlns:maps="com.google.maps.*" id="map" mapevent_mapready="onMapReady(event)" width="100%" height="100%" key="your_api_key"/>
<mx:Script>
    <![CDATA[
   
    import com.google.maps.LatLng;
    import com.google.maps.Map;
    import com.google.maps.MapEvent;
    import com.google.maps.MapType;

    private function onMapReady(event:Event):void {
      this.map.setCenter(new LatLng(40.736072,-73.992062), 14, MapType.NORMAL_MAP_TYPE);
    }
    ]]>
</mx:Script>
</mx:Application>

この例は gmaps-samples-flash.googlecode.com/svn/trunk/examples/HelloWorld.html にあります (MXML ソースは こちらにあります)。この例を自分の Web サイトに表示するには、自分の API キーを使って SWF ファイルを作成する必要があります。

この簡単な例でも、次のいくつかの点について注意する必要があります。

  1. 最初に <mx:Application> を宣言し、Flex アプリケーションに必要なコードのすべてを収容します。この <mx:Application> オブジェクトの中で、xm 名前空間を宣言し、標準の Flex コンポーネントを参照します。
  2. Map オブジェクトを <mx:Application> の子として宣言し、maps 名前空間を定義して com.google.maps.* からコードを参照します。idmapevent_mapready ハンドラ、API key などのパラメータも定義します。これらのパラメータについては後で説明します。
  3. 子の <mx:Script> オブジェクトの中で ActionScript コードを定義します。
  4. その ActionScript コードの中で、mapevent_mapready イベントを受け取ると、地図を中心に配置します。

これらの手順について、以下で詳しく説明します。

アプリケーションの宣言

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

Google Maps Flash アプリケーションには ActionScript コードだけでなく、地図と関連する UI 要素を Web ページに表示するためのユーザー インターフェース フレームワークも必要です。Flex フレームワークでは、これらの UI コンポーネントを MXML 宣言の中で指定します。MXML 宣言は .mxml という接尾辞の付いた構成ファイルです。この MXML ファイルは通常、ActionScript 開発ディレクトリのルートにあります。

Flash マップを Web ページに表示するには、少なくとも 1 回の MXML 宣言が必要です。どの MXML 宣言にもルートの <mx:Application> コンポーネントが必要です。また、<mx:Application> は mx という接頭辞も登録し、標準の Flex コンポーネントを参照します。

MXML 宣言は非常に複雑な場合もあり、このドキュメントでは MXML 宣言の中の UI コンポーネントのレイアウトについては説明しません。詳細については、記載した例を参照し、Flex SDK ドキュメントをご覧ください。

地図の宣言

<maps:Map xmlns:maps="com.google.maps.*" id="map" mapevent_mapready="onMapReady(event)" width="100%" height="100%" key="your_api_key"/>

Google Maps API for Flash には、com.google.maps.* パッケージの中で定義した Map オブジェクトに対するネイティブ サポートが含まれています。ここで Map<mx:Application> の子として追加し、その名前空間を maps と定義し (それを com.google.maps.* コードにリンクし)、ActionScript コードの中から地図を参照できる id を設定し、mapevent_mapready ハンドラを定義します。(以下の 「イベント処理」を参照。)

そのほか、<maps:Map> 宣言は width および height パラメータを指定して、アプリケーション内部での地図の表示方法を定義します。もっと重要なのは、MXML 宣言が、一意の API key を配置するのに便利な場所となることです。

ActionScript コードの記述

<mx:Script>
    <![CDATA[
    
    // ActionScript Code
    
    ]]>
</mx:Script>

Google Maps API for Flash の中の地図は、ActionScript 3.0 コードを使って操作します。ActionScript の詳細は、このチュートリアルでは説明しません。下記の ActionScript オンライン チュートリアルをご覧ください。

<mx:Script> オブジェクトは、ActionScript コードへの参照を収容する Flex コンポーネントです。MXML は XML の変種ですから、<![CDATA[][ および ]]> という区切り文字を使って、このファイル内の ActionScript コードを無視するように、MXML パーサーに知らせる必要があります。

注: 個別の ActionScript (*.as) ファイルに ActionScript を組み込みたいと思われるかもしれません。そのような場合は、<mx:Script> タグに source パラメータを組み込むことで、ActionScript ファイルを参照することができます。

<mx:Script> source="HelloWorld.as"></mx:Script>

大規模なアプリケーションや複雑なアプリケーションの場合、通常、個別のファイルにコードを組み込むことは理にかなっています。ただし、このドキュメント ベースでは、わかりやすいように MXML 宣言の中にインライン コードをすべて示します。

ライブラリのインポート

    import com.google.maps.LatLng;
    import com.google.maps.Map;
    import com.google.maps.MapEvent;
    import com.google.maps.MapType;

import 宣言をして ActionScript ライブラリをインポートします。上記のサンプル コードでは、複数の Google Maps Flash ライブラリをインポートしています。

サンプル コードで使用するタイプに合ったライブラリを確実にインポートしてください。クラスは必要なものだけインポートすることをお勧めします。このドキュメント内のほとんどの構成例では、コードが構成されるので <mx:Application> は Flex UI コンポーネントを使いません。そうすることで軽量の基本地図を提供します。Flex ライブラリを含めると、必要な Flex コンポーネント (ボタンなど) が 1 つだけの場合でも、SWF ファイルのサイズがかなり大きくなることに注意してください。

イベント リスナのセットアップ

ActionScript は JavaScript と同様、イベント ドリブンのプログラミング言語です。Flash オブジェクト内部のユーザーとのインタラクションは、特定のイベントに合ったイベント リスナをオブジェクトに登録することによって処理します。

前のセクションに記載したコード スニペットの Map 宣言では、特殊なパラメータ mapevent_mapready を使って、MapEvent.MAP_READY イベントに合ったイベント リスナが Map オブジェクトに追加されました。このイベント ハンドラは、Google Maps API for Flash アプリケーションを初期化するための「フック」として機能します。地図はそのイベントを受け取ると、下記のように onMapReady 関数を呼び出します。

function onMapReady(event:MapEvent):void {
  setCenter(new LatLng(40.736072,-73.992062), 14, MapType.NORMAL_MAP_TYPE);
}

この onMapReady() 関数は MapEvent タイプの event パラメータ (この場合は無視される) を渡し、指定されたパラメータ (位置、ズーム レベル、表示する地図のタイプを定義する) を使って setCenter() を呼び出します。

一般に MapEvent.MAP_READY イベントのインターセプト処理によって、このように地図を「初期化する」ことは有効です。イベントの詳細は、Google Maps Flash ドキュメントの Map Events セクションで説明します。

注: それ以外に MapEvent.MAP_PREINITIALIZE イベントのインターセプト処理によって地図を初期化することもできます。このイベントについて詳しくは、MapOptions の説明をご覧ください。

イベントの詳細は、Google Maps Flash ドキュメントの Map Events セクションで説明します。

SWF ファイルのコンパイル

これでソースのルート ディレクトリには HelloWorld.mxml、該当ファイルの <mx:Script> オブジェクトには ActionScript コードがそれぞれ組み込まれました。コードを SWF (Shockwave Flash) ファイルにコンパイルすることができます。これは FlexBuilder から直接実行できます。

FlexBuilder のコンパイラを実行し、Flash プレーヤーのデバッグ バージョンを起動するには、FlexBuilder のツールバーにある [Run Tools] のいずれかをクリックします。起動するバージョンは、最適化バージョン、デバッグ バージョン、プロファイリング バージョンから選択します。

 

FlexBuilder は MXML アプリケーションをコンパイルして SWF ファイルを生成し、ブラウザを自動的に立ち上げて、下図のような Flash SWF を表示します。

Web ページでの SWF ファイルのホスティング

Google Maps Flash SWF ファイルは、API キーを組み込んでコンパイルされていれば、スタンドアロン ファイルとして簡単に表示することができます。これはテストには便利ですが、適正なページ レイアウトのためには実用的ではないこともあります。そのような場合、HTML ページをセットアップして SWF ファイルを組み込もうということになるでしょう。SWF ファイルを Internet Explorer でも他のブラウザでも実行できるようにするには、必ず objectembed のどちらのタグにも SWF を追加してください。

HelloWorld.swf ファイルを組み込んだ簡単な HTML ページは以下のように表示されます。地図を Web ページに表示するには、そのための領域を用意する必要があります。そのためにこの例では、名前付きの div 要素を作成し、それに object 要素を追加します。

  <div id="map_canvas" name="map_canvas">
    <object
      classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
      codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0"
      width="800px"
      height="600px">
      <param name="movie" value="helloworld.swf">
      <param name="quality" value="high">
      <param name="flashVars" value="key=your_api_key">
      <embed
        width="800px"
        height="600px"
        src="helloworld.swf"
        quality="high"
        flashVars="key=your_api_key"
        pluginspage="http://www.macromedia.com/go/getflashplayer"
        type="application/x-shockwave-flash">
      </embed>
    </object>
  </div>

flashVars パラメータの中に API キー パラメータを追加していることに注目してください。この登録メソッドは、MXML 宣言の中でキーを SWF ファイルに直接コンパイルする方法に代わるものです。ここで値を指定すると、SWF ファイルや MXML 宣言で指定された値はオーバーライドされます。API キーは SWF ファイルがホストされているドメインと一致する必要があります。HTML ファイルがホストされているドメインではありませんのでご注意ください。

結果として、下図のような HTML ページが表示されます。

 

ソース (HelloWorld.mxml) を表示

これで初めての Google Maps Flash アプリケーションが完成しました。

Adobe AIR® アプリケーションの開発

Google Maps API for Flash は、ブラウザ内の Flash アプリケーションの開発だけでなく、デスクトップで稼動する Adobe AIR® アプリケーションの開発もサポートしています。AIR アプリケーションは、ブラウザ内で稼動するアプリケーションにはない追加機能を提供します。それにはファイル アクセスとローカル ネットワーク アクセス、アプリケーションの状態持続、データ アクセスなどがあります。

AIR とは

AIR は、共通のコード ベースから各種オペレーティング システム内部でアプリケーションをネイティブに実行可能にするランタイム環境です。AIR インストーラはこのコードを、ランタイム環境で使用可能な形式にコンパイルします。AIR アプリケーションを使用すれば、デスクトップと自由に直接やりとりできるようになり、オペレーティング システムの違いを超えたファイル アクセス、データ ストレージ、堅牢なユーザー インターフェース コンポーネントが実現します。

Adobe AIR についての詳細は、http://www.adobe.com/jp/products/air/ をご覧ください。

AIR のインストール

Adobe AIR アプリケーションを実行するには、Adobe の AIR ランタイム環境のダウンロードとインストールが必要です。インストールの対象には、Adobe の AIR インストーラが含まれます。この AIR インストーラは、Adobe AIR 実行ファイルを各種オペレーティング システムで実行可能なアプリケーションに変換するものです。Google Maps API for Flash SWC ファイル は、必ずバージョン 1.8 以上を使用してください。バージョン 1.8 から AIR サポートが追加されています。

AIR の最新リリースは http://get.adobe.com/air/?loc=jp から入手できます。この URL からファイルをダウンロードして、Adobe の指示に従ってインストールします。このチュートリアルの作成時は、Adobe AIR 1.1 インストーラを使用しました。

(注: Mac OS X の開発環境で AIR 実行時に問題が発生する場合は、このフィックス をお試しください。)

FlexBuilder による AIR プロジェクトの作成

FlexBuilder では、ブラウザ内の Flash プラグインの中で使う Flash アプリケーションと、オペレーティング システムの中で使うスタンドアロンの AIR アプリケーションのどちらかを作成することができます。

AIR アプリケーションのコーディングを始める前に、FlexBuilder で AIR に対応したプロジェクトをセットアップしてください。そのための手順は、以下のとおり簡単です。

  1. FlexBuilder で [ファイル] -> [新規] -> [Flex プロジェクト] の順に選択します。[New Flex Project] ダイアログ ボックスが表示されます。プロジェクトの名前とそのプロジェクトに関するファイルの保管場所を入力し、[Application Type] を [Desktop Application (runs in Adobe AIR)] に設定します。

     
  2. [次へ] をクリックし、出力フォルダを指定します (デフォルトの bin-debug のままでかまいません)。その後、もう一度 [次へ] をクリックします。画面がソース パスライブラリ パスの設定パネルに戻ります。メイン アプリケーション ファイル の名前を選択し、アプリケーション ID を追加します。この ID は通常、「パッケージのような形式」 (たとえば com.google.maps.examples.air) にしてください。

  3. コードをコンパイルするには、事前にコードを Google Maps API for Flash SWC ファイルにリンクする必要があります。それには [Library Path] タブをクリックした後、[Add SWC] をクリックします。[Add SWC] ダイアログ ボックスが表示されます。Google Maps API for Flash SDK を保存した場所に移動し、該当する lib/map_flex_*.swc ファイルを選択して [OK] をクリックします (注: SWC は正しいものを選択してください。FlexBuilder では Flex 以外の SWC ライブラリは使用できません)。これでダイアログ ボックスは下図のようになります。

  4. [Finish] をクリックします。FlexBuilder によってプロジェクトが更新され、画面はスケルトンの MXML ファイルを表示する Flex Development Perspective に戻ります。

  5. この時点でスケルトンの MXML ファイルのコンパイルをテストして、開発環境が正しく機能しているか確認するとよいでしょう。ファイルには 1 つの mx:WindowedComponent オブジェクト以外に何も入っていませんから、表示されるのは空白のウィンドウだけです。

AIR アプリケーションのコード変更

Google Maps API for Flash AIR アプリケーションの作成は、ブラウザ内で使用する SWF ファイルの作成とほぼ同じですが、下記の 2 点が異なります。

  1. AIR アプリケーションのルートは、mx:Application ではなく mx:WindowedApplication です。これはプロジェクトを最初に作成するときにデフォルトで作成してください。
  2. AIR アプリケーション プロパティにある Map オブジェクトには、アプリケーションの目的と範囲が記述されたオンラインの場所に設定された url プロパティが必要です。この url は、API キーのサインアップ時に登録した URL と同じでなければなりません。

AIR アプリケーションは、ファイル システムにアクセスすることにより、ブラウザ ベースのアプリケーションでは難しいタスクも実行できます。クリックされた緯度と経度の値をテキスト ファイルに書き込むことで、ユーザー クリックに応答するテスト アプリケーションにいくつかのコードを追加します。

FlexBuilder の Flex Development Perspective の中に、下記のコードをコピーします (このコードは前記の「Hello World」チュートリアルのコードとほぼ同じですが、mx:Applicationmx:WindowedApplication に変更され、Map.url プロパティが設定されています)。

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<maps:Map xmlns:maps="com.google.maps.*" id="map" mapevent_mapready="onMapReady(event)" width="100%" height="100%" 
    url="http://code.google.com/apis/maps/" key="your_api_key"/>
<mx:Script>
    <![CDATA[
   
    import com.google.maps.LatLng;
    import com.google.maps.Map;
    import com.google.maps.MapEvent;
    import com.google.maps.MapType;

    private function onMapReady(event:Event):void {
      this.map.setCenter(new LatLng(40.736072,-73.992062), 14, MapType.NORMAL_MAP_TYPE);
    }
    ]]>
</mx:Script>
</mx:WindowedApplication>

次は、作成されたこのスケルトン ファイルに、イベント クリックの処理機能と現在位置をテキスト ファイルに書き込む機能を追加します。

  1. 以下の import ステートメントを追加して、MapMouseEvent 機能を追加します。

        import com.google.maps.MapMouseEvent;
    
  2. 既存の onMapReady イベント ハンドラの中に以下のコードを追加します。このコードはマウス クリック用の「イベント リスナ」を登録し、onMapClick イベント ハンドラを作成するものです。

        private function onMapReady(event:Event):void {
          this.map.setCenter(new LatLng(40.736072,-73.992062), 14, MapType.NORMAL_MAP_TYPE);
          this.map.addEventListener(MapMouseEvent.CLICK, onMapClick);
        }
        
        private function onMapClick(event:MapMouseEvent):void {
        
        }
        
    
  3. onMapClick 関数の中に以下のコードを追加します。このコードは現在のマウス位置を緯度と経度として処理し、その出力を "locations.txt" というファイルに書き込むものです。AIR アプリケーションはオペレーティング システム ニュートラルですから、resolvePath メソッドによってこのファイルへの参照を取得する必要があります。

       private function onMapClick(event:MapMouseEvent):void {
         var file:File = File.documentsDirectory.resolvePath("airTest/locations.txt");
         var fileStream:FileStream = new FileStream();
         fileStream.open(file, FileMode.APPEND);
         fileStream.writeUTF(event.latLng.toString());
         fileStream.writeUTF("\n");
         fileStream.close();
      
        }
    
  4. ここでアプリケーションをテストするには、FlexBuilder メニュー バーの [Run] ボタンをクリックします。

     

    FlexBuilder がアプリケーションをコンパイルし、画面はマンハッタンの表示画面に戻ります。

    地図上の任意の点をクリックします。アプリケーションが "locations.txt" ファイルを Documents ディレクトリ (Mac OS では /Users/username/Documents/、Windows では C:My Documents\) 内の "airTest" ディレクトリに書き込みます。そのテキスト ファイルを開くと、クリックした位置の緯度と経度が表示されます。

AIR アプリケーションのエクスポート

AIR アプリケーションはオペレーティング システム内部でネイティブに稼動し、ファイル システムのような注意を要する情報に頻繁にアクセスします。このような理由から、デスクトップで稼動するアプリケーションの信用性は重要です。どの AIR アプリケーションも、認証機関からデジタル署名を受ける必要があります。FlexBuilder では、リリース ビルドを生成するとき、この証明書を指定することができます。

FlexBuilder では、テストや内部アプリケーションのためにアプリケーションに「自己署名」することもできますが、アプリケーションを他のユーザーに提供する場合は、認証機関から Thawte や VeriSign のような商用認証を取得してください。

Adobe AIR アプリケーションのデジタル署名についての詳細は、次の URL をご覧ください。http://www.adobe.com/jp/devnet/air/articles/signing_air_applications_print.html

次は、AIR インストール ファイル (*.air という接尾辞が目印) をエクスポートします。それにはテスト証明書を作成し、FlexBuilder から 「リリース ビルド」を生成する必要があります。

  • FlexBuilder で [Project] -> [Export Release Build] を選択します。[Export Release Build] ダイアログ ボックスが表示されます。

  • 該当するプロジェクトとアプリケーションを選択し、それが正しいことを確認したら、[Next] をクリックします。[Digital Signature] パネルが表示されます。Export and sign an AIR file with a digital certificate (デジタル証明書付きの AIR ファイルのエクスポートと署名) が選択されていることを確認します。商用証明書があれば、それをブラウズして選択し、そのパスワードを入力して [Finish] をクリックします。現時点で証明書がなければ、[Create] を選択します。そうすると、[Create Self-Signed Digital Certificate] ダイアログ ボックスが表示されます。

  • [Create Self-Signed Digital Certificate] ダイアログ ボックスで、証明書の発行者名、パスワード、ファイル名を入力します。[OK] をクリックすると、この証明書の情報が [Export Release Build] ダイアログ ボックスに入力されます。[Finish] をクリックします。FlexBuilder がアプリケーションをコンパイルし、*.air ファイルを生成します。このファイルは、AIR アプリケーション インストーラによって、アプリケーションとしてインストールすることができます。

  • AIR アプリケーションのインストールと実行

    AIR インストール ファイルが出力ディレクトリに用意できました。AIR アプリケーションをインストールするには、以下の手順に従います。

    1. MapSimple.air ファイルをダブルクリックします。[Application Install] ダイアログ ボックスが表示されます。

    2. このアプリケーションは自己署名されたものなので、アプリケーションの発行者が UNKNOWN (不明) であること、アプリケーションが UNRESTRICTED (無制限の) システム アクセス権限を持つことを、AIR インストーラから警告されます。このファイルは自作したもので心配は要りませんから、[Install] をクリックします。[Installation] ダイアログ ボックスから、インストール先を指定するように促されます。

    3. [Installation Location] を選択します。[Start application after installation] チェックボックスをオンにしたままにすると、MapSimple アプリケーションが実行されます。

    これで初めての Google Maps AIR アプリケーションが完成しました。