Apollo ウインドウをもっと自由にデザインする方法

Apollo が提供するクロームを使用したくない場合は Apollo アプリケーションのルートタグを ApolloApplication から Application に変更します。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
 
</mx:Application>
 

すると以下のような表示に変わります。

タイトルバーやボタン類はなくなって、普通の Flex アプリケーションの背景になったということですね。後は自由にウインドウ操作用のコントロールを配置することができます。

背景を消す

さて、まだ四角い背景に残っていますので次はこれを消します。背景が無くなれば、代わりに好きな形のオブジェクトを背景に使えるだろうという算段です。

まず、アプリケーション記述ファイル （アプリ名-app.xml ） 内の rootContent タグに transparent という属性があります。これを "true" にします。

<rootContent systemChrome="none" transparent="true" visible="true">[SWF reference is generated]</rootContent>
 

これだけだと背景は変わりません。この設定とあわせて Application のスタイルに以下を追加します。

background-color:"";
background-image:"";
 

そうすると、アプリケーションの背景が透明になります。

つまりアプリケーションを実行してみても何も表示されなくなります。何も表示されないため実行されているかどうかが一見しても分かりません。試す場合はタスクバー等から確認してみてください。

以上で、四角い枠のないアプリケーションを作れるようになりました。Application タグ内に適当なオブジェクトを配置するとそれだけが表示されます。下は読み込んだイメージのみが表示されるサンプルです。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
  <mx:Style>
    Application
    {
      background-color:"";
      background-image:"";
    }
  </mx:Style>
  <mx:Image source="myImage.png"/>
</mx:Application>