2013年2月5日火曜日

Feathers ScreenExample Screenについて

このサンプルはFeathersのサイト
「How to use the Feathers Screen Component(リンク先へ) 」
「How to use the Feathers ScreenNavigator component(リンク先へ) 」
「Feathers ScreenNavigator Transitions(リンク先へ) 」
を参考にしています。

Feathers ScreenExampleのソースコード(リンク先へ)

Main.as
this._navigator.addScreen(MAIN_MENU,new ScreenNavigatorItem(MainMenuScreen,MAIN_MENU_EVENTS));
addScreenメソッド
ScreenNavigatorItemコンストラクタで必要とされる最初の引数は、 画面のIDと画面のインスタンスまたはすでにインスタンス化されているのDisplayObjectです。

イベントを利用した画面のナビゲーション
ScreenNavigatorItemクラスの第2引数(Object型)でイベントを定義します。
 イベントを送出すると、ScreenNavigatorは自動的に別の画面に移動する処理を
行います。

MainMenuScreen.as
   this._list.dataProvider = new ListCollection(
    [
    { text: "Sub 1", event: SHOW_SUB1_SCREEN },
    { text: "Sub 2", event: SHOW_SUB2_SCREEN },
    ]);
Main.asで定義したイベントをリストのdataProviderに設定します。
  private function list_changeHandler(event:Event):void
  {
   const eventType:String = this._list.selectedItem.event as String;
   this.dispatchEventWith(eventType);
  }
リストのアイテムが選択された時に画面に移動する為のイベントを送出します。

ownerプロパティによる画面のナビゲーション
Sub1Screen.as
  private function onBackButton():void
  {
   this.owner.showScreen(Main.MAIN_MENU);
  }
Screenクラスが持つownerプロパティのshowScreenメソッドで別画面の移動を行います。

トランジションの設定
Main.as
   this._transitionManager = new ScreenSlidingStackTransitionManager(this._navigator);
   this._transitionManager.duration = 0.4;
画面の移動を行う時のトランジションとしてScreenSlidingStackTransitionManagerを使用します。

0 件のコメント:

コメントを投稿