Flash Parts for ActionScript 123

	目 次
1	サンプルと主な特徴
2	機能一覧およびダウンロード
3	設置およびカスタマイズ方法
4	画像遷移について
５	補足事項

　　

１．サンプルと主な特徴

サンプル　（動作サンプルは、下記画像をクリックして確認できます。）

主な特徴

1. 種々の画像遷移効果が設定できるスライドショーです。
2. 画像（ｊｐｇ、ｇｉｆ、ｐｎｇ、ｓｗｆ）、コメント、主なビジュアルの設定はすべて１つの外部xmlデータで指定できます。
3. 以上より、１つのXMLファイル（より自由なカスタマイズは１つのFLASHファイル）のみの修正で更新が非常に簡単です

制作ソフト	FLASH CS3 Professional (for　win)
パブリッシュ設定	Flash Player Ver 9
	ActionScript 3.0

  　

▲Top

２．機能一覧およびダウンロード

フリー版とシェア版の機能比較とダウンロード

項目	フリー版	シェア版
全体： 背景色・透明度変更	○（xmlで修正可能）	○
全体： 画像切り替え時間設定	○ (xml)	○
コメント： テキスト色、背景色・透明度変更	○ (xml)	○
画像遷移効果： 各種パラメータ変更	○ (xml)	○
画像： 相対パス、表示位置、コメント設定	○ (xml)	○
画像数	○ (xml)	○
コメント文字のフォント、サイズ、表示位置など	×	○（flaファイルカスタマイズ）
画像のサイズなど	×（幅640x縦480） *1	○（flaファイルカスタマイズ）
xmlファイル名、設置位置	×	○
ソースファイル	×（無し）	○（有り）
必要なアプリケーションソフト	特になし	FLASH CS3 Pro 以上
著作権の表示（リンク表示）	表示必要	表示不要
価格	0 円	6,300 円
DL－Marketより購入 （※１）		DL-Market（別窓）
Vectortより購入	free_image_301.exe	Vector(別窓)
Vector：解凍キー	利用規定の最後に記載	(Vectorより自動配布されます)
備考	*1：サンプル参照

（※１）Vector と DL-Market の違いについてはこちらを参照してください。 （ファイルの中身は同じものです。）
※いずれの場合もご利用の際は、「利用規定」をご確認ください。

　

▲Top

３．設置およびカスタマイズ方法

設置方法

1. htmlファイル、フォルダ構造の変更は、ダウンロードファイルを参考に修正してください。特に注意する点は下記です。

◇<ｂｏｄｙ>タグ内のjavascript　「AC_FL_RunContent()」　関数内の相対パスおよびGET値（?マーク以降）・・・フリー版のみ

'movie', 'free_image_301?authorUrl=http://www.area115.com/&target=_blank&thisUrl=' + document.URL ,　

◇<noscript>タグ内に追記　・・・フリー版のみ

<param name="FlashVars" value="authorUrl=http://www.area115.com/&target=_blank" />

<embed ～ FlashVars="authorUrl=http://www.area115.com/&target=_blank" />

XMLファイルのカスタマイズ（フリー版／シェア版共通）

1. xmlフォルダ内の　image_301.xml　をテキストエディターで開いて修正してください。
   修正後は文字コード　utf-8　で保存してください。
   （フリー版はｘｍｌフォルダ名、パス、xmlファイル名の変更はできません。）
2. 修正する場所は、色や透明度などビジュアルな部分は<common>タグ内です。
3. 画像遷移効果（トランジション）の各種設定は<transition>タグ内です。
   複数指定するとランダムで適用されます。
   （各項目の解説については後述）
4. 表示画像の相対パス、表示位置（指定しなければ画面中央）、コメントの設定は<img>タグ内です。
   
   外部XMLファイル「image_301.xml」

<?xml version="1.0" encoding="utf-8"?>
<data version="1.0">
<information>
<name>[fp3]image_301.swf用データ</name>
<type>ActionScropt3.0によるFLASH用Parts。画像遷移（トランジション）付きスライドショー</type>
<creationDate>2008.04.02</creationDate>
<author>FlashParts制作委員会</author>
<authorUrl>http://www.area115.com/</authorUrl>
<copyright>FlashParts制作委員会</copyright>
<version>1.0.0</version>
</information>

<!-- remark = "※共通部分の設定（以下※の付いた文字列は変更または削除可能です。）" -->
<common>
<bg color = "#efefef" alpha = "1" >※画面全体の背景色／透明度</bg>
<page color = "#00ff00">※ページのテキスト色</page>
<text color = "#cccccc">※下部のコメントのテキスト色</text>
<text_bg color = "#000000" alpha = "0.7" >※コメントの背景色／透明度（0～1）</text_bg>
<time lag = "3000">※画像遷移完了後から次の表示までの画像切り替え時間（ミリ秒）"</time>
</common>

<!-- remark = "※画像遷移効果の指定。複数設置した場合ランダムで切り替わります。" -->
<transitions>
<transition>
<type >Blinds</type>
<direction >Transition.IN</direction>
<duration >2</duration>
<easing >None.easeNone</easing>
<numStrips >10</numStrips>
<dimension >0</dimension>
</transition>
～　中略　～
</transitions>

<!-- remark = "※表示画像の指定。画像は表示するhtmlからの相対パスです。（swfからの相対パスではありません。）" -->
<images>
<img src="/main/img/1.gif" mce_src="/main/img/1.gif" x = "" y = "" comment = "◇様々な画像切り替え効果のあるスライドショーができます。" />
<img src="/main/img/2.jpg" mce_src="/main/img/2.jpg" x = "" y = "" comment = "◇読み込み画像の種類はjpg、gif、png、swfです。（透過画像も使用可能）" />
<img src="/main/img/3.swf" mce_src="/main/img/3.swf" x = "" y = "" comment = "◇xmlファイルで様々な設定ができます。（画像、画像遷移、テキスト色など）" />
<img src="/main/img/4.png" mce_src="/main/img/4.png" x = "-200" y = "-50" comment = "◇画像の位置（ｘ，ｙ）も指定できます。（指定しなければ中央に表示）" />
<img src="/main/img/5.jpg" mce_src="/main/img/5.jpg" x = "" y = "" comment = "◇画像は表示するhtmlからの相対パスです。（フォルダ名、画像名の設定自由）" />
</images>

</data>

シェア版のカスタマイズ方法

1. 構造はムービーエクスプローラーを参照してください。［ウインドウ］ ＞ ［ムービーエクスプローラー］ で表示されます。
   詳しくは下記をご覧下さい。
   ＦＡＱ：ソースファイル(.fla)の構造確認方法について
   
   

　

▲Top

４．画像遷移について

◆画像遷移動作テスト◆　様々な設定の動作確認ができます。

type 別プロパティ一覧表

プロパティ	direction	duration	easing	numStrips	dimension	startPoint	shape	xSections	ySections	ccw	degrees
遷移 タイプ	出現 or 消失	遷移 時間	イ ｜ ジ ン グ	スリット 数	水平 or 垂直	開始点	丸 or 四角	x方向 分割数	y方向 分割数	反 時 計 回 り ？	回転 角度
選択肢→	*1	0~∞	*2	1~50 推奨	0 or 1	1~9 推奨	*3	1～50 推奨	1～50 推奨	*4	1~ 9999 　　 推奨
（↓１０種）				整数		整数		整数	整数
Blinds	○	○	○	○	○
Fade	○	○	○
Fly	○	○	○			○
Iris	○	○	○			○	○
Photo	○	○	○
PixelDissolve	○	○	○					○	○
Rotate	○	○	○							○	○
Squeeze	○	○	○		○
Wipe	○	○	○			○
Zoom	○	○	○

• *1：Transition.IN　または　Transition.OUT
• *2：easing 組み合わせ表　（使用例：　None.easeNone、Back.easeIn　など）
  

  easing組合せ	None	Elastic	Bounce	Regular	Strong	Back
  easeIn		○	○	○	○	○
  easeInOut		○	○	○	○	○
  easeOut		○	○	○	○	○
  easeNone	○	○	○	○	○	○

• *3：Iris.CIRCLE　または　Iris.SQUARE
• *4：TRUE　または　FALSE

 

　

▲Top

５．補足事項

メインのアクションスクリプトの主要なポイント

• 参考文献：「ＡｄｏｂｅＦｌａｓｈＣＳ３　ＡｃｔｉｏｎＳｃｒｉｐｔ３．０入門ノート」の３６７ページから記載された情報をベースにしています。
• 工夫した点は
  • 表示部分をスクリプトベースではなく、よりソースファイル（ｆｌａ）でビジュアルに修正できる。
  • １つのｘｍｌでほとんどの設定を変更できる。
  • 全画像遷移効果の設定方法を整理し、テスト確認できる。
  • コメント、ページ数などの情報を表示する。
  • １つめの画像遷移が完了した時点で次の画像を読み込み開始し、所定の時間になったら重ね順を入れ替える。
• 外部パッケージクラスを利用し、ソースファイル（ｆｌａファイル）側は極力少ない１フレームアクションで処理する。（再利用性、カスタマイズ性を考えて）

重要なお知らせ

• 『ダウンロードしたファイルがローカル環境でうまく動作しない場合の対応について』
  >> こちらをご覧ください。