Pathのサイドビュー切替をFlashBuilderで再現してみた

TwitterとInstagramに満足してるので今はほとんど使ってないけど、UIの作り込みがとても評判のPathで採用されているスワイプでメインビューと両サイドビューを切り替えるUIをFlashで再現してみた。このUIって名前とかあるのかね？

SplitViewNavigatorを背面に配置して前面にもう一個ビューを配置、このメインビューにタッチスライド機能を組み込んでなんとかそれっぽく動くように制御できた。この調子で独自UIとか考えてみたいなー。

左手のiPhoneで撮影しつつ、右手でINFOBARを操作してるので、タッチがぎこちないのはご愛嬌。

2012.02.22 by _simo
Categories: air, as3 | Tags: FlashBuilder | Leave a comment

FlashBuilderでコンパイル時のフレームレートを変更するには

FlashBuilderモバイルプロジェクトのプロパティから「Flexコンパイラー」を選択して、「追加コンパイラー引数」のところに下記を追加。

-default-frame-rate 30

これで30fpsのswfがパブリッシュされる。デフォルトでは24fpsみたい。

2012.01.28 by _simo
Categories: air, as3 | Tags: FlashBuilder | Leave a comment

TabbedViewNavigatorにViewNavigatorを動的に追加削除するには

TabbedViewNavigatorApplicationを使ってタブ付きアプリを作る場合にタブ数が固定の場合は良いのだけど、動的に増減させる方法。add系やremove系のメソッドでViewNavigatorを追加・削除するだけでは反映されないのね。解決方法はvalidateNowメソッドをコールすること。これしないと再更新されないみたい。

アプリ起動時の認証とかネットワーク状況次第でアプリを通常起動させたくない時に、一度タブを全て削除してエラー画面のビューのみを表示させたい時に使えますよと。

tabbedNavigator.removeAll();
tabbedNavigator.validateNow(); //これ重要！

var errorNavi:ViewNavigator = new ViewNavigator();
errorNavi.firstView = views.ErrorView;
errorNavi.label = "エラー画面";
errorNavi.percentWidth = 100;
errorNavi.percentHeight = 100;

tabbedNavigator.addItem(errorNavi);
tabbedNavigator.validateNow(); //これ重要！

■アドビのフォーラムにも書いてあった。英語だけど。
http://forums.adobe.com/message/3701497

2012.01.27 by _simo
Categories: air, as3 | Tags: FlashBuilder | Leave a comment

FlashBuilderでmxmlに動的にaddChildするには

表示オブジェクトをAS3で動的に作ってmxmlに直接addChildしようとするとエラーになる。どうやらmxmlに表示オブジェクトを配置するにはaddElementを使うらしい。mxmlにはコンポーネントしか配置できないので、SpriteとかのAS3で作った表示オブジェクトはUIComponentに包んでから配置してやる。上記コードで赤い角丸ベタ塗りが表示できる。ようやく標準コンポーネント以外の独自UIをアプリに持ち込めるな。超基本過ぎて泣ける。

var sp:Sprite = new Sprite();
sp.graphics.clear();
sp.graphics.beginFill(0xff0000, 1);
sp.graphics.drawRoundRect(0, 0, stage.stageWidth, stage.stageHeight - navigator.actionBar.height, 30, 30);
sp.graphics.endFill();

var ui:UIComponent = new UIComponent();
ui.addChild(sp);
addElement(ui);

2012.01.27 by _simo
Categories: air, as3 | Tags: FlashBuilder | Leave a comment

タブ移動するタイミングを検知する

import mx.events.FlexEvent;
import spark.events.IndexChangeEvent;

/**
 * 初期化
 */
protected function creationCompleteHandler(e:FlexEvent):void
{
	tabbedNavigator.addEventListener(IndexChangeEvent.CHANGING, onTabChange);
	tabbedNavigator.addEventListener(IndexChangeEvent.CHANGE, onTabChange);
}

/**
 * タブ移動
 */
protected function onTabChange(e:IndexChangeEvent):void
{
	switch(e.type)
	{
		//-----[タブ移動の直前]
		case "changing":
			trace("タブ移動前", "selectIndex=", tabbedNavigator.selectedIndex, "label=", tabbedNavigator.selectedNavigator.label);
			break;

		//-----[タブ移動の直後]
		case "change":
			trace("タブ移動後", "selectIndex=", tabbedNavigator.selectedIndex, "label=", tabbedNavigator.selectedNavigator.label);
			break;
	}
}

タブ付きアプリケーションでタブ移動の前後に処理を挟みたい時の検知方法。TabbedViewNavigatorApplicationのmxmlで初期化するタイミング（creationComplete関数とか）でtabbedNavigatorにIndexChangeEventをリスナー登録しておく。各Viewではどのタブから移動してきたかは分からないみたいね。

2012.01.19 by _simo
Categories: air, as3 | Tags: FlashBuilder | Leave a comment