正方形サムネイル画像を使った効果(その16)
サイズの大きめな正方形サムネイル画像の連続ズームイン効果をカスタムエフェクトで定義しました。
540x300pxのFlash表示枠中に、サムネイル画像(640x640px)をzoom_mode:0(オリジナルサイズ)で動作させています。
『正方形サムネイル画像を使った効果(その14)』と似ていますが、登場画像の表示方法が若干異なります。前者は『登場画像がフェードインで現れる』のに対して、このサンプルは『Flash表示枠外(上部)』からとなります。スピードが速いので判りにくいかもしれませんがじっくり観察して下さい。
左上でのズームイン効果ですので、定義は左上基準(base_mode: 7 align_mode:7)としている点に注意して下さい。
登場画像は25%から100%サイズへ、退場画像は100%から400%サイズへのズームイン動作となります。エフェクト定義は『y="0,-160"』としy軸の初期値設定をしています。160とは25%サイズ時の高さ(640*0.25)を指します。登場画像は表示枠外でズームイン動作が開始され、100%に近づくにつれて可視状態になる訳です。
登場画像と退場画像のズーム動作が同調している点は『正方形サムネイル画像を使った効果(その15)』に説明がありますので参考にして下さい。
このサンプルのカスタムエフェクト定義はとても単純です。動作は大きいですが透過度(alpha)等の操作を行っていませんので、CPU負荷は低いです。
サムネイル画像はImageMagickのmontageコマンドを利用して作成しています。興味のある方は『montageの余白とボーダーの考え方』等を参考にして下さい。
カスタムプラグイン、カスタムエフェクトの詳しい利用方法はELZのFPEマニュアルを参照して下さい。
テロップ画像(Flash表示領域中央のタイトル用画像)
スライドショーで利用する画像の縮小イメージ
FPEに読み込ませる定義ファイル(xml)のサンプル
<?xml version="1.0" encoding="UTF-8" ?>
<pagedata>
<common>
<copyright>elz.jp</copyright>
<banner_align>3</banner_align>
<image_max>2</image_max>
<prefix>images/thumb</prefix>
<effect_type>in,out</effect_type>
<effect_time>12</effect_time>
<stop_time>0</stop_time>
<align_mode>7</align_mode>
<base_mode>7</base_mode>
<zoom_mode>0</zoom_mode>
<plugin_url>images/title001.jpg</plugin_url>
<plugin_effect_type>fe_none</plugin_effect_type>
<plugin_align_mode>9</plugin_align_mode>
<plugin_base_mode>7</plugin_base_mode>
<plugin_blend_mode>hardlight</plugin_blend_mode>
<play_mode>1</play_mode>
</common>
<effect>
<in xs="1,100,25" ys="1,100,25" y="0,-160" />
<out xs="1,400" ys="1,400" />
</effect>
</pagedata>
