「Flex Hero のモバイルアプリ開発の基本」では、ホントの基本のみのご紹介でした。
今回は、実際に使ってみてハマった点をいくつかご紹介したいと思います。
*なお、この記事は公開されているFlash Builder Buritto Preview版 を対象としています。
画面回転時のレイアウト
app.xml で autoOrients を true にすると画面回転が有効になるので、回転時のレイアウトを考慮して設計しましょう。
StageOrientationEvent.ORIENTATION_CHANGE で画面回転のイベントを拾い、layoutを変えてみたりして、
画面領域を有効に使用して、見せたいコンテンツが見えやすいように、かつ操作しやすいように配置する必要があります。
上図の例で言うと、layoutをVerticalから変更せずに横回転すると、Chartが横に間延びします。
さらに、下部のListはタッチ操作でスクロールしますが、これも縦が狭まって操作し辛くなっています。
そこで、回転時にlayoutをHorizontalに変更することで、どちらのコンポーネントも見やすく、操作しやすくなります。
Graphics.lineTo()はなるべく使わない
例えば、フリーハンドで線を引く際にGraphics.lineTo()を使う場合と、
BitmapData.copyPixels()を使う場合をFPSを計って比較すると、
BitmapData.copyPixels()のパフォーマンスが良いようです。
上図はフリーハンドで10秒間、線を引き続けるテストの結果です（正確な比較ではありませんが）
”min”の値が、10秒間で一番低かったＦＰＳの値です。
Graphics.lineTo()では、線の引き続けるとFPSがどんどん落ちていく一方で、
BitmapData.copyPixels()では、Graphics.lineTo()ほど遅くはなりませんでした。
＊Graphics.drawPath()でも試してみましたが、今回はlineTo()とほぼ同じでしたが、
複雑なパスを書く場合は、Graphics.drawPath()の方が実行コードの行数が少なくなるので、
処理が高速化できるとのこと（下記参考より）
＊デスクトップ上でデバックして比較すると、ほとんど差異がありませんでした。
＊２０１１・３・２追記：このテストはrenderModeをcpuのままにしています。
その他、モバイルアプリでパフォーマンスを出すには、下記参考リンクは必読
・参考
「Flash Platform のパフォーマンスの最適化」
GPUモードで制限される機能
- ブレンドモード：レイヤー、アルファ、消去、オーバーレイ、ハードライト、比較（明）、比較（暗）はサポートされません
- フィルターはサポートされません
- PixelBender はサポートされません
- その他にも制限事項があるので、下記参考リンクは必読
・参考
「モバイル AIR アプリケーションでの GPU レンダリング」
「モバイルデバイスでサポートされていない ActionScript 3.0 API」
MXチャートコンポーネントの使用
基本の話でも書きましたが、チャートコンポーネントをそのままモバイルに乗っけることが出来ます。
ここでは手順をもうちょっと詳しく説明を。
１：swcの追加
「Flexモバイルプロジェクト」では、デフォルトではmx.swcが入ってないので、
プロジェクトプロパティ＞Flexビルドパスで、
sdks\4.5.0\frameworks\libs\にある、以下の３つのｓｗｃを追加します。
- mx.swc
- datavisualization.swc
- sparkskins.swc
＊上２つだけで良い、という情報もありますが、私の環境では３つ追加しないとビルドできませんでした。
２：ネームスペースを追加
＜s:View …
xmlns:charts=”mx.charts.*”
xmlns:series=”mx.charts.series.*”
xmlns:chartClasses=”mx.charts.chartClasses.*” /＞
あとはチャートを設置するだけ。
実機でも動作（アニメーションも）を確認しました。
サンプル画面
・参考
「Using mx.charts in a Flex Hero mobile project」
小ネタ
１：アプリなしでＡｎｄｒｏｉｄでスクリーンショットを撮るには
iPhoneの場合、ホームボタン＋スリープボタンで簡単に端末のスクリーンショットが撮れますが、
Ａｎｄｒｏｉｄの場合はどうするのかというと、ＡｎｄｒｏｉｄＳＤＫ内にあるandroid-sdk-windows\tools\ddms.batを起動し、
Device > Screen Captuerで撮影できます。
２：カメラロールへの保存
アプリからカメラロールへのアクセスするとき、USBケーブルがつながったままだと、
アクセスできません。カメラロールへのアクセスを確認するときはUSBケーブルを外しましょう。
以上、Preview版を触ってみて気をつけたことを書いてきましたが、
リリース版ではいろいろ改善されることを期待してます。