iモードブラウザ2.0でのFlashの4方向ナビゲーション

iモードブラウザ2.0が搭載された機種ではFlashのキーイベントに
左右キーが使えます。
って、確かに使えるんだけど設定が必要なのよ。
docomoの資料にはコンテンツタイプに4waynavigationを設定しろと
書いてある。
コンテンツタイプって何さ？

ということで、設定の仕方を解説。CS4対象です。

１、メニューの「ファイル→ファイル情報」を選択
２、モバイルSWFタブを選択して「コンテンツタイプ」に「4waynavigation」を入力
　　プルダウンのリストにはないので手入力すること
３、OKを押して設定画面を閉じる
４、メニューの「ファイル→パブリッシュ設定」を選択して
　　Flashタブの「XMPメタデータを含める」にチェックを入れる

これでOK。
docomoサイトのナビゲーションモードの説明に
「Flash Lite 3.1搭載機種の場合」って書いてあったけど
パブリッシュ自体はLite 1.1でも大丈夫だった。
1.1でパブリッシュしておけば、古い機種は数字キーで
新しい機種では十字キーで操作できそうな気がする。

ちなみに、4waynavigationだと折り返しフォーカスしてくれない。
Adobeサイトには、ナビゲーションモードは「2方向」「4方向」
「4方向折り返し付」の3種類だって書いてあるから
4方向折り返し付モードのコンテンツタイプもあるってこと？
何を指定すればいいのか、どこにも書いてないけどー。

Flashで曲線を描く。

こんな方法があるのか！と、びっくりしたのでメモ。

１、線を描く。直線ツールとかで良い
２、書いた線をダブルクリックする
３、線を選択しない状態で線の中央あたりをドラッグしてみると・・・
４、さらに線の一部を選択して解除するとアンカーポイントが追加される
５、どんな曲線も自由自在！

線ができるんだから、と思って確認してみたら
矩形ツールで書いたオブジェクトは全部編集できるし
矩形プリミティブで書いたオブジェクトもダブルクリックで
描画オブジェクトに変換すれば、自由自在だった。
一生懸命ハンドル操作してた私の努力はなんだったんだ・・・・！

addListenerのメモリリーク。

Flash Lite 3.0。

フレーム移動とaddListenerを使うときは、ちょっと注意が必要。
リファレンスを読むと、
「リスナーが登録済みである場合、変化は起きません。」
と書いてあるが、フレームに直接

var keyListener:Object = new Object();
Key.addListener(keyListener);

などと書いてしまうと、このフレームに移動してくるたびに
newが実行されて新しいオブジェクトが生成されてしまう。
新しいオブジェクトは当然、「登録済み」とは判定されないので
毎回律儀にaddしてくれる。
フレーム移動のたびに、動作が重くなっていき・・・やがてフリーズ。笑
いや、笑い事じゃない。
という事態を避けるためには

if(!keyListener) {
	var keyListener:Object = new Object();
}

とすればいいだけ。
案外、見落としがちなミスですね。

タッチパネル携帯のフォーカスを制御する。

# mouseListenerについて追記。

今日はいきなりFlashの話。ただし、Flash Lite 3.0。

タッチパネル携帯でHTMLのリンクやボタンをクリックすると
1回目のクリック→フォーカスが当たる
2回目のクリック→ボタンやリンクを「押した」動作
となる。
ところが、Flashのリンクやボタンは1回のタッチでボタンが押されてしまう。
正確には、1回のタッチでonSetFocusとonPressが流れてしまう。
FlashとHTMLが入り混じったサイトの場合、操作感が統一されていなくて
非常に気持ち悪い。
ので、Flashの動作をHTMLに合わせてみることにした。

まずメインレイヤーに以下を記述。

// Selection リスナーオブジェクトを作成
var touchFlg = false;
var preFocus;
if(!focusListener) {
	var focusListener:Object = new Object ();
}

// onSetFocus メソッドを定義
focusListener.onSetFocus = function (oldFocus, newFocus) {
	
	// タッチパネル対応
	if(Key.getCode() == 0) {
		if(preFocus == newFocus && preFocus != null) {
			touchFlg = false;
			touchFocus = null;
		} else if(oldFocus != newFocus) {
			touchFlg = true;
			touchFocus = newFocus;
		} else {
			touchFlg = false;
			touchFocus = null;
		}
	} else {
		touchFlg = false;
		touchFocus = null;
	}
	
	// フォーカスアイテムを記録
	preFocus = newFocus;
};
Selection.addListener (focusListener);

//キーイベント
if(!keyListener) {
	var keyListener:Object = new Object();
}
keyListener.onKeyDown = function() {
	if( (Key.getCode() == Key.ENTER || Key.getCode() == 0 )
			&& touchFocus != null ) {
		touchFocus.onPress();
		touchFocus = null;
	}
}
Key.addListener(keyListener);

//マウスイベント
if(!mouseListener) {
	var mouseListener:Object = new Object();
}
mouseListener.onMouseDown = function() {
	
	// どこにもフォーカスが当たっていなかったらpreFocus、touchFocusをクリアする
	if(Selection.getFocus() == null) {
		preFocus = null;
		touchFocus = null;
		touchFlg = false;
	}
}
Mouse.addListener(mouseListener);

で、各ボタンに

this.myButton.onPress = function() {
	if (Key.getCode() == Key.ENTER) {
		// 処理
	} else if (Key.getCode() == 0) {
		if (_root.touchFlg) {
			_root.touchFlg = false;
		} else {
			// 処理
		}
	}
};

やっていることは単純で、1回目のタッチでtouchFlgを変更しておいて
onPressの動作を止める。
2回目のタッチはそのまま流す、というだけ。
あと十字キーとタッチパネルを両用されたときのためにkeyListenerの登録と
preFocusとnewFocusの比較処理を入れてある。

この処理、とてもとても苦労した。
タッチパネル携帯でのFlashの挙動の仕様が見つからないわ、
タッチパネルなので実機じゃないと確認できないわ、
LAN内のサーバじゃ実機での動作確認ができないわ。
お外の世界に繋がるサーバを操作する権限がない雇われエンジニアは
ちょっと修正するたびに「さ、さーばをさいきどうしてください・・・」と
申請に行かなきゃいけなかったのだ。
あぁ、胃に悪い・・・
かなり無理矢理動かしてる感があるので、実際はもっとスマートな方法が
あるのかもしれない。
知ってる人がいたら教えて欲しい。