2007.04.27

カスタムエフェクトを使った上下のカメラ移動(パンニング)のサンプルです。640x200dotのFlash表示枠に対して、640x400dotの画像(4枚)を交互に上下動させています。別サンプル簡単なフェードとパンニング(カメラ移動)イージーモードで定義していますので、全ての画像が上から下へのパンニングでした。当サンプルではエキスパートモードを利用することで、画像別に異なるカスタムエフェクト(カメラ移動)を適用しています。

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

  • ズームモード(zoom_mode:0)をオリジナルサイズとする
  • 時間差系の変化種別で上移動、下移動2種類のカスタムエフェクトを定義する
  • 1枚目と3枚目は上移動、2枚目と4枚目は下移動にする為、エキスパートモードで定義する
  • 比較的大きめな画像を扱う際は遅延制御系パラメータでCPU負荷を調整した方が良いでしょう。
  • 透過度(alpha)操作を加えると上下パンに合わせてクロスフェード効果を得ることもできます。
  • 停止時間(stop_time)をゼロとすることで、画像が常に動いている状態になります。

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

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>30</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,out001" >media/fpe/sample/pan/640x400_001.jpg</image_url>
    </image>

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

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

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

</expert>


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

<!-- 上から下へパンニング -->
    <in001  layer="0" x="0,320" y="1,100,0"   alpha="111,100,0" />
    <out001                     y="1,200"     alpha="211,0" />

<!-- 下から上へパンニング -->
    <in002  layer="0" x="0,320" y="1,100,200" alpha="111,100,0" />
    <out002                     y="1,0"       alpha="211,0" />

</effect>

</pagedata>