# Page Flip/ TweenEvent.MOTION_FINISH problem...

• Newbie
• Posts: 14

3+ Months Ago

Hi,

I tried following this tutorial on youtube: "Adobe flash cs4 tutorial: 3d page flip"

Here's the original code:

Code: [ Select ]
import fl.transitions.Tween;
import fl.transitions.easing.Strong;
import fl.transitions.TweenEvent;
import flash.events.Event;

var isStill: Boolean=true;
var arrayTween: Array = new Array;

function onFlip(e:Event){
if (isStill) {
arrayTween.push(new Tween(con, 'rotationY', Strong.easeOut, con.rotationY, con.rotationY+180, 1, true));
isStill = false;
}
}

function reset(e:Event) {
isStill = true;
arrayTween = [];
}

function loop(e:Event) {
if (con.rotationY >= 90 && con.rotationY<=270) {
con.scaleX=-1;
}
else {
con.scaleX=1;
}
if (con.rotationY >=360) {
con.rotationY = 0
}
}
1. import fl.transitions.Tween;
2. import fl.transitions.easing.Strong;
3. import fl.transitions.TweenEvent;
4. import flash.events.Event;
8. var isStill: Boolean=true;
9. var arrayTween: Array = new Array;
10. function onFlip(e:Event){
11.     if (isStill) {
12.         arrayTween.push(new Tween(con, 'rotationY', Strong.easeOut, con.rotationY, con.rotationY+180, 1, true));
14.         isStill = false;
15.     }
16. }
17. function reset(e:Event) {
18.     isStill = true;
19.     arrayTween = [];
20. }
21. function loop(e:Event) {
22.     if (con.rotationY >= 90 && con.rotationY<=270) {
24.         con.scaleX=-1;
25.     }
26.     else {
28.         con.scaleX=1;
29.     }
30.     if (con.rotationY >=360) {
31.         con.rotationY = 0
32.     }
33. }

I used text on my pages, instead of images. I noticed that every time I click on the flip button, my text gets more out of focus. I tried to put some trace statement to see
what could be wrong. I noticed that as I enter frame, since the value of con.rotationY is 0, the function "loop", keeps looping and keeps adding the "sidea" to the stage(con.addChild(con.sidea);).

I decided to try something new. Keep in mind I am just learning AS3.

Here's the code I tried:

Code: [ Select ]
import fl.transitions.Tween;
import fl.transitions.easing.*;
import fl.transitions.TweenEvent;
import flash.events.Event;

// Add side a, as we start

// listen to see which flip side is clicked

var onSidea: Boolean=true;
var onSideb: Boolean=false;
var arrayTween: Array = new Array;
var rotationVal: Number = 180;

function onFlipa(e:Event){

arrayTween.push(new Tween(con, 'rotationY', Strong.easeOut, con.rotationY, con.rotationY+rotationVal, 1, true));

trace("outside reset");

rotationVal = -180;
con.scaleX=-1;
}

function onFlipb(e:Event){

arrayTween.push(new Tween(con, 'rotationY', Strong.easeOut, con.rotationY, con.rotationY+rotationVal, 1, true));

rotationVal = 180;
con.scaleX=1;
}

function reset(e:Event) {
trace("i am inside reset");

arrayTween = [];

/*if (onSidea == true){
trace("side a on reset");
rotationVal = -180;
con.scaleX=-1;
onSidea = false;
onSideb = true;
}
else {
trace("side b on reset");
rotationVal = 180;
con.scaleX=1;
onSidea = true;
onSideb = false;
}*/
}

1. import fl.transitions.Tween;
2. import fl.transitions.easing.*;
3. import fl.transitions.TweenEvent;
4. import flash.events.Event;
5. // Add side a, as we start
7. // listen to see which flip side is clicked
10. var onSidea: Boolean=true;
11. var onSideb: Boolean=false;
12. var arrayTween: Array = new Array;
13. var rotationVal: Number = 180;
14. function onFlipa(e:Event){
15.
16.         arrayTween.push(new Tween(con, 'rotationY', Strong.easeOut, con.rotationY, con.rotationY+rotationVal, 1, true));
17.
19.
20.         trace("outside reset");
21.
24.         rotationVal = -180;
25.         con.scaleX=-1;
26. }
27.
28. function onFlipb(e:Event){
29.
30.         arrayTween.push(new Tween(con, 'rotationY', Strong.easeOut, con.rotationY, con.rotationY+rotationVal, 1, true));
31.
33.
36.         rotationVal = 180;
37.         con.scaleX=1;
38. }
39. function reset(e:Event) {
40.     trace("i am inside reset");
41.     arrayTween = [];
42.
43.     /*if (onSidea == true){
44.         trace("side a on reset");
46.         rotationVal = -180;
47.         con.scaleX=-1;
48.         onSidea = false;
49.         onSideb = true;
50.     }
51.     else {
52.         trace("side b on reset");
55.         rotationVal = 180;
56.         con.scaleX=1;
57.         onSidea = true;
58.         onSideb = false;
59.         }*/
60. }
61.

These are the issues that I have with my version:

1- it of course does not rotate as the original version, which is a bummer, but I could live with it.
2- it still has the issue of loosing the text's sharpness as I keep clicking.
3- (this was the case with the original version as well) when I click fast on the reload button, the value of con.rotationY goes out of sync. (it should always be 0 & 180 in my version). So I thought I would move the code that sets the value of rotationVal to reset function. So I can also combine the functions that I have for each side into one function. But I noticed that every time I am on sidea, when I click the flip button, the TweenEvent.MOTION_FINISH is delayed. Basically my trace statement trace("outside reset") is displayed first before my trace("i am inside reset");

So I am kind of stuck. I don't know how to fix mine, nor how to fix the original version.

What I really don't understand is that why the text looses quality each time I click? I thought it's because of the number of addChild that was happening in the original code, but it happens in mine as well.

Thank you!!

## Post Information

• Total Posts in this topic: 1 post
• Users browsing this forum: No registered users and 5 guests
• You cannot post new topics in this forum
• You cannot reply to topics in this forum
• You cannot edit your posts in this forum
• You cannot delete your posts in this forum
• You cannot post attachments in this forum