AS3 Flip effect leaving a trail? - actionscript-3

I'm trying to create something with a flip effect tutorial from tutplus - http://active.tutsplus.com/tutorials/effects/iphone-page-transition-flash/
However my flip area is much bigger than the tutorial, it's 900px wide. Everything works fine except that it leaves a trail when the width is that big. You'll see it when you flip it a few times.
Someone else posted the same problem in the comments from last year, but no one replied.
Does anyone know a solution to this?
Edit:
Here is a screen shot: http://imageshack.us/f/823/unled2lo.jpg/ (click to enlarge)
The front is purple and the back is white.
As you can see it left a bit of the purple as the page flipped to white.
I couldn't get a screen shot of it turning, but it's even more obvious as the page is actually flipping because the width become narrow which reveals a whole lot more that's left behind on the page.

The tutorial you are using create the flip effect using the build in flash tween classes, they are absolute rubbish, and very slow if you compare to other third part tween classes. That may be causing the trail! Lee Brimelow has a great video tutorial about how to do exact what you need: http://gotoandlearn.com/play.php?id=91 he is using caurina, but I highly recommend you to replace it with tweenLight so far the best tween I ever used.
Ok, thats the walkthrough:
1- Download the files from Lee Brimelow tutorial here http://gotoandlearn.com/files/3dflip.zip
2- Download tweenLight AS3 classes here: http://www.greensock.com/tweenlite/
3- copy the com folder inside greensock-as3 and past it inside 3dflip folder. Now you have all the tween classes you need for your flip!
4- open the flash file 3dflip.fla and replace the original code (located in the first frame) with this:
import com.greensock.TweenLite;
import fl.video.*;
con.visible = false;
var flv:FLVPlayback = con.vid.flvp;
flv.addEventListener(VideoEvent.PLAYING_STATE_ENTERED, onStart);
function onStart(e:Event):void
{
con.visible = true;
loading.visible = false;
}
con.vid.spin.addEventListener(MouseEvent.CLICK, cl);
con.tclip.spin.addEventListener(MouseEvent.CLICK, cl);
var isTurning:Boolean = false;
function cl(e:Event):void
{
if(!isTurning)
{
TweenLite.to(con, 1, {rotationY:con.rotationY+180, onComplete:function(){isTurning=false;}});
isTurning = true;
}
}
addEventListener(Event.ENTER_FRAME, loop);
function loop(e:Event):void
{
if(con.rotationY > 90 && con.rotationY < 270)
con.addChild(con.tclip);
else
con.addChild(con.vid);
if(con.rotationY >= 360) con.rotationY = 0;
}
Thats it. Now publish and see the result. Now all you have to do is replace the video player with the content that you want!

I would check the state of first side - it seems that it's forgotten on stage when "the other side" kicks in.

Related

Action Script 3. Multiple stages are like 1

I'm creating a simple flash game, where characters move on the groundwith some stages to jump over.
The problem is all the stages are acting as 1 object, which can make the character appear like it's flying in the air:
All stages are called: ground3
Here is part of code where the character jumps and stay on the ground:
if(Hero.y_speed>0 && Hero.hitTestObject(ground3)){
Hero.y_speed=0;
if(space){
trace("You clicked SPACE");
Hero.y -= 80;
}
Have you any ideas how to fix this?
Use external libraries for your purposes, like
this one.
Here is described, how to use it (you can find there also other useful informations).
import com.coreyoneil.collision.CollisionList;
var myCollisionList:CollisionList = new CollisionList(hero);
//add all stages separately
myCollisionList.addItem(stage[1...n]);
if(myCollisionList.checkCollisions().length > 0) {
//colision detected
}

Stop MouseEvent-propagation of displayList views to starling views

I'm creating a game that uses the starling-layer (the game itself) and the classic display list which contains several Popups and Stuff like that.
I have one thing that troubles me:
If MouseEvents are generated on displayList-elements they always go through to the starling layer and produce TouchEvents etc. which is quite annoying.
I was wondering there is some general (and easy to use) approach to handle that.
One possibility was to listen on all displayList-Elements for the following Events:
interfaceElement.addEventListener(MouseEvent.MOUSE_MOVE, stopPropagationHandler);
interfaceElement.addEventListener(MouseEvent.MOUSE_DOWN, stopPropagationHandler);
interfaceElement.addEventListener(MouseEvent.MOUSE_UP, stopPropagationHandler);
private function stopPropagationHandler(e:MouseEvent):void {
e.stopPropagation();
}
But this looks quite nasty to me.
And even if I did it like that, I have one more issue:
If a starling-element is below that display-list-element and if it has a TouchEvent.TOUCH for rollover-behavior >> the rollover-appearance will not be removed from the starling if you hover over the display-list-element.
I also thought about putting a dummy-starling element behind every display-list-element,... to stop the events.. but that all sounds a bit "over-complicated" for such a "simple" task.
Or am I missing something?
A hint would be much appreciated.
Thanks.
You could create 1 main container in the displaylist (not the stage) and listen for ROLL_OVER and ROLL_OUT, and set somekind of global flag there, that your mouse is over the display-list container. Then in your starling events, check for this flag. This isn't the nicest solution out there i guess, but it should work
var isOverDisplayList:Boolean = false;
container.addEventListener(MouseEvent.ROLL_OVER, onRollOver);
container.addEventListener(MouseEvent.ROLL_OUT, onRollOut);
function onRollOver(e:MouseEvent) {
isOverDisplayList = true;
}
function onRollOut(e:MouseEvent) {
isOverDisplayList = false;
}

why is only one actionscript working at a time?

I'm new to Flash and trying to build a very simple game involving moving one movieclip using arrowkeys and avoiding three other movie clips. There is also a start button on the first frame. Each individual actionscript works by itself as long as the other 4 are commented out. But as soon as I try to use more than one actionscript, none of them work. I have each actionscript in it's own layer.
I'm sure it's something obvious I'm missing , but how do multiple actionscripts at the same time work?
Any thanks would be greatly appreciated
Here's the code
/*Start*/
import flash.events.MouseEvent;
stop();
btn1.addEventListener(MouseEvent.CLICK,buttonClickHandler);
function buttonClickHandler(event:MouseEvent):void{
gotoAndPlay(2);
}
/*Drive*/
function hearKey(yourEvent:KeyboardEvent):void{
if (yourEvent.keyCode==Keyboard.RIGHT){
LionOne_mc.x += 8;
};
if (yourEvent.keyCode==Keyboard.LEFT){
LionOne_mc.x -= 8;
};
if (yourEvent.keyCode==Keyboard.UP){
LionOne_mc.y -= 8;
};
if (yourEvent.keyCode==Keyboard.DOWN){
LionOne_mc.y += 8;
};
};
stage.addEventListener(KeyboardEvent.KEY_DOWN,hearKey);
/*Colision*/
kangaTwo.addEventListener(Event.ENTER_FRAME,LionHit2);
function LionHit2(event:Event):void {
if (kangaTwo.hitTestObject(LionOne_mc)) {
tackle_mc.visible = true;
} else {
tackle_mc.visible = false;
}
}
You can have scripts across multiple layers in a frame. There is no problem with that. They will just run from top most layer, to the bottom.
Although it is technically possible, I would not recommend it. Timeline code is messy at the best of times, so it is best to keep it all in one layer. It is also best practice for this layer to be at the top, with no visual element on it, and for the layer to be named "Actions".
If you are calling gotoAndStop(2);, then all the code on frame one will stop running.
When you get the chance you should definitely look at using external ActionScript classes, rather than writing timeline code. There is a great tutorial here: active.tutsplus.com - AS3 101: OOP Introduction – Basix

AS3 Loader doesn't unload after game reset

you have always been of great help for me throughout the last few years.
I could always find a solution to my programming problem.
This time however I couldn't find a solution to this one.
Although there are a few topics which discuss Loaders. Mine is a lot different.
The problem:
In the first game screen I load a movie (a movie converted to .swf).
And after I switch to the next state, it unloads and doesn't display any more.
At the end of the game I execute my own made reset function (which has not much to do
with the loader whatsoever, it just resets some static variables) and the game switches
to the first state.
The Loader once again shows up. But now when I switch states, the Loader is still displaying.
Note: I am using the flixel library. Although I don't think it makes a big difference in this case (though I figure it problably does since I still have the problem :P).
I have only placed the important code. I have three buttons. Let's say I push. the third button. In the switch case I enter case 2.
The reset function is a flixel function: FlxG.resetGame() but I figure it doesn't really
matter.
I hope this is enough information for someone to see the problem/solution.
Thanks in advance.
Here's the code:
AMCInlog.as
private var my_loader:Loader;
private var my_player:Object;
public function AMCInlog()
{
imgBackground = new FlxSprite(0, 0, Resources.imgStartMenuBackground);
add(imgBackground);
my_loader = new Loader();
my_loader.x = 40;
my_loader.y = 156;
my_loader.scaleX = 1.2;
my_loader.scaleY = 1.2;
//loadUserData();
moviePlayerSequence();
//userData.clear();
//createButtons();
}
private function moviePlayerSequence():void {
var request:URLRequest = new URLRequest("DGAME Movie.swf");
my_loader.load(request);
FlxG.stage.addChild(my_loader);
}
private function currentButtonFunction():void {
switch(currentButton) {
case 0:
my_loader.unloadAndStop();
FlxG.stage.removeChild(my_loader);
FlxG.switchState(new AMCRegister());
break;
case 1:
my_loader.unloadAndStop();
FlxG.stage.removeChild(my_loader);
FlxG.switchState(new AMCExistingAccountLogin());
break;
case 2:
my_loader.unloadAndStop();
FlxG.stage.removeChild(my_loader);
FlxG.switchState(new AMCPreferences());
break;
default:
break;
}
}
You never reset your loader, hence it just holds onto what it loaded last time, either simply try and reset (or re-initiate actually) your loader like so (not the best method (will go into flash garbage-collection which has never been that awesome) but hey, it works)
my_loader = new Loader();
Or (since i dont see it) try using simply unload(); instead of unloadAndStop(); (since well, you dont need to stop it, if you unload it properly, its gone anyway)
Good luck!

AS3 Not Adding Sprite to MovieClip

My code is simply looping through an xml file and creating 'pages' (which are later animated).
This has all worked fine but now I want to add a sprite over the entire contents of the page if the contents of the xml contain a URL.
At run-time I can see that the checks for the URL are being processed correctly and that the overlay is being generated, but I cannot "see" it on the page.
The following code is located in a for loop for every page in the xml file:
var page:Page = new Page(); //MovieClip in my library
// ... other stuff
var textMC:FadeText = new FadeText(xml); //load the text from the xml fragment for this page
//if the text contains a URL (using RegExp)
if(textMC.hasLink())
{
var button:Sprite = new Sprite();
button.graphics.beginFill(0x000000);
button.graphics.drawRect(0, 0, 1, 1);
button.name= textMC.getLink();
button.x = button.y = button.alpha = 0;
button.width = rectangle.width;
button.height = rectangle.height;
button.buttonMode = true;
button.addEventListener(MouseEvent.CLICK, goToUrl, false, 0, true);
page.addChildAt(button, page.numChildren);
}
//... more code - such as add page to stage.
From the console (using FireBug and FlashBug) the button is being created, but I cannot see it on screen so I am guessing the addChild bit is at fault.
What is wrong and how do I fix it?
[edit]
Having set the alpha to 1 I can see that the overlay IS being added to the page, but it is not changing my cursor or responding to mouse clicks.
I now believe it is something wrong with the XML. It is correctly parsed XML (otherwise FlashPlayer would throw exceptions in my face) and it appears that this code works on every page except the second. Further more, if the second page is set as visible (a flag in the XML determins if the page is created or not) then none of the other pages overlay works.
Sorry to necro this thread but one thing I can think of is that because you specify a z-position to place your page it might be that the z-position generated by (i+1) is not the next one in line. AS3 doesn't allow display-objects to be placed on 'layers' with empty 'layers' between them which was allowed in AS2.
My guess is that during the loop at one point or another the loop doesn't generate a page which leaves an empty layer. The reason why the stage.addChild(page) actually works is because it simply searches for the next empty layer in that stack because you don't specify it.
button.x = button.y = button.alpha = 0;
set alpha to 1
button.alpha = 1;
and check for rectangle.width , rectangle.height
last thing, check for textMC.hasLink() if its true or not. If its true, there is another problem with your code that is not related to this sample code.
Illogical answer:
Replaced stage.addChildAt(page,i+1); with stage.addChild(page);.
I was clutching at straws. Have spent FAR too long working on this blip, but it works! I don't know WHY it works, and at this point I don't care; IT WORKS!!! (sorry for the unprofessionalism however I have spent two and a half days working on this and have just got it working!)
If someone wants to explain why it works, feel free. I would VERY much prefer to learn why this occurs that struggle to work around it.