Home > Archives > 2008-11

2008-11

TransitionGeneratorをリリースしました!


Progressionの公式サイトが本日、リニューアルされましたよ~!

その中の機能拡張のページに、TransitionGeneratorを紹介して頂きました!

以前に当ブログでご紹介させて頂いていたもの(バージョン1.2.2)から、変更をいくつか加えてあります。

変更したのは、以下の点。

  1. ボタンが英語表記だったのを、日本語表記に変更
  2. それに伴い、パネルの大きさも変更
  3. fl.transitionクラスのimport文を、ソースと一緒にクリップボードにコピー出来るように変更

使い方、ダウンロードは、wikiの方に書いてありますので、ご覧いただければと思います。

現時点での最新バージョンは、1.3.2となっております。

TransitionGenerator_1.3.2

RootButtonをクラスベースで使ってみる


Progressionのコンポーネントベースで作成してみて便利だなぁ…と感じたのは、RootButtonコンポーネントでした。

会社やサイトのロゴなどにRootButtonコンポーネントを設定しておけば、クリックすると自動的にIndexページに戻ってくれます。

このRootButtonをクラスベースで使ってみたいなぁと思って、試してみました。

まずは使うクラスを読み込んでおきます。

import jp.progression.casts.buttons.RootButton;

次は、RootButtonをextendsしてあげます。

public class LogoButton extends RootButton {

あとはコンストラクタで以下のように設定してあげます。

public function LogoButton() {

    //Progressionインスタンスのidプロパティを設定
    progressionId = "index";
			
    // ツールチップを表示します。
    toolTip.text = "トップページに移動する";
}

こんな感じで、関連付けたいProgressionインスタンスのidプロパティを設定してあげればOKです。

CastButtonを使う時みたいに、sceneId = new SceneId( “/index” );みたいに指定してしまうと、怒られます。

これでロゴをクリックすると、自動的にIndexページに戻ってくれるようになります。

SWC Include LibrariesとSWC Libraries


FlashDevelopでSWCファイルを使いたい場合、Compiler OptionsのSWC Librariesにパスを通しておくと、コードヒントとかF4(リファレンスへ移動)などが使えるようになりますよね?

Compiler Optionsには、SWC Include LibrariesとSWC Librariesの二つがあるけれども、この違いというものがイマイチ分からない…

ググってみたら、SWC Include Librariesにパスを通している人もいれば、SWC Librariesにパスを通している人もいるようだった。

僕自身使ってみたけど、二つの差があまり感じられない…

この場合には、こっちを使った方がいい! なんてことがあるのだろうか?

Command処理内でtraceしたい!


Progressionが凄い! と思った一つは、Command処理が充実しているということではないかと思います。

Commandを使い始めた当初、最初にやった僕の凡ミスはこれ

addCommand(
    trace("あいうえお")
)

いつものtraceの癖でこんな感じに書いてしまうと、怒られます。

TypeError: Error #1009: null のオブジェクト参照のプロパティまたはメソッドにアクセスすることはできません。

コマンド処理内でtraceを行いたい場合は、以下のようにするとOK。

  1. new Trace()を使う
  2. new Func()を使う

1.new Trace()を使う

new Trace()を、以下のような感じで使ってあげるとOK。

addCommand(
    new Trace("あ"),
    new Wait( 1000 ),
    new Trace("い"),
    new Wait( 1000 ),
    new Trace("う")
)

これを実行すると、出力パネルにあ→い→うと1秒ごとに表示されます。

2.new Func()を使う

もうひとつは、 new Func()を使ってあげるという手法もあります。

addCommand(
    new Func( trace, ["あ" ] ),
    new Wait( 1000 ),
    function ():void{
        insertCommand(new Trace("い"));
    },
    new Wait( 1000 ),
    new Func( function() {
        trace( "う" );
    } )
)

これを実行すると、1の場合と同様に、出力パネルにあ→い→うと1秒ごとに表示されます。

new Func()の記述方法は何パターンかあるみたいです。詳しくは、リファレンスのFuncクラスの箇所をご覧ください。

addCommand()、insertCommand()、new Func()を使いこなせるようになると、かなり色んなことが出来そうです。

★参考にさせていただいた記事

ParallelListとSerialList


ParallelListとSerialListを定義する方法は、いろいろあるかと思うので、ちょっとまとめてみました。

  1. new SerialListと記述する方法
  2. new ParallelListと記述する方法
  3. addCommand内にずらずら記述していく方法
  4. addCommand内に[]を記述する方法
  5. new SerialListに配列を指定する方法
  6. new ParallelListに配列を指定する方法
  7. 配列をSerialListにする方法
  8. 配列をParallelListにする方法

1.new SerialListと記述する方法

これはリファレンスのSerialListクラスのExampleに掲載されている方法です。

var list:SerialList = new SerialList();
list.addCommand(
    new Trace("あ"),
    new Wait( 1000 ),
    new Trace("い"),
    new Wait( 1000 ),
    new Trace("う"),
    new Wait( 1000 ),
    new Trace("え"),
    new Wait( 1000 ),
    new Trace("お")
);
list.execute();

これを実行すると、あいうえおが1秒ごとに出力パネルに表示されます。

SerialListはその名前の通り、頭から順番に処理を実行していくということになります。

では次に、同じソースをParallelListで実行してみることにします。

2.new ParallelListと記述する方法

var list:ParallelList = new ParallelList();
list.addCommand(
    new Trace("あ"),
    new Wait( 1000 ),
    new Trace("い"),
    new Wait( 1000 ),
    new Trace("う"),
    new Wait( 1000 ),
    new Trace("え"),
    new Wait( 1000 ),
    new Trace("お")
);
list.execute();

これを実行すると、あいうえおが同時に出力パネルに表示されます。

つまり、コマンド内に記述された処理が、全て同時に行われるということです。

3.addCommand内にずらずら記述していく方法

new SerialListをしなくても、addCommand内に処理をズラズラ書いていけば、SerialListとして認識されるっぽいです。

以下のコードで試してみたいと思います。

addCommand(
    new Trace("あ"),
    new Wait( 1000 ),
    new Trace("い"),
    new Wait( 1000 ),
    new Trace("う"),
    new Wait( 1000 ),
    new Trace("え"),
    new Wait( 1000 ),
    new Trace("お")
);

これを実行すると、1の場合と同様に、あいうえおと1秒ごとに出力パネルに表示されていきます。

4.addCommand内に[]を記述する方法

コードを[]で囲むだけでParallelListとして認識される様になります。

addCommand(
    [
    new Trace("あ"),
    new Wait( 1000 ),
    new Trace("い"),
    new Wait( 1000 ),
    new Trace("う"),
    new Wait( 1000 ),
    new Trace("え"),
    new Wait( 1000 ),
    new Trace("お")
    ]
);

これを実行すると、2と同様にあいうえおが同時に出力パネルに表示されます。

5.new SerialListに配列を指定する方法

var list:SerialList = new SerialList();
list.addCommand(
    [
    new DoTransition(this , Iris , Transition.IN, 2, Strong.easeOut,{startPoint:5, shape:Iris.CIRCLE}),
    new DoTransition(this , Squeeze , Transition.IN, 2, Elastic.easeOut,{dimension:1})
    ]
);
list.execute();

この様に指定すると、SerialListではなくParallelListとして処理されます。

6.new ParallelListに配列を指定する方法

var list:ParallelList = new ParallelList();
list.addCommand(
    [
    new DoTransition(this , Iris , Transition.IN, 2, Strong.easeOut,{startPoint:5, shape:Iris.CIRCLE}),
    new DoTransition(this , Squeeze , Transition.IN, 2, Elastic.easeOut,{dimension:1})
    ]
);
list.execute();

この様に指定すると、ParallelListではなくSerialListとして処理されます。

配列を処理する場合、5.6のパターンだとちょっと分かりにくいかと思います。
なので、new ○○○○しないで、3.4のようにaddCommand内にずらずら記述していくパターンがいいのではないかと(個人的に)思います。

7.配列をSerialListにする方法

addCommand(
    new DoTransition(this , Iris , Transition.IN, 2, Strong.easeOut,{startPoint:5, shape:Iris.CIRCLE}),
    new DoTransition(this , Squeeze , Transition.IN, 2, Elastic.easeOut,{dimension:1})
);

8.配列をParallelListにする方法

addCommand(
    [
    new DoTransition(this , Iris , Transition.IN, 2, Strong.easeOut,{startPoint:5, shape:Iris.CIRCLE}),
    new DoTransition(this , Squeeze , Transition.IN, 2, Elastic.easeOut,{dimension:1})
    ]
);

Home > Archives > 2008-11

Search
Feeds
Meta

flashDevelopスポンサー

Return to page top