2010-03-03(Wed) 13:08
【AS3.0】無限ループ移動する画像

読み込んだ複数の外部画像を右から左へと無限ループで移動させるFlashを作成してみます。
画像サイズを指定したり、正方形しか使えなかったり、とかなり使い勝手の悪い感じになってます。あとステージサイズより画像の横幅の合計サイズは大きくしてください。

外部XMLはこんな感じです。


<data>
    <photo>img/img01.gif</photo>
    <photo>img/img02.gif</photo>
    ・・・・
    <photo>img/img10.gif</photo>
</data>
package
{
	import flash.display.Sprite;
	import flash.display.Loader;
	import flash.net.URLLoader;
	import flash.net.URLRequest;
	import flash.events.Event;
	import XMLloader;

	public class Main extends Sprite
	{
		var _loaderList:Array = new Array();
		var _XMLLoader:XMLloader;
		var _XML:XML;
		//画像URL格納する配列
		var _imgList = new Array();	

		//画像のサイズ
		var _imgSize:uint = 40;
		//スクロールスピード
		var _dx:int = 3;
		//画像の間隔
		var _interval:uint = 20;

		public function Main() {
			_XMLLoader = new XMLloader("load.xml");
			_XMLLoader.addEventListener(XMLloader.LOAD_COMPLETE, onXMLloaded);
		}
		function onXMLloaded(event:Event):void{
			//ロードしたXMLを取得
			_XML = _XMLLoader.getXML();

			for each (var item:XML in _XML.photo) {
				//XMLの画像URLを_imgListに入れる
				_imgList.push(item.text());
			}

			for (var i = 0; i < _imgList.length; i++) {
				_loaderList[i] = new Loader();
				//読み込む画像の指定
				_loaderList[i].load(new URLRequest(_imgList[i]));
				this.addChild(_loaderList[i]);
				//_intervalだけ間隔を空けて配置
				_loaderList[i].x = i * (_imgSize + _interval);
				//画面縦の中心に配置(正方形じゃなかったら_imgSizeのところを変える)
				_loaderList[i].y = (this.stage.stageHeight / 2) - (_imgSize / 2);
				//個々の画像を識別るす番号(1番から)
				_loaderList[i].name = i + 1;
				//ループイベント
				_loaderList[i].addEventListener(Event.ENTER_FRAME, enterframeTimer);
			}
		}

		//ループ処理
		public function enterframeTimer(event:Event):void {
			event.target.x -= _dx;
			//左の画面外に出たら一番右に移動
			if (event.target.x < 0 - _imgSize) {
				//画像の最後の配列のxから画像分プラス
				event.target.x = _loaderList[_loaderList.length - 1].x + (_imgSize + _interval) * event.target.name;
			}
		}
	}
}

画像のxが0以下(画面外)になったら配列の一番後ろの画像のi個の位置に移動して、再スタートさせるという感じになっています。
だいたい正方形じゃない画像がほとんでしょうから46行目の「_imgSize」は読み込む画像のHeightに変えてください。


Comment Form
Name
E-mail
URL
Comment

TrackBack URL