トップへ戻るニュースフォーラムFLASH-ML 過去ログBak@Flaダウンロードよくある質問と答
ログイン
ユーザ名:

パスワード:


パスワード紛失

新規登録
メインメニュー
メイン
   コーダーズルーム【スクリプト系】
     Matrx3Dの反転後重ね順が狂う
投稿するにはまず登録を

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 スレッド
HIKAHIKA
Åê¹ÆNo.46631
投稿日時: 2010-12-25 17:39
新米
居住地:
投稿: 9
使用環境:
MacOS10.6, WinXP SP3
Flash CS5
Matrx3Dの反転後重ね順が狂う
現在こちらhttp://gihyo.jp/dev/serial/01/as3/0038で野中文雄さんが解説しているサンプルをもとに4面の立体物が反転する毎に絵が変わるというFlashを作成しています。

フェードイン
  ↓
しばらくして反転
  ↓
裏に回った面の絵を差し替え
  ↓
また反転
  ↓
正面の絵が変わっている
  ↓
以降繰り返し...

という風にしたいのですが、裏側に回った面の絵を削除して新たにaddChildAt(新MC,0)で深度0に追加して4面それぞれの深度を調べてみると深度が新MCの深度が思ったとこにきてくれません。

どこが悪いのでしょうか?わかる方いましたら教えてください。

自分がコーディングしたソースは別に投稿します。
HIKAHIKA
Åê¹ÆNo.46632
投稿日時: 2010-12-25 17:46
新米
居住地:
投稿: 9
使用環境:
MacOS10.6, WinXP SP3
Flash CS5
Matrx3Dの反転後重ね順が狂う - ASソース
ソースになります、記述したとこはルートタイムラインの1フレーム目です。ライブラリには6枚画像があってそれぞれ"Image1"?"Image6"とクラス名をつけています。


import fl.transitions.Tween;
import fl.transitions.TweenEvent;
import fl.transitions.easing.*;

//==============================================================
//変数設定
//==============================================================
var varTween:Tween;
var mySprite:Sprite = new Sprite();
var frontSprite:Sprite = new Sprite();
var backSprite:Sprite = new Sprite();
var leftSprite:Sprite = new Sprite();
var rightSprite:Sprite = new Sprite();
var nX:Number=stage.stageWidth/2;
var nY:Number=stage.stageHeight/2;

var picW:Number=100;//画像の横幅の半分
var picH:Number=100;//画像の縦幅の半分
var thickness:Number=2;//パネル厚みの半分

const max:int=6;//画像枚数
var nDeceleration:Number=2;
var cont:Number=0;

//==============================================================
//初期パネル表面作成
//==============================================================

frontSprite=xCreateFace(0,0,-thickness/2);
backSprite=xCreateFace(0,0,thickness/2,180);
leftSprite=xSideFace(- picW/2,0,0,90);
rightSprite=xSideFace(picW/2,0,0,-90);

//==============================================================
//ステージセット
//==============================================================
mySprite.z=0;
var myMatrix3D:Matrix3D=mySprite.transform.matrix3D;
mySprite.x=nX;
mySprite.y=nY;
mySprite.alpha=0;
addChild(mySprite);
mySprite.addChild(frontSprite);

//==============================================================
//フェードイン
//==============================================================
varTween=new Tween(mySprite,"alpha",None.easeNone,0,1,1,true);
varTween.addEventListener(TweenEvent.MOTION_FINISH,actionRoate);
function actionRoate(eventObject:TweenEvent):void {

	mySprite.addChild(backSprite);
	mySprite.addChild(leftSprite);
	mySprite.addChild(rightSprite);
	mySprite.setChildIndex(frontSprite,3);

	timerRotate();

}

//==============================================================
//反転タイマー
//==============================================================
function timerRotate():void {
	
	var rotateTimer:Timer=new Timer(getRam()*1000,1);
	rotateTimer.addEventListener(TimerEvent.TIMER, actionRotate);
	rotateTimer.start();
	function actionRotate(e:TimerEvent):void {
		addEventListener(Event.ENTER_FRAME, xRotate);
	}

}

//==============================================================
//タイマーイベント時間間隔ランダム取得
//==============================================================
function getRam(maxSec:uint=6, minSec:uint=3):Number {

	var ramFadein:uint=Math.floor(Math.random()*(maxSec-minSec+1))+minSec;
	return ramFadein;

}

//==============================================================
//立体パネル表面作成 - 表裏面
//==============================================================
function xCreateFace(nX:Number, nY:Number, nZ:Number, nRotationY:Number = 0):Sprite {

	var gotRam:int=(Math.floor(Math.random()*6)+1;
	var imgName:String="Image"+gotRam;
	var imgClass:Class=getDefinitionByName(imgName) as Class;

	var myBitmap:Bitmap=new Bitmap(new imgClass(0,0));
	var faceSprite:Sprite = new Sprite();
	faceSprite.addChild(myBitmap);
	myBitmap.x=- myBitmap.width/2;
	myBitmap.y=- myBitmap.height/2;
	faceSprite.x=nX;
	faceSprite.y=nY;
	faceSprite.z=nZ;
	faceSprite.rotationY=nRotationY;
	return faceSprite;

}

//==============================================================
//立体パネル表面作成 - 側面
//==============================================================
function xSideFace(nX:Number, nY:Number, nZ:Number, nRotationY:Number = 0):Sprite {

	var sideSprite:Sprite=new Sprite();
	var spriteGraphics:Graphics=sideSprite.graphics;
	spriteGraphics.beginFill(0xECF0F4);
	spriteGraphics.drawRect(0, 0, thickness, picH);
	spriteGraphics.endFill();
	
	var faceSprite:Sprite = new Sprite();
	faceSprite.addChild(sideSprite);
	sideSprite.x=- sideSprite.width/2;
	sideSprite.y=- sideSprite.height/2;
	faceSprite.x=nX;
	faceSprite.y=nY;
	faceSprite.z=nZ;
	faceSprite.rotationY=nRotationY;
	return faceSprite;
	
}

//==============================================================
//反転関数
//==============================================================
function xRotate(eventObject:Event):void {

	cont+=nDeceleration;
	myMatrix3D.appendTranslation(-nX, -nY, 0);
	myMatrix3D.appendRotation(nDeceleration, Vector3D.Y_AXIS);
	myMatrix3D.appendTranslation(nX, nY, 0);
	xSetOrder();
	if (cont>=180) {
		removeEventListener(Event.ENTER_FRAME, xRotate);
		cont=0;
		//timerRotate();
		backFaceSet();
	}

}

function xSetOrder():void {

	var faces_array:Array = new Array();
	var nChildren:uint=mySprite.numChildren;
	for (var i:uint = 0; i < nChildren; i++) {
		faces_array.push(mySprite.getChildAt(i));
	}
	faces_array.sort(compare);
	for (var j:uint = 0; j < nChildren; j++) {
		var faceSprite:Sprite=faces_array[j];
		mySprite.setChildIndex(faceSprite, j);
	}

}

function compare(a:Sprite, b:Sprite):Number {

	var nA:Number=a.transform.getRelativeMatrix3D(this).position.z;
	var nB:Number=b.transform.getRelativeMatrix3D(this).position.z;
	if (nA<nB) {
		return 1;
	} else if (nA > nB) {
		return -1;
	} else {
		return 0;
	}

}

//==============================================================
//反転後裏面セット
//==============================================================
function backFaceSet():void {
	var frontIndex:int=mySprite.getChildIndex(frontSprite);
	var backIndex:int=mySprite.getChildIndex(backSprite);

	if(frontIndex<=0) {
		mySprite.removeChildAt(0);
		frontSprite=xCreateFace(0,0,thickness/2,180);
		mySprite.addChildAt(frontSprite,0);
	} else if (backIndex<=0) {
		mySprite.removeChildAt(0);
		backSprite=xCreateFace(0,0,thickness/2,180);
		mySprite.addChildAt(backSprite,0);
	}
	timerRotate();
}
ひろゆき
Åê¹ÆNo.46633
投稿日時: 2010-12-25 18:45
ちょんまげら
居住地: 東京砂漠
投稿: 4403
使用環境:
10.8.5

Flash Professional CS4/CS6/CC

Safari 6.1
Re: Matrx3Dの反転後重ね順が狂う - ASソース
スクリプトは、見やすいように、[code][/code]で囲んで、掲載しましょう。
また、スクリプトはコードを貼り付けるだけでなく、
どこに記述したとか、どんなインスタンスをどこに配置してあるかの情報も必要です。
第三者が再現しやすいような説明を心がけてください。

例えば、mz_flash.ASclass.GetRandomClass というクラスは、ここには見当たりませんが、
「探してこい」ということなんでしょうか?


----------------
質問する際は、回答者に具体的な情報を与えてください。

野中文雄
Åê¹ÆNo.46634
投稿日時: 2010-12-25 23:08
ちょんまげら
居住地: 東京
投稿: 4531
使用環境:
CS5.5 .6.8 Vista Home Premium (SP1)
Re: Matrx3Dの反転後重ね順が狂う - ASソース
まずは、問題を単純化することが大切でしょう。引用いただいた連載でも、まさにつぎのようにご説明しました。

「z座標値に応じて重ね順を変える」3ページより引用:
この実習からわかるように,まず仕組みや構成を初めによく考えておくことが大切だ。そしてつぎに,1面から2面,そして4面というように,簡単なつくりから,順を追って複雑にすることである。

フォーラムなどで,いきなり6面体を上下左右に回そうとして,どうしたらいいかわかりません,というような質問がある。しかも往々にして,スクリプトはどこかのサンプルのコピー&ペーストで,中身がわかっていなかったりする。遠回りなようでも,理解と試行をひとつひとつ着実に積重ねていくことが王道だろう。


----------------
 

HIKAHIKA
Åê¹ÆNo.46635
投稿日時: 2010-12-26 2:13
新米
居住地:
投稿: 9
使用環境:
MacOS10.6, WinXP SP3
Flash CS5
Re: Matrx3Dの反転後重ね順が狂う - ASソース
野中さん、ありがとうございます。
4面のz軸を調べてみたところ最初に設定したのが"正面.z=-1、裏面.z=1、左面.z=0、右面.z=0"が
反転後では"正面.z=1、裏面.z=1、左面.z=0、右面.z=0"で正面と裏面のz軸が同じであったのが原因でした。
そこでソースを以下のように修正したら無事思い通りに動きました!!


//==============================================================
//反転後裏面セット
//==============================================================
function backFaceSet():void {
	var frontIndex:int=mySprite.getChildIndex(frontSprite);
	var backIndex:int=mySprite.getChildIndex(backSprite);

	if(frontIndex<=0) {
		mySprite.removeChildAt(0);
		frontSprite=xCreateFace(0,0,-thickness/2,180);//← -thickness/2に修正
		mySprite.addChildAt(frontSprite,0);
	} else if (backIndex<=0) {
		mySprite.removeChildAt(0);
		backSprite=xCreateFace(0,0,thickness/2,180);
		mySprite.addChildAt(backSprite,0);
	}
	timerRotate();
}
野中文雄
Åê¹ÆNo.46638
投稿日時: 2010-12-26 3:24
ちょんまげら
居住地: 東京
投稿: 4531
使用環境:
CS5.5 .6.8 Vista Home Premium (SP1)
Re: Matrx3Dの反転後重ね順が狂う - ASソース
ひろゆきさんもいわれたとおり「再現」つまり試すことができないので、ご説明と修正されたというスクリプトを拝見した範囲で申し上げます。

おやりになりたいのは、「面の絵を差し替え」ることで、面のSpriteインスタンスを替えなくてもよいのではないでしょうか。ビットマップ(BitmapDataオブジェクト)だけ差替えて、面のインスタンスの重ね順は関数xSetOrder()に任せれば、重ね順や座標の問題が起こる可能性そのものを避けられます。

[ライブラリ]にクラス名がImage0とImage1のビットマップを納めて、つぎのフレームアクションを記述すれば、インスタンスへのクリックでふたつのビットマップが切り替わります。
var mySprite:Sprite = new Sprite();
var images_array:Array = [Image0, Image1];
var nID:uint = 0;
var myBitmap:Bitmap = new Bitmap();
addChild(mySprite);
mySprite.addChild(myBitmap);
mySprite.addEventListener(MouseEvent.CLICK, xSetBitmap);
xSetBitmap(null);
function xSetBitmap(eventObject:MouseEvent):void {
	myBitmap.bitmapData = new images_array[nID++]();
	nID %= images_array.length;
}


----------------
 

HIKAHIKA
Åê¹ÆNo.46642
投稿日時: 2010-12-26 23:56
新米
居住地:
投稿: 9
使用環境:
MacOS10.6, WinXP SP3
Flash CS5
さらに修正
野中さん>
そうですねビットマップを入れているスプライトまで削除する必要はなかったですね。

ビットマップだけ入れ替えてみました、これでまたスッキリしました。

//==============================================================
//反転後裏面セット
//==============================================================
function backFaceSet():void {
	var frontIndex:int=mySprite.getChildIndex(frontSprite);
	var backIndex:int=mySprite.getChildIndex(backSprite);
	
	var gotRam:int=ramClass.getRandomNum(max)-1;
	var imgName:String="Image"+gotRam;
	var imgClass:Class=getDefinitionByName(imgName) as Class;
	var myBitmap:Bitmap=new Bitmap(new imgClass(0,0));

	if(frontIndex<=0) {
		frontSprite.removeChildAt(0);
		frontSprite.addChild(myBitmap);
	} else if (backIndex<=0) {
		backSprite.removeChildAt(0);
		backSprite.addChild(myBitmap);
	}
	
	myBitmap.x=-myBitmap.width/2;
	myBitmap.y=-myBitmap.height/2;

	timerRotate();
}


※ramClass.getRandomNum(max)は自分が作った重複しないランダム数値を取得するクラスの関数です。
スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ

投稿するにはまず登録を
 
Copyright (C) 2003 FLASH-japan. All rights reserved.
Powered by Xoops