モバイルプロジェクトの各テンプレートの詳細は下記の3つがあります。
【1】空白
「空白」は、モバイル機能を使わないアプリを作る際に使用するテンプレートです。従来のFlexベースのAIRアプリを開発するような感覚で開発できます。「空白」では、特別に設定する項目はありません。
ウィザードを完了させると、下記のようなメインアプリのMXMLが生成されます。
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"> </s:Application>
【2】ビューベースアプリケーション
「ビューベースアプリケーション」は、モバイル機能を使ったアプリを作る際に使用するテンプレートです。Flex 4.5のモバイル機能の1つである画面遷移フレームワークを利用できます。
画面遷移フレームワークは、「ビュー」と呼ばれる画面と、画面遷移を管理する機能を持つ「ビューナビゲーター」で構成されます。ビューベースアプリケーションの設定では、最初に表示されるビューのタイトルを[基本ビュータイトル]に入力します。
ウィザードを完了させると、下記のようなメインアプリのMXMLと最初のビューが生成されます。
<?xml version="1.0" encoding="utf-8"?> <s:ViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" firstView="views.HomeView"> </s:ViewNavigatorApplication>
【3】タブ付きアプリケーション
「タブ付きアプリケーション」は、前述のビューナビゲーターをタブで複数管理できる「タブナビゲーター」を持ったテンプレートです。タブナビゲーターは、ビューナビゲーターの数だけタブを表示します。このタブを操作して切り替えることによって、ビューナビゲーターの表示/非表示を切り替えられます。
タブ付きアプリケーションの設定では、タブを作成できます。
ウィザードを完了させると下記のようなメインアプリのMXMLと各タブナビゲーターの最初のビューが生成されます。
<?xml version="1.0" encoding="utf-8"?> <s:TabbedViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"> <s:ViewNavigator label="Tab1" width="100%" height="100%" firstView="views.Tab1View"/> <s:ViewNavigator label="Tab2" width="100%" height="100%" firstView="views.Tab2View"/> <s:ViewNavigator label="Tab3" width="100%" height="100%" firstView="views.Tab3View"/> </s:TabbedViewNavigatorApplication>
次に、[権限]タブを選択します。ここでは、プラットフォームごとの権限設定ができます。
今回は、プラットフォームが[Google Android]の場合で説明します。ここではAndroidアプリに対してセキュリティまたはプライバシー関連機能を使用するための権限を付与できます。
また、このウィザードでは、Android固有の設定はできませんが、以下の記事を参考にすると、カスタムURIスキームの設定やアプリのインストール場所などを変更できます。
次に、下段にある[アプリケーションの設定]でアプリの動作について設定できます。
自動的に方向を変更
モバイルデバイスの縦横方向の向きに対して、アプリの傾きを自動的に変更します。設定するとアプリケーション記述子に設定されます。
<initialWindow> <autoOrients>true</autoOrients> </initialWindow>
フルスクリーン対応
アプリをフルスクリーンにします。設定するとアプリケーション記述子に設定されます。
<initialWindow> <fullScreen>true</fullScreen> </initialWindow>
画面密度に合わせてアプリのサイズを自動変更
モバイルデバイスの画面密度(DPI、dot per inch)を指定して、コンポーネントを自動的にサイズ変更できます。選択できるDPIは[160][240][320]の3種類です。設定すると、
<?xml version="1.0" encoding="utf-8"?> <s:ViewNavigatorApplication …… applicationDPI="240"> </s:ViewNavigatorApplication>
Flexモバイルプロジェクトを作成する際にアプリケーションテンプレートを「ビューベースアプリケーション」「タブ付アプリケーション」にした場合は、画面遷移フレームワークを使用して容易に画面遷移が実装できます。
まずは、画面を作ってみましょう。画面を追加したいFlexモバイルプロジェクトを選択して、[ファイル]→[新規]→[MXMLコンポーネント]を選びます。そうすると[新規MXMLコンポーネント]ウィザードが開始されます。
[新規MXMLコンポーネント]ウィザードでは、パッケージと名前を適宜入力して、レイアウトを選択します。そして、ベースがspark.components.View(以後、Viewコンポーネント)を選んでいることを確認します。画面を作るためには、Viewコンポーネントを必ずベースに指定します。
次ページでは引き続き、Flexモバイルプロジェクトをウィザードで作成していきます。さまざまなコンポーネントを配置してみます。さらに、画面を遷移させ、画面間でデータのやりとりをさせた後、Flexの機能を使ったさまざまな画面デザイン方法についても触れます。
Copyright © ITmedia, Inc. All Rights Reserved.
Smart & Social 險倅コ九Λ繝ウ繧ュ繝ウ繧ー