2007.04.25

カスタムエフェクトを使った上下のカメラ移動(パンニング)とズーミングのコンビネーションサンプルです。640x200dotのFlash表示枠に対して、640x400dotの画像(4枚)を交互に上下動させながら、時間差系変化種別で200%の拡大状態から100%の通常状態へ縮小します。別サンプル上下のパンニング(カメラ移動)は上下動のみですが、少し手を加えることで印象が異なります。

定義のポイントは以下です。

  • ズームモード(zoom_mode:0)をオリジナルサイズとする
  • 時間差系の変化種別で上移動、下移動2種類のカスタムエフェクトを定義する
  • 1枚目と3枚目は上移動、2枚目と4枚目は下移動にする為、エキスパートモードで定義する
  • 退場エフェクトで指定されている『fe_none』は無効果用のプリセットエフェクトです。
  • 比較的大きめな画像を扱う際は遅延制御系パラメータでCPU負荷を調整した方が良いでしょう。
  • 明るさ(bright)操作を加えるとホワイトイン効果を得られます。
  • 当サンプルでは等速系の変化種別を使ってますが、減速、加速系に置き換えることで動きにアクセントをつけることもできます。

当サンプルの定義ファイル

fe_top.jpg
media/fpe/logo/fe_top.
640x400_001.jpg
media/fpe/sample/pan/640x400_001.
640x400_002.jpg
media/fpe/sample/pan/640x400_002.
640x400_003.jpg
media/fpe/sample/pan/640x400_003.
640x400_004.jpg
media/fpe/sample/pan/640x400_004.
 
<?xml version="1.0" encoding="UTF-8" ?>
<pagedata>
<common>

    <copyright>elz.jp</copyright>
    <stage_width>640</stage_width>
    <stage_height>200</stage_height>

<!-- バナー表示位置指定 -->
    <banner_align>1</banner_align>

<!-- エフェクト指定 -->
    <effect_time>60</effect_time>
    <stop_time>0</stop_time>

<!-- 表示位置関係パラメータ指定 -->
    <align_mode>5</align_mode>
    <base_mode>5</base_mode>
    <zoom_mode>0</zoom_mode>

<!-- プラグイン関係パラメータ指定 -->
    <plugin_blend_mode>hardlight</plugin_blend_mode>
    <plugin_align_mode>9</plugin_align_mode>

    <frame_url>media/fpe/frame/frame_640x200a.swf</frame_url>

<!-- CPU負荷制御 -->
    <stream_buffer>0</stream_buffer>
    <start_delay>5</start_delay>

</common>


<!-- 画像個別定義(エキスパートセクション) -->
<expert>

    <image>
        <plugin_url effect_type="fe_none">media/fpe/logo/fe_top.jpg</plugin_url>
        <image_url effect_type="in001,fe_none" >media/fpe/sample/pan/640x400_001.jpg</image_url>
    </image>

    <image>
        <image_url effect_type="in002,fe_none" >media/fpe/sample/pan/640x400_002.jpg</image_url>
    </image>

    <image>
        <image_url effect_type="in001,fe_none" >media/fpe/sample/pan/640x400_003.jpg</image_url>
    </image>

    <image>
        <image_url effect_type="in002,fe_none" >media/fpe/sample/pan/640x400_004.jpg</image_url>
    </image>

</expert>


<!-- カスタムエフェクト定義 -->
<effect>

<!-- 上から下へパンニング -->
    <in001  x="0,320" y="101,200,0"   xs="201,100,200" ys="201,100,200" alpha="131,100,0" bright="101,0,100" />

<!-- 下から上へパンニング -->
    <in002  x="0,320" y="101,0,200" xs="201,100,200" ys="201,100,200" alpha="131,100,0" bright="101,0,100" />

</effect>

</pagedata>