でわでわ、きせかえツール作成(4)です。

今回は(2)で配布したサンプルの解説をしようと思います。


ただ、Flash作成の知識があること前提で解説しますので、分からないことがある場合は、

Design Flash Wall Gallery様

の携帯向けActionScriptを参考にして下さい。


では解説を始めます。


用意したサンプルは5フレーム構成になっています。


・フレーム1

 フォーカスの取得とボタン情報グローバル変数の設定


・フレーム2

 Flash起動時からの経過msの取得


・フレーム3

 フォーカスの取得確認とFlash起動時からの経過msの確認

 フォーカスが取得されるか、1秒経過でフレーム4に移動

 そうでなければフレーム2に戻る


・フレーム4

 メインフレーム


・フレーム5

 フォーカスナンバー取得関数(FlashLite1.1ではfunctionが使用できないので、call関数でこのフレームを呼ぶ)


という流れになります。


ちなみに画像が小栗旬なのは、サンプル作成時にボンビーメンをたまたま視たからで特にファンでもありません(笑)


閑話休題。

メインフレームであるフレーム4はボタンイベントリスナとボタンインスタンス、背景画像から構成されています。


4-1


「key」が方向キーコントローラー、「srt」がショートカットキーのリスナです。

SH903iTVのメニューアイコンには9つの機能がありますので、ボタンの数も9つ作成してあります。

グレーの□インスタンスはカーソルです。


方向キーコントローラーのActionScriptを解説します。

詳細はコメントを読んで頂くとして、ポイントだけを説明しますね。


実行されている動作は実に単純で、キーイベントを取得した際に現在のフォーカスIDの取得とカーソルの移動&scaleの変更を行っているだけです。


つまり、画面上で動作しているのはカーソルだけで、後は内部的にカーソルが移動したボタンに対するフォーカスIDを設定しなおしているだけなんです。


で、ここからがポイントなんですが、このサンプルをどう改造すれば自分の好きなようにメニューアイコンが作成できるのかってことなんですよね。


まず背景画像の差し替えですよね。小栗旬を草刈正雄にするのもあなたの自由です(笑)

次にボタンの画像を差し替えましょう。サンプルなので味気ない文字になっていますが、イカしたデザインのボタンに変身させてあげちゃってください。


ただし、ボタンの位置や大きさを変更した場合はフレーム1のActionScriptに変更を加える必要があります。

ボタンのインスタンス名と同じ名前の変数がありますので、コメントに従って変更しましょう。


違う機種用に変更した場合、機能の数に違いがある場合が多いので、ボタンの数を増減させる際にも上記の変更が必要となります。


そこで必要になるのが(3)でも使用した仕様書ですね。ここに機種ごとに必要な情報がのっています。

例えばSH903iTVのメニューアイコン部の機能とIDなどは以下のように記載されています。


4-2

4-3


また、機種ごとにピクト領域やガイダンス領域のために空けるべき大きさが違うので、それも仕様書を参照するようにして下さい。



4-4


といったところでしょうか。

ただ、このサンプルはあくまで一例です。

何といってもFlashファイルですので、改造の可能性は無限大です。

とりあえず作ってみることが上達の近道ですよ。


頑張ってみてくださいね~