2013年1月26日土曜日

Feathers 1.0の4つのテーマを確認できるサンプル

Starling用のUIコンポーネントライブラリ「Feathers 1.0」もStarling 1.3とほぼ同時にリリースされました。

さて、wonderflでFeathers 1.0と4つのテーマも使えるようになったので、公式のサンプルComponentsExplorerをwonderflに移植して、テーマをそれぞれ適用したものを作ってみました。

元のサンプルではiPhoneのRetinaディスプレイモデルのdpi(326)に合わせた解像度設定になってましたが、wonderflのstageサイズ(465 x 465)ではちょっと狭いので、Feathersのdpi(feathers.system.DeviceCapabilities::dpi)の設定を163にしてます(実アプリではデバイスの値が自動的にセットされるので基本的には設定不要)。

Feathersのソースを眺めてるとFlashやFlexのUIコンポーネントで培われたものがステキに活かされるように感じて、なんかスキです。

MetalWorksMobileTheme

Feathers 1.0 ComponentsExplorer - MetalWorksMobileTheme - wonderfl build flash online


AzureMobileTheme

Feathers 1.0 ComponentsExplorer - AzureMobileTheme - wonderfl build flash online


MinimalMobileTheme

Feathers 1.0 ComponentsExplorer - MinimalMobileTheme - wonderfl build flash online


AeonDesktopTheme

Feathers 1.0 ComponentsExplorer - AeonDesktopTheme - wonderfl build flash online

Starling 1.3 on wonderfl

Starling 1.3が2013年1月14日にリリースされました。新機能については野中さんが日本語で紹介してくれてます

さて、Starling 1.3がwonderflでも使えるようになったので、以前Starling 1.2の頃に投稿したものをちょっと修正してStarling 1.3の新機能Filterを使ってみた。

このサンプルはもともとStarlingの公式デモアプリのRender Textureシーンをほぼコピーして作ったものなんですが、移植にあたってちょっと工夫したところはStarlingフレームワークに含まれるBitmap Font「mini」から"*"のTexture(1文字の画像)を取り出してブラシ(brush)に使うTextureとして代用したってところ。

あと、wonderflのプレビュー用キャプチャ機能でStarling(Stage3D)の描画が映らなかったので、タイミングを見計らってStarlingの描画をビットマップ化して表示リスト(ネイティブ)のstageに追加することで、キャプチャ機能に対応しました。

Starling RenderTextureScene with Filter - wonderfl build flash online