これを、実行してみると、赤色の背景に「test」という文字が表示されます。プロジェクトの作成時のウィンドウの設定で、「Custom Chrome (transparent)」を選択しましたので、背景が透明になっています。

プログラムを終了するには、タスクバーを右クリックしてコンテキストメニューで[閉じる]を選択します(Mac OS Xなら、いつも通り終了できるでしょう。)。

「test」という文字が表示

ここで注目したいのは、Adobe AIRでデスクトップアプリケーションを作る場合、特別な書式のHTMLを記述する必要がないということです。先ほど書いたひな形を、Webブラウザにドラッグすれば、ブラウザでも同じように見ることができるでしょう。また、背景を透明に設定しただけで、文字や絵のあるところを残してウィンドウの形が不定形に変形されるということも分かるでしょう。

・手順(5) 移動と終了ができるようにしよう

背景が透明になっているばかりに、ウィンドウの移動とアプリケーションの終了ができなくなっています。そこで、ウィンドウの移動とアプリケーションの終了だけできるようにJavaScriptを記述してみます。

上のひな形の<body>タグの中身を下記のように書き換えます。

<body>
<!-- ここに HTML を記述する -->
<div style="background-color:red">
        <input id="close_btn" type="button" value="close"/>
        <script type="text/javascript">
                // 移動処理
                $(document).mousedown(function() {
                        window.nativeWindow.startMove();
                });
                // 終了処理
                $("#close_btn").click(function(){
                        if (confirm("終了しても良いですか?")) {
                                window.close();
                        }
                });
        </script>
</div>
</body>

これを実行すると、[close]ボタンで終了ができるようになり、ドラッグ&ドロップでウィンドウを移動できるようになります。

[close]ボタンで終了ができるようになる