POPSブログ

サイン曲線で画像を動かすテストです/3

94

  Category:  as32012/04/24 pops 

サイン曲線で画像を動かすテストです3、シュミュレーションテストのボタンなどを削除してコードを簡略化しました。


サイン曲線で画像を動かすテスト3

記事、「サイン曲線で画像を動かすテストです2」シュミュレーションテストはボタンなどが沢山あり、コードがわかり難いとおもいます。ボタンなどを削除して簡略化しました。
文字と比べて画像は大きいために、曲線運動していても一部で判別付かない場合もあります。この点ご了承ください。



注意、FlashTest191c.swf、は画像を読み込んでいるため、当方専用になります。/main/images/xxx.jpg


簡単な動作の説明

スクリプトの中に説明があります。またシュミュレーションテストもご覧ください。
条件の設定が面倒な場合は中の「ランダムセット」を利用しても良いかとおもいます。


注意、使用者の環境により画像パスを変更ください。


AS3

FlashTest191c.as


//動く画像表示テスト
//FlashTest191c
//640x480
//sin関数/In Out 簡略化

package
{
	
	import flash.display.*;
	import flash.events.*;
	import flash.net.*;
	import flash.geom.*;
	import flash.system.*;
	import flash.utils.*;
	import flash.text.*;
	import flash.filters.DropShadowFilter;
	
	//TweenLite
	import com.greensock.*;
	import com.greensock.easing.*;
	
	//虹色用
	import frocessing.color.ColorHSV;

	[SWF(width="640", height="480", frameRate="30", backgroundColor="0xFFFFFF")]

	public class FlashTest191c extends Sprite {
		
		static public const	INTERPOLATE:Number = 50;
		//container
		private var container:Sprite;
		//TEXT
		private var tf:TextField;
		//BTN
		private var btn_1:Sprite;
		//MOVE-IMAGE
		private var photomax:int;
		//格納容器2、画像専用なので名前をかえた
		private var img_sps:Array = [];//要素Sprite格納容器
		private var img_cxs:Array = [];//X位置格納容器
		private var img_cys:Array = [];//Y位置格納容器
		private var sin_balls:Array = [];//要素bez_ball格納容器
		private var count_sin:Array = [];//INTERPOLATE減算用配列
		//逆転係数
		private var chg_x:Number = 1;
		private var chg_y:Number = 1;
		//OUT実行判定フラグ
		private var outflag:Boolean = false;
		private var scaleUp:Boolean = false;//scaleUpするか判定
		//グローバルカウント/delayが終了したかの判定に使用する、複数のアニメを同時進行の場合は複数個必要だ
		private var gl_count:int = 0;
		
		//---------------------------------------------
		//container位置
		private var container_x:Number = 100;
		private var container_y:Number = 240;
		
		//個別に初期位置を同一にする/1=強制移動 0=移動しない
		private var firstPoint:int = 0;
		//sin番号 0-5 5螺旋
		private var no:int = 0;
		//No5の進む角度標準3.6/画像なので遅くした、小さくすると遅くなる
		private var angle5:Number = 2.4;//3.6
		//振幅
		private var swing_x:Number = 100;
		private var swing_y:Number = 100;
		//距離
		private var ball_len_x:Number = 500;//200-500
		private var ball_len_y:Number = 500;//200-500
		private var rot_v:Number = 360;//回転数
		//位相切り替え 0-3
		private var chg_xyno:Number = 0;
		
		//delay順序切り替え 0-3 左 右 中 外
		private var delay_no:int = 0;
		//遅延反転 0なし 1遅延 2反転
		private var inversion_v:int = 0;
		
		//scale 1, 1.5, 2, 2.5, 5, 1, 0.5, 0
		private var scale_v:Number = 1;
		//alpha
		private var alpha_v:Number = 1;//注意固定値
		private var alpha_flag:Number = 0;//alphaを変えるか
		
		//画像のおおきさ
		private var image_W:Number = 80;
		private var image_H:Number = 60;
		//---------------------------------------------
		
		//LOADER
		private var loader:Loader;
		//Loading
		private var indicator:DisplayObject;
		//現在表示画像配列番号
		private var countImage:int = 0;
		//画像Bitmap
		private var mainImages:Array = [];//Array-Bitmap
		//画像収容Sprite
		private var mainImageBox:Sprite;
		//URL
		private var imageUrls:Array = [];
		//画像位置保存用	
		private var _arrX:Array = [];//X位置保存
		private var _arrY:Array = [];//Y位置保存
		private var _arrW:Array = [];//幅保存
		private var _arrH:Array = [];//高さ保存
		//Filter
		private var shade:DropShadowFilter;
		
		public function FlashTest191c():void {
			
			//BASE/白背景
			graphics.beginFill(0xF0F0F0);//0x000000
			graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight);
			graphics.endFill();
			
			//text
			tf = createTextField(10, 5, stage.stageWidth - 20, 20);
			tf.textColor = 0x000000;
			tf.text = "";
			tf.selectable = false;
			addChild(tf);
			
			//BTN-1/アニメIN実行ボタン、はじめ非表示
			btn_1 = createRoundBTN("アニメIN", 13, 0x000000, 60, 20, 0xFF69B4, 1, 5);
			btn_1.x = 600;
			btn_1.y = 25;
			addChild(btn_1);
			btn_1.visible = false;
			btn_1.addEventListener( MouseEvent.CLICK, animate2 );
			
			//MOVE文字container
			container = createSquare(0, 0, stage.stageWidth, 10, 0x000000, 0);
			container.x = container_x;
			container.y = container_y;
			addChild(container);
			
			//LOADING
			indicator = new Indicator();
			indicator.x = 12;
			indicator.y = 15;
			indicator.addEventListener(Event.ENTER_FRAME, step);//回転Listener
			addChild(indicator);
			indicator.visible = false;
			//goto-init
			init();
		}
		
		// INIT
		private function init():void {
			//goto-main
			main_action();
		}
		
		// MAIN-ACTION ここでは、どうしても必要では無い
		private function main_action():void {
			//main_action as3 hear
			//GOTO-URL-SET、画像読み込みに進む
			loadImage_Url_Set();
		}
		
		// 画像URL-SET
		private function loadImage_Url_Set():void
		{
			//画像URL 80x60
			imageUrls = [
				"/main/images/photo_bz1.jpg",
				"/main/images/photo_bz2.jpg",
				"/main/images/photo_bz3.jpg",
				"/main/images/photo_bz4.jpg",
				"/main/images/photo_bz5.jpg"
			];
			
			//カウント
			countImage = 0;
			//画像数
			photomax = imageUrls.length;
			//LOADING表示
			indicator.visible = true;
			//GOTO-loadImage
			loadImage();
		}
		// 画像をロード
		private function loadImage():void {
			//loaderセット
			loader = new Loader();
			var imageName:String = imageUrls[countImage];
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete_img);
			loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, ioErrorHandler);//Error
			loader.load(new URLRequest(imageName));//loader
		}

		private function onComplete_img(event:Event):void {
			loader.contentLoaderInfo.removeEventListener(Event.COMPLETE, onComplete_img);
			tf.text = "画像読み込み中";
			
			//画像の加工保存
			//Matrixを使用した場合
			var mainloader:Loader = event.currentTarget.loader;
			var ratio:Number = image_W / loader.width;//縮尺比率
			var matrix:Matrix = new Matrix();
			matrix.scale(ratio, ratio);
			var bd2:BitmapData = new BitmapData(image_W, image_H, false);
			bd2.draw(mainloader, matrix);//Matrixを適応
			mainImages.push(bd2);
			
			//画像大きさ受け渡し
			_arrW.push(event.target.content.width);
			_arrH.push(event.target.content.height);
			
			countImage ++;
			
			//全て読み込んだら画像の加工に、まだなら残り画像をロードする
			if (countImage >= photomax) {
				//LOADING非表示
				indicator.visible = false;
				//画像をロード終了、画像運動表示に進む
				make_ImageBox();
				
			} else {
				//残り画像をLoad
				loadImage();
			}
			
		}
		
		//画像運動表示
		private function make_ImageBox():void {
			
			//max再計算、push操作しているので、画像取得出来無かったものははぶかれている
			photomax = mainImages.length;
			//Filter作成
			shade = new DropShadowFilter(1, 90, 0x000000, 0.4, 4, 4, 2, 3, false, false);
			
			var allpoint:Number = 0;
			var i:int = 0;
			for (i = 0; i < photomax; i++) {
				//SinBall運動CLASSを作る
				var ball:SinBall = new SinBall();
				
				//2重構造でないと中心補正が出来ないので収容インナーを作り画像を流す
				//画像収容インナー
				var spss_in:Sprite = new Sprite();
				spss_in.graphics.beginBitmapFill(mainImages[i], null, false, false);
				spss_in.graphics.drawRoundRect(0, 0, _arrW[i], _arrH[i], 10);
				spss_in.graphics.endFill();
				spss_in.x = _arrW[i] / -2;
				spss_in.y = _arrH[i] / -2;
				//中心補正のSprite
				var spss:Sprite = new Sprite();
				spss.filters = [shade];//filter
				spss.addChild(spss_in);
				//配列に保存addChild
				img_sps[i] = spss;
				ball.addChild(img_sps[i]);
				
				//識別番号をいれる
				ball.count_no = i;
				sin_balls[i] = ball;
				
				//ここでは初期は横並びとして、横に並べるために、X位置を計算する
				//予め計算した配列情報を利用しても良い
				allpoint += _arrW[i]/2;
				img_cxs[i] = allpoint;
				img_cys[i] = 0;//Yは0
				//間隔プラス
				allpoint += (_arrW[i] / 2 + 10);
				
				//横並びの画像列位置確定/アニメしないならば一応ここで並んでいる
				img_sps[i].x = img_cxs[i];
				img_sps[i].y = img_cys[i];
				//コンテナにaddChildする
				container.addChild(ball);
				//
			}
			
			//GOTO-animate
			animate2();
			
		}
		
//ランダム条件の設定/削除すること
private function random_set():void {
	//位相切り替え 0-3
	chg_xyno = Math.floor(Math.random() * 4);
	//番号切り替え 0-5 5螺旋
	no = Math.floor(Math.random() * 6);
	//移動切り替え 0-1
	firstPoint = Math.floor(Math.random() * 2);
	//スケール切り替え
	var scale_nm:Array = [1, 1.5, 2, 2.5, 5, 1, 0.5, 0];
	scale_v = scale_nm[Math.floor(Math.random() * 8)];
	//透過切り替え 0-1
	alpha_flag = Math.floor(Math.random() * 2);
	//回転切り替え 0 360 -360
	rot_v = (Math.floor(Math.random() * 2) - 1) * 360;
	//反転遅延 0-2 0なし 1遅延 2反転
	inversion_v = Math.floor(Math.random() * 3);
	//順序切り替え 0-3
	delay_no = Math.floor(Math.random() * 3);
	//距離の切り替え 300-500
	ball_len_x = (Math.floor(Math.random() * 3) + 3) * 100;
	ball_len_y = ball_len_x;
	//
}

		//animate2/IN
		private function animate2( e:MouseEvent = null ):void {
			
//ランダム条件の設定に進む/削除すること
random_set();

			tf.text = "SIN曲線 アニメ IN 実行中です";
			//OUT実行判定フラグ
			outflag = false;
			
			//位相切り替えの条件設定
			if (chg_xyno == 0) { chg_x = 1; chg_y = 1; }
			if (chg_xyno == 1) { chg_x = 1; chg_y = -1; }
			if (chg_xyno == 2) { chg_x = -1; chg_y = 1; }
			if (chg_xyno == 3) { chg_x = -1; chg_y = -1; }
			
			//ボタン非表示
			btn_1.visible = false;
			
			//no = Math.random() * 6;
			//順序切り替え
			var delay_v:Number = 0;
			var delay_total:Number = photomax * 0.5;
			var txline_mv:Number = (photomax - 1) / 2;
			var flag3:int = 1;
			//alpha
			var alpha_v2:Number = 1;
			//変化の確率 inversion_v
			//var chgflag:Number = Math.floor(Math.random() * 6);
			//中外の場合加算する数値
			var d_chg_v:Number = Math.floor(Math.random() * 4 ) * 0.25;
			//alpha
			if (alpha_flag == 0 ) { alpha_v2 = 1; }
			if (alpha_flag == 1 ) { alpha_v2 = 0; }
			
			var i:int = 0;
			for (i = 0; i < photomax; i++) {
				
				//中の文字位置を00にセットする位置情報は外のspiral_ballsに設定した
				//回転のため
				img_sps[i].x = 0;
				img_sps[i].y = 0;
				
				//見えない場用に移動/2倍にしないと見える場合あり
				sin_balls[i].x = (stage.stageWidth + ball_len_x + img_cxs[i]) * chg_x;
				sin_balls[i].y = img_cys[i];
				
				//scale/画像だから0で良い
				sin_balls[i].scaleX = 0;
				sin_balls[i].scaleY = 0;
				
				//INTERPOLATE減算用配列
				count_sin[i] = INTERPOLATE;//50
				
				//delay値の変化/中外4種類
				delay_v = i * 0.5;//左
				if (delay_no == 1) { delay_v = delay_total - i * 0.5; }//右
				if (delay_no == 2) { delay_v = Math.abs((i + d_chg_v) - txline_mv)*0.5; }//中
				if (delay_no == 3) { delay_v = (delay_total / 2) - Math.abs((i + d_chg_v) - txline_mv) * 0.5; }//外
				
				//遅延フラグクリア
				sin_balls[i]._chg_x = 1;
				sin_balls[i]._chg_y = 1;
				
				//遅延inversion_v/chgflag
				if (inversion_v == 1) {
					if (flag3 < 0) { delay_v += 2.25; }
				}
				//逆転inversion_v/chgflag
				if (inversion_v == 2) {
					if (flag3 < 0) {
						sin_balls[i]._chg_x = -1;
						sin_balls[i]._chg_y = -1;
					}
				}
				
				//scaleUpするか判定
				scaleUp = false;
				if (scale_v < 1) { scaleUp = true;}
				
				//グローバルカウント
				gl_count = 0;
				
				//TEST sin
				sin_balls[i].radian = 0;
				//振幅
				swing_y = Math.floor(Math.random() * 5) * 10 + 50;
				
				//中を拡大する/外側拡大では正確にならない
				img_sps[i].scaleX = scale_v;
				img_sps[i].scaleY = scale_v;
				
				//遅延させるTweenLite
				var myTween:TweenLite = new TweenLite(sin_balls[i],0.5,{delay:delay_v, scaleX:1, scaleY:1, alpha:alpha_v2, onComplete:tw_onComplete,onCompleteParams:[i]});
				flag3 *= -1;
			}
		}
		
		//animate3/OUT
		//実際のOUTでは、予め画像がならんでいるはずなのでこんなに処理はいらない、delayだけあたえれば良い
		//簡単に普通にTweenしても良い
		private function animate3( e:MouseEvent = null ):void {
			
//ランダム条件の設定に進む/削除すること
//ここで設定すれば IN OUT 違う動きになる
//random_set();
			
			tf.text = "SIN曲線 アニメ OUT 実行中です";
			btn_1.visible = false;
			//OUT実行判定フラグ
			outflag = true;
			
			//順序切り替え
			var delay_v:Number = 0;
			var delay_total:Number = photomax * 0.5;
			var txline_mv:Number = (photomax - 1) / 2;
			var flag3:int = 1;
			//alpha
			var alpha_v2:Number = 1;
			//中外の場合加算する数値
			var d_chg_v:Number = Math.floor(Math.random() * 4 ) * 0.25;
			//alpha
			if (alpha_flag == 0 ) { alpha_v2 = 1; }
			if (alpha_flag == 1 ) { alpha_v2 = 0; }
			
			//位相切り替えの条件設定
			if (chg_xyno == 0) { chg_x = 1; chg_y = 1; }
			if (chg_xyno == 1) { chg_x = 1; chg_y = -1; }
			if (chg_xyno == 2) { chg_x = -1; chg_y = 1; }
			if (chg_xyno == 3) { chg_x = -1; chg_y = -1; }
			
			var i:int = 0;
			for (i = 0; i < photomax; i++) {
				
				//中の文字位置を00にセット、回転させるため
				img_sps[i].x = 0;
				img_sps[i].y = 0;
				
				//規定の位置
				sin_balls[i].x = img_cxs[i];
				sin_balls[i].y = img_cys[i];
				//scale
				sin_balls[i].scaleX = 1;
				sin_balls[i].scaleY = 1;
				//alpha重要
				sin_balls[i].alpha = 1;
				
				//INTERPOLATE加算算用配列
				count_sin[i] = 0;//0
				
				//delay値の変化/中外4種類
				delay_v = i * 0.5;//左
				if (delay_no == 1) { delay_v = delay_total - i * 0.5; }//右
				if (delay_no == 2) { delay_v = Math.abs((i + d_chg_v) - txline_mv)*0.5; }//中
				if (delay_no == 3) { delay_v = (delay_total / 2) - Math.abs((i + d_chg_v) - txline_mv) * 0.5; }//外
				
				//遅延フラグクリア
				sin_balls[i]._chg_x = 1;
				sin_balls[i]._chg_y = 1;
				
				//遅延inversion_v/chgflag
				if (inversion_v == 1) {
					if (flag3 < 0) { delay_v += 2.25; }
				}
				//逆転inversion_v/chgflag
				if (inversion_v == 2) {
					if (flag3 < 0) {
						sin_balls[i]._chg_x = -1;
						sin_balls[i]._chg_y = -1;
					}
				}
				
				//scaleUpするか判定
				scaleUp = false;
				if (scale_v > 1) { scaleUp = true; }
				
				//グローバルカウント
				gl_count = 0;
				//TEST sin
				sin_balls[i].radian = 0;
				//振幅
				swing_y = Math.floor(Math.random() * 5) * 10 + 50;
				//中を拡大1
				img_sps[i].scaleX = 1;
				img_sps[i].scaleY = 1;
				
				//遅延させるだけが目的
				var myTween:TweenLite = new TweenLite(sin_balls[i],0.5,{delay:delay_v, scaleX:1, scaleY:1, alpha:1, onComplete:out_onComplete,onCompleteParams:[i]});
				flag3 *= -1;
			}
		}
		
		//TweenLite-onComplete IN
		private function tw_onComplete(param1:int):void {
			//delay終了順にonEnterFrame処理を設定
			sin_balls[param1].addEventListener(Event.ENTER_FRAME, onEnterFrame_sin);
		}
		//TweenLite-onComplete OUT
		private function out_onComplete(param1:int):void {
			////delay終了順にonEnterFrame処理を設定
			sin_balls[param1].addEventListener(Event.ENTER_FRAME, onEnterFrame_sinout);
		}
		
		//ball onEnterFrame IN
		//動かすクラスは何でもballの名前をつける癖があるので、ここでもballと呼ぶ、ボールの中に画像がある
		private function onEnterFrame_sin(e:Event):void {
			//
			var count:Number = INTERPOLATE;//50
			//as Ballで問題なくコンパイル/thisは使えない
			var mv_ball:SinBall = e.currentTarget as SinBall;
			var ball_no:int = mv_ball.count_no;
			
			if (gl_count < photomax) {
				//回転rot_vをcountでわる
				mv_ball.rotation += rot_v / count;
				//mv_ball.rotation = 0;
				
				//大きいなら縮小/scaleUpするか判定
				if (img_sps[ball_no].scaleX > 1 && !scaleUp) {
					img_sps[ball_no].scaleX -= (scale_v - 1) / count;
					img_sps[ball_no].scaleY -= (scale_v - 1) / count;
				}
				//小さいなら拡大
				if (img_sps[ball_no].scaleX < 1 && scaleUp) {
					img_sps[ball_no].scaleX += (1 - scale_v) / count;
					img_sps[ball_no].scaleY += (1 - scale_v) / count;
				}
				//alpha操作するなら
				//if (alpha_flag) {
					//mv_ball.alpha += alpha_v / count;	
				//}
				//alphaが小さいなら
				if (mv_ball.alpha < 1) {
					mv_ball.alpha += alpha_v / count;
				}
					
				//最後0になるように初めに減算する(INTERPOLATE)
				//INTERPOLATE減算用配列
				count_sin[ball_no] -= 1;
				
				//保存係数
				var cx:Number =	mv_ball._chg_x;
				var cy:Number =	mv_ball._chg_y;
				
				//X方向の計算
				var by:Number = (0 * count_sin[ball_no] / count);//まだ計算なし
				var bx:Number = (ball_len_x * count_sin[ball_no] / count);
				if (no != 5) { mv_ball.x = (bx * chg_x * cx + img_cxs[ball_no]) };
				if (firstPoint == 1) { img_sps[ball_no].x = bx * chg_x * cx; }//中移動
				//螺旋X angle=3.6
				if (no == 5) {
					mv_ball.x = (Math.cos(angle5 * count_sin[ball_no] / count) * ball_len_x * count_sin[ball_no] / count) * chg_x * cx + img_cxs[ball_no];
				}
				
				//sin Y方向の計算
				mv_ball.radian += mv_ball.radian_v/count/stage.frameRate;
				if (no == 0) {
					mv_ball.y = img_cys[ball_no] + ((Math.sin(mv_ball.radian) * swing_y + by) * chg_y * cy);//外振幅プラス
				}
				if (no == 1) {
					(mv_ball.y = img_cys[ball_no] + (Math.sin(mv_ball.radian / 2) * swing_y * -1) * chg_y * cy);
				}
				if (no == 2) {
					mv_ball.y = img_cys[ball_no] +(Math.sin(mv_ball.radian / 2) * swing_y * chg_y * cy);
				}
				//bxの幅基準
				//cos Y方向の計算
				if (no == 3) {
					mv_ball.y = img_cys[ball_no] + (Math.cos(mv_ball.radian / 2) * bx * chg_y * cy);
				}
				//cos sinY/方向の計算振幅が減衰
				if (no == 4) {
					mv_ball.y = img_cys[ball_no] + ((Math.cos(mv_ball.radian / 2) - Math.sin(mv_ball.radian)) * bx * chg_y * cy);
				}
				//螺旋 angle=3.6
				if (no == 5) {
					mv_ball.y = img_cys[ball_no] + ((Math.sin(angle5 * count_sin[ball_no] / count) * ball_len_x * count_sin[ball_no] / count) * chg_y * cy);
				}
				
				//removeEventListener
				if (count_sin[ball_no] <= 0) {
					
					//グローバルカウント/反転するとカウントが正確でないのでこちらで判定
					gl_count ++;
					//回転0
					img_sps[ball_no].rotation = 0;
					mv_ball.rotation = 0;
					mv_ball.y = img_cys[ball_no];
					//スケール、アルファを戻す
					mv_ball.scaleX = 1;
					mv_ball.scaleY = 1;
					mv_ball.alpha = 1;
					
					//onEnterFrame削除、どちらでもOK
					//sin_balls[ball_no].removeEventListener(Event.ENTER_FRAME, onEnterFrame_sin);
					mv_ball.removeEventListener(Event.ENTER_FRAME, onEnterFrame_sin);
					//グローバルカウントで終了の判定、最後になったらボタン表示、終了処理に進む
					if (gl_count == photomax) { show_end(); }
				}
				
			}
		}
		
		//ball onEnterFrame OUT
		private function onEnterFrame_sinout(e:Event):void {
			//
			var count:Number = INTERPOLATE;//50
			//as Ballで問題なくコンパイル/thisは使えない
			var mv_ball:SinBall = e.currentTarget as SinBall;
			var ball_no:int = mv_ball.count_no;
			
			if (gl_count < photomax) {
				//回転rot_vをcountでわる
				mv_ball.rotation += rot_v / count;
				
				//小さいなら拡大/scaleUpするか判
				if (img_sps[ball_no].scaleX < scale_v && scaleUp) {
					img_sps[ball_no].scaleX += (scale_v - 1) / count;
					img_sps[ball_no].scaleY += (scale_v - 1) / count;
				}
				//大きいなら縮小
				if (img_sps[ball_no].scaleX > scale_v && !scaleUp) {
					img_sps[ball_no].scaleX -= (1 - scale_v) / count;
					img_sps[ball_no].scaleY -= (1 - scale_v) / count;
				}
				//alpha操作するなら
				if (alpha_flag) {
					mv_ball.alpha -= alpha_v / count;
				}
				
				//INTERPOLATE加算用配列
				count_sin[ball_no] += 1;
				
				//保存係数
				var cx:Number =	mv_ball._chg_x;
				var cy:Number =	mv_ball._chg_y;
				
				//X方向の計算
				var by:Number = (0 * count_sin[ball_no] / count);//まだ計算なし
				var bx:Number = (ball_len_x * count_sin[ball_no] / count);
				if (no != 5) {mv_ball.x = (bx * chg_x * cx + img_cxs[ball_no])};
				if (firstPoint == 1) { img_sps[ball_no].x = bx * chg_x * cx; }//中移動
				//螺旋X angle=3.6
				if (no == 5) {
					mv_ball.x = (Math.cos(angle5 * count_sin[ball_no] / count) * ball_len_x * count_sin[ball_no] / count) * chg_x * cx + img_cxs[ball_no];
				}
				
				//sin Y方向の計算
				mv_ball.radian += mv_ball.radian_v/count/stage.frameRate;
				if (no == 0) {
					mv_ball.y = img_cys[ball_no] + ((Math.sin(mv_ball.radian) * swing_y + by) * chg_y * cy);//外振幅プラス
				}
				if (no == 1) {
					(mv_ball.y = img_cys[ball_no] + (Math.sin(mv_ball.radian / 2) * swing_y * -1) * chg_y * cy);
				}
				if (no == 2) {
					mv_ball.y = img_cys[ball_no] + (Math.sin(mv_ball.radian / 2) * swing_y * chg_y * cy);
				}
				//bxの幅基準
				//cos Y方向の計算
				if (no == 3) {
					mv_ball.y = img_cys[ball_no] + (Math.cos(mv_ball.radian / 2) * bx * chg_y * cy);
				}
				//cos sinY/方向の計算振幅が減衰
				if (no == 4) {
					mv_ball.y = img_cys[ball_no] + ((Math.cos(mv_ball.radian / 2) - Math.sin(mv_ball.radian)) * bx * chg_y * cy);
				}
				//螺旋 angle=3.6
				if (no == 5) {
					mv_ball.y = img_cys[ball_no] + ((Math.sin(angle5 * count_sin[ball_no] / count) * ball_len_x * count_sin[ball_no] / count) * chg_y * cy);
				}
				
				//removeEventListener
				if (count_sin[ball_no] >= INTERPOLATE) {
					
					//文字の場合は重要だが、画像だからalpha=0はOK、visibleで操作しても良い
					mv_ball.alpha = 0;
					//グローバルカウント/反転するとカウントが正確でないのでこちらで判定
					gl_count ++;
					//回転0
					img_sps[ball_no].rotation = 0;
					mv_ball.rotation = 0;
					mv_ball.y = 0;
					//OUTだけの場合拡大のままだと影響があるので中も戻す
					img_sps[ball_no].scaleX = 1;
					img_sps[ball_no].scaleY = 1;
					//scaleを戻す
					mv_ball.scaleX = 1;
					mv_ball.scaleY = 1;
					//onEnterFrame削除
					mv_ball.removeEventListener(Event.ENTER_FRAME, onEnterFrame_sinout);
					//グローバルカウントで終了の判定、最後になったらボタン表示、終了処理に進む
					if (gl_count == photomax) { show_out_end(); }
				}
				
			}
		}
		
		//IN終了処理、タイマーセット
		private function show_end ():void {
			//グローバルカウントクリア
			gl_count = 0;
			tf.text = "SIN曲線 IN 完了、タイマーセット";
			//setTimeout
			var intervalId:uint = setTimeout(animate3, 4000);
		}
		//OUT終了処理
		private function show_out_end ():void {
			//グローバルカウントクリア
			gl_count = 0;
			
			
//1 ボタン表示する場合
tf.text = "OUT 完了、ボタンを押してください";
btn_1.visible = true;


//2 setTimeout有効にする場合 永遠にくりかえす
//tf.text = "OUT 完了、タイマーセット";
//var intervalId:uint = setTimeout(animate2, 2000);

		}
		
		//ERROR
		private function ioErrorHandler(event:IOErrorEvent):void {
			//ERROR処理
			tf.text = "LOADING-EROOR";
			
			//画像ERRORならカウントをすすめて次ぎ画像ロードに進む
			countImage ++;
			loadImage();
		}
		//LOADING回転
		private function step(evt:Event):void {
			indicator.rotation = (indicator.rotation + 360 / stage.frameRate) % 360;
		}
		
		//create-box
		private function createSquare(x:Number, y:Number, width:Number, height:Number, color:Number, alpha:Number):Sprite {
			var s:Sprite = new Sprite();
			s.graphics.beginFill(color, alpha);
			s.graphics.drawRect(x, y, width, height);
			s.graphics.endFill();
			//addChild(s);
			return s;
		}
		//create-text
		private function createTextField(x:Number, y:Number, width:Number, height:Number):TextField {
			var result:TextField = new TextField();
			result.x = x;
			result.y = y;
			result.width = width;
			result.height = height;
			//addChild(result);
			return result;
		}
		//create-RoundBTN/原点中央ボタンモードなど訂正
		private function createRoundBTN(text:String, t_size:int, t_color:uint, width:Number, height:Number, color:uint, alpha:Number, round:Number):Sprite {
			var rsbt:Sprite = new Sprite();
			rsbt.graphics.beginFill(color, alpha);
			rsbt.graphics.drawRoundRect(-width/2, -height/2, width, height, round);
			rsbt.graphics.endFill();
			addChild(rsbt);
			var r:TextField = new TextField();
			var fmt:TextFormat = new TextFormat('_ゴシック', t_size, null, null, null, null, null, null, TextFormatAlign.CENTER );
			r.defaultTextFormat = fmt;
			r.textColor = t_color;
			r.selectable = false;
			//r.autoSize = TextFieldAutoSize.LEFT;
			r.text = text;
			r.width = width;
			r.height = height;
			r.x = -width / 2;
			r.y = -height / 2 + 2;
			r.mouseEnabled = false;
			//buttonMode
			rsbt.buttonMode = true;
			rsbt.addChild(r);
			return rsbt;
		}
	}
}

//RoundBtnクラス/原点中央ボタンモードなど訂正
import flash.display.*;
import flash.utils.*;
import flash.text.*;
class RoundBtn extends Sprite {
	//
	public function RoundBtn(text:String, t_size:int, t_color:uint, width:Number, height:Number, color:uint, alpha:Number, round:Number):void {
			var rsbt:Sprite = new Sprite();
			rsbt.graphics.beginFill(color, alpha);
			rsbt.graphics.drawRoundRect(-width/2, -height/2, width, height, round);
			rsbt.graphics.endFill();
			addChild(rsbt);
			var r:TextField = new TextField();
			var fmt:TextFormat = new TextFormat('_ゴシック', t_size, null, null, null, null, null, null, TextFormatAlign.CENTER );
			r.defaultTextFormat = fmt;
			r.textColor = t_color;
			r.selectable = false;
			//r.autoSize = TextFieldAutoSize.LEFT;
			r.text = text;
			r.width = width;
			r.height = height;
			r.x = -width / 2;
			r.y = -height / 2 + 2;
			r.mouseEnabled = false;
			//buttonMode
			rsbt.buttonMode = true;
			rsbt.addChild(r);
	}
}

//SinBall運動クラス、文字のものをそのまま使用
//onEnterFrame処理の、個別の判定などに利用、ここに直接onEnterFrameを書いても良いのだが
import flash.display.*;
class SinBall extends Sprite {
	//番号
	public var count_no:Number;
	//回転方向 0=左 1=右
	public var direction:int;
	//逆転係数
	public var chgFlag:Number = 1;
	//逆転係数2
	public var _chg_x:Number = 1;
	public var _chg_y:Number = 1;
	//TEST
	public var radian:Number = 0;
	public var radian_v:Number = 180;
	//未使用
	private var _x:Number = 0;
	private var _y:Number = 0;

	public function SinBall() {
		var b:Sprite = new Sprite();
		//xy
		b.x = 0;
		b.y = 0;
		addChild(b);
	}
}

//LOADING-Shape
import flash.display.Shape;
class Indicator extends Shape {
	public function Indicator(){
		var i:uint,
		cx:Number, cy:Number,
		numNeedles:uint = 12,
		innerR:Number = 7,
		outerR:Number = 5,
		cAngle:Number = -Math.PI / 2,
		nAngle:Number;
		nAngle = Math.PI * 2 / numNeedles;
		for (i=0; i<numNeedles; i++){
			cAngle += nAngle;
			cx = Math.cos(cAngle) * innerR;
			cy = Math.sin(cAngle) * innerR;
			graphics.moveTo(cx, cy);
			cx = Math.cos(cAngle) * outerR;
			cy = Math.sin(cAngle) * outerR;
			graphics.lineStyle(2, 0xffffff, i/numNeedles);
			graphics.lineTo(cx, cy);
		}
	}
}

使用画像

1 画像80x60 2 3 4 5

以上のように、曲線で動かすのは大変です。普通に直線で、Tweenさせた方が簡単です。ライブラリを使用する手段もありますが、、。


サイン曲線で画像を動かす、シュミュレーションテスト

【参考】シュミュレーションテスト: サイン曲線で画像を動かすテストです2


以上です。



[ この記事のURL ]


タグ:flash , ActionScript , as3 , series

[ サイン曲線で画像を動かすテストです シリーズ記事 ]

サイン曲線で画像を動かすテストです/32012.04.24
サイン曲線で画像を動かすテストです/22012.04.22
サイン曲線で画像を動かすテストです/12012.04.21

 

ブログ記事一覧



[1]