「Hello World」アプリケーションのコードを記述するには、エディターで開かれているアプリケーションの MXML ファイル（AIRHelloWorld.mxml）を編集します（ファイルが開かれていない場合は、プロジェクトナビゲーターを使用してファイルを開きます）。
デスクトップの Flex AIR アプリケーションは、MXML の WindowedApplication タグ内に含まれています。MXML の WindowedApplication タグでは、タイトルバーや閉じるボタンなどの基本的なウィンドウコントロールを含む単純なウィンドウが作成されます。
-
WindowedApplication コンポーネントに
title
属性を追加し、値
"Hello World"
を割り当てます。
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
title="Hello World">
</s:WindowedApplication>
-
アプリケーションに Label コンポーネントを追加（WindowedApplication タグ内に記述）します。追加した Label コンポーネントの
text
プロパティを
"Hello AIR"
に設定し、中央に配置されるようにレイアウト制約を設定します。次の例を参照してください。
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
title="Hello World">
<s:Label text="Hello AIR" horizontalCenter="0" verticalCenter="0"/>
</s:WindowedApplication>
-
WindowedApplication の開始タグと、前の手順で入力したラベルコンポーネントタグとの間に、次のスタイルブロックを追加します。
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
s|WindowedApplication
{
skinClass:ClassReference("spark.skins.spark.SparkChromeWindowedApplicationSkin");
background-color:#999999;
background-alpha:"0.7";
}
</fx:Style>
これらのスタイル設定はアプリケーション全体に適用され、ウィンドウの背景がやや透明な灰色にレンダリングされます。
アプリケーションのコードは次のとおりです。
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
title="Hello World">
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
s|WindowedApplication
{
skinClass:ClassReference("spark.skins.spark.SparkChromeWindowedApplicationSkin");
background-color:#999999;
background-alpha:"0.7";
}
</fx:Style>
<s:Label text="Hello AIR" horizontalCenter="0" verticalCenter="0"/>
</s:WindowedApplication>
次に、アプリケーションを透明にするために、アプリケーション記述子で以下のように設定を変更します。
-
Flex ナビゲーターペインで、プロジェクトのソースディレクトリにあるアプリケーション記述ファイルを参照します。例えばプロジェクト名を「AIRHelloWorld」と指定した場合、このファイル名は「AIRHelloWorld-app.xml」になります。
-
アプリケーション記述ファイルをダブルクリックして、Flash Builder で編集します。
-
XML コードで、
initialWindow
プロパティの
systemChrome
プロパティおよび
transparent
プロパティのコメント化した行を参照します。コメントを削除します（コメント区切り文字
"<!--"
および
"-->"
を削除します）。
-
次に示すように、
systemChrome
プロパティのテキスト値を
none
に設定します。
<systemChrome>none</systemChrome>
-
次に示すように、
transparent
プロパティのテキスト値を
true
に設定します。
<transparent>true</transparent>
-
ファイルを保存します。
をクリックします。
