KDrawSprite: AIR for iOSでcacheAsBitmap不要の高速GPU描画 Kawanet Tech Blog/ウェブリブログ

KDrawSprite: AIR for iOSでcacheAsBitmap不要の高速GPU描画

<< 作成日時： 2011/02/14 22:58 >>

Packager for iPhone 改め次期 AIR for iOS 向けアプリや、AIR for Android 向けアプリの開発時に、デバイスの GPU 性能を引き出す ActionScript ライブラリ KDrawSprite をリリースしました。

先日アップデートした iPhone アプリ Korean Alphabet 1.2.2 でも利用しています。KDrawSprite を使うと、第一世代 iPod Touch のような古い端末でも、30FPS 以上が出せます。

iPad なら 100FPS も出て、ネイティブアプリ同様のスムーズな動作になります。
MIT ライセンスで無料で使えますので、お試しください。

ソースコード：
https://github.com/kawanet/as3kawalib/raw/master/src/net/kawa/display/KDrawSprite.as
ドキュメント：
http://www.kawa.net/works/as/as3kawalib/docs/net/kawa/display/KDrawSprite.html

開発した背景

Packager for iPhone (PFI) の最新版は、Flash Professional CS5 Update for iOS です。
Flash CS5 を使って、AIR 2.0 ベースの iPhone アプリを作成できます。
AIR for Android の最新版は、Flash Professional CS5 Extension for AIR 2.5 です。

AIR for Android・iOS どちらも、cacheAsBitmap と cacheAsBitmapMatrix を
適切に設定することが重要になりますが、ここではあえて、違う方法を提案します。

というのも、cacheAsBitmapMatrix は、ベクターデータのレンダリングと GPU への
転送を Flash に任せるため、GPU メモリがムダに使われてしまうことがあるようです。
iOS では、メモリ不足になると突然のアプリ終了が発生してしまい、対策が難しいです。
特に画面が大きい割にメモリ容量が制限される iPad アプリが要注意です。

そこで KDrawSprite.as では、ベクターデータを自前でレンダリングし Bitmap のみで描画します。
メモリ解放 dispose も自前でコントロールすることで、省メモリを実現できます。
cacheAsBitmapMatrix で、メモリ不足の異常終了の対策を頑張るよりは、早そう。
（そのために作りました）

使い方

一番簡単な使い方は、以下のように cacheAsBitmapMatrix・cacheAsBitmap を利用していた部分を
KDrawSprite.getSprite() で置き換えるだけです。

var sprite:Sprite = new Sprite();
sprite.graphics.beginFill(0x336699);
sprite.graphics.drawCircle(50, 50, 50);

// sprite.cacheAsBitmapMatrix = new Matrix(); // BEFORE
// sprite.cacheAsBitmap = true;

sprite = KDrawSprite.getSprite(sprite); // AFTER

addChild(sprite);
sprite.x = 100;
sprite.y = 100;
sprite.scaleX = 0.5;
sprite.height = 50;
sprite.rotation = 1;

getSprite した後の sprite の実体は、Bitmap です。
移動・拡大縮小・回転しても、GPU が有効に働きます。
デフォルトで、REMOVED_FROM_STAGE イベントにより自動的に dispose します。
煩わしいメモリ管理もなくて、すぐにメモリが解放されるので安心です。

注意点は、getSprite した後でベクターデータの変更をしても、
自動的には画面に反映されないことです。
ベクターデータを変更する度に、KDrawSprite.getSprite を呼ぶか、
またはドキュメントを参照して、draw() メソッドを利用してください。

アンチエイリアスにも対応

iOS・Android 端末の Flash Player Runtime では、PC 版と比べてレンダリングの
アンチエイリアスが弱く設定されています。はっきり言って、デフォルトでは汚いです。
KDrawSprite では、レンダリング時のジャギーを回避するため、
2x SSAA のアンチエイリアスを効かせてレンダリングすることができます。

getSprite() 関数や、draw() メソッドの第2引数に、「2」を指定すると 2x SSAA になります。
デフォルトは「1」で、NoAA（アンチエイリアスなし、デフォルト描画）

注意点

iOS・Android では、stage.quality の値が性能に影響します。
必ず StageQuality.LOW としてください。
LOW にして 2x SSAA でアンチエイリアスを効かせた方が、
性能だけでなく、レンダリングのクオリティも高いようです。

stage.quality = StageQuality.LOW; // must

アンチエイリアスにも対応

「こんな低級な操作をやりたくて ActionScript を使ってるんじゃない！」と思われる方、
ごもっともです。本来なら、Flash がよしなにやってくれるのがベストだと思います。
でも、『今は』普通に書いてると動かないので、アプリ側で対応できるものなら対応しないと。
メモリが足りなくなると落ちるようなアプリでは、リリースできないですからね。

* English version of this post is here.