Slowing down looping animation as3 - performance

This is the first time I've ever posted in a forum, so thanks in advance for anyone who takes the time to read/answer this question.
What I'm trying to create is basically a flipping coin animation, which starts off turning very fast and then slows down to stop with a (randomly generated) side facing upwards after about 8 seconds.
I've done the animation of a complete flip, which lasts about half a second, and made it in to a movieclip... now I'm stuck!
Any ideas how I might go about doing this in actionscript3?

The fastest way around this would be to use some very basic actionscript. First, create 2 animations (One heads, one tails). Now, you only need a single frame for this and don't need to place the movieclips on the stage. Use the following or similar code:
var whichSide:int = 0;
var coin1:coinAnimation1 = new coinAnimation1();
var coin2:coinAnimation2 = new coinAnimation2();
whichSide = math.Round(math.Random(1));
if(whichSide == 1)
{
addChild(coin1);
}
else
{
addChild(coin2);
}
Just don't forget to right click the movieclip and export for actionscript, giving the movieclips the class of: coinAnimation1 and coinAnimation2.
Hope this helps.

I've accomplished such animation on ´Keyframes´ using the Tweener class. You can easily tween on the keyframe parameter with specific transition...
Basic example:
Tweener.addTween(myMovieClip, {_frame:10, time:2.5});
More information about Tweener here

Related

Smooth animation of three shapes in SciLab

This answer provides a nice way to make smooth animations in SciLab. I now have to write a simulation of a body attached to two strings (and therefore its movement regarding some additional forces).
The code in the link works well to render movement of a single point and, unfortunately, I didn't manage to make an animation of a point + two lines using this method. If someone is curious, I tried this code to do it:
frametime=(tk-t0)/Nt//defining the waitnig time
plot(Y(1,1),Y(2,1),"o")//plotting the point
plot([0;Y(1,1)],[0;Y(2,1)],style=1)
plot([D;Y(1,1)],[0;Y(2,1)],style=1)//plotting the two initial lines
h1_compound = gce();
h_point=h1_compound.children
h_point.mark_size = 20;
h_point.mark_background = 2;
h_line1=h_compound.children
h_line2=h_compound.children
//h_axes = gca();
//h_axes.data_bounds = [0,-1;10,1];
realtimeinit(frametime);
for i=1:Nt//my vectors have Nt points
realtime(i);//wait "frametime" seconds before drawing the new position
h_point.data=[Y(1,i),Y(2,i)];
h_line1.data=[[0;Y(1,i)],[0;Y(2,i)]]
h_line2.data=[[D;Y(1,i)],[0;Y(2,i)]]
end
The question is: is there any way to make an animation of three shapes without making axes blink (as it is with the window refreshment) or other wierd stuff?
Since you didn't create a MCVE I can't reproduce your exact problem. But you may try to add drawlater(); before, and drawnow(); after your data modification to see if it does help with blinking or not.
Or you may get much better looking result by saving your plots in every round with xs2gif and assemble the animation with another gifmaker progam (there are free online sites to do this, however with some limitations). If you need to present your result, you should do this step anyway.

Javafx : setRotate and setTranslate in a for loop

I'm new to JavaFX and encountered a problem with the rotating animation while trying to write a Rubik's cube solving program.
I know JavaFX provides some classes for the animation ,but instead of using them, I wanted to try my own approach initially.
Following is the rough idea of my code :
for(90 times)
{
cube.setRotate(cube.getRotate() + 1);
try{Thread.sleep(100);}
catch{InterruptedException e) {Thread.currentThread().interrupt();}
}
By rotating the cube only one degree at a time and using time delay and loop appropriately, I expected to see something similar to rotating animation.
But the result I get is that the cube in the screen doesn't change with each setRotate() in the for loop, it only changes after the loop is over and therefore it changes 90 degrees at one time after 90*100 milliseconds.
I'm wondering if there is a method that can refresh the output in the screen each time using the setRotate() method.
Why do you want to avoid the mechanisms which are designed to make animations. Don't you think there is a reason that they exist?
With your code you are blocking the JavaFX application thread and the resulting behaviour is described in all documents dealing with this issue.

How to get the world position of vertices on objects changed position

I searched around in SO to see if someone had a jsbin of the likes to show an example of this question so please forgive if this seems over asked.
Using r67 & r68
I have a simple THREE.Line named 'laser' that I move in some fashion, in this example I move and rotate it by mouse. Where ever the laser is I want to get the world cords of its vertices [0,1] so later I can attach a ray caster to those world cords.
I assume i'm just missing a core function that i'll dig through the source code and try to find. Hope this helps someone else in the future when I can update the jsbin.
Right now I just get its starting positions of 0,20 despite the matrix updates and such.
In the jsbin I left in some other commented out tries of code from other posts online.
Update: might have figured it out!
function render(){
// test finding the lasers vertices
laser.updateMatrixWorld(true);
// move laser
laser.rotation.z = MousePosition.x /50;
laser.position.x = MousePosition.x;
laser.position.y = MousePosition.y;
// which of these is needed?
laser.matrixWorldNeedsUpdate = true;
lasergeo.verticesNeedUpdate = true;
// --> this line looks to work
point1 = laser.localToWorld( lasergeo.vertices[1].clone() );
// console.log("point1", point1);
}
old
http://jsbin.com/yuqocemigacu/1/edit?html,js,console,output
new:
http://jsbin.com/yonaquzufeje/1/edit?html,js,output
In the new the refresh update skips the connection but thats another issue for another day.
Leaving this open cause I don't know if I have the correct method of doing this, could be do 900 matrix calculations and don't know it yet.

code involving fading, time and sound

I am a student learning to become a comic artist.
Now we have this course called "Media" in wich we have to make an interactive program using a program called processing.
I have to show this to a jury in 2 days but I am litteraly stuck with these codes for the past 3 weeks, I just can't get it to work the way I want it to, so here I ask you if anyone would be able to help me with this.
What I want to make :
Basically I wanted it to be interactive without being interactive, So I tried to accomplish this by making a Buddha-themed program.
So what does it have to do? I think it shouldn't be all that hard, all I want it to do is take the amount of sound it gets, and when the sound is below a certain amount, the screen, wich is completely white, will start fading to black, whenever there is sound it will rapidly become white again.
So after 30 seconds of no sound it should be completely black and it should go into a new mechanism where it will start fading the black screen ( there is a picture with the word "emptyness" behind it ) so that word should start becoming visible very slowly ( approx 30 seconds again ) then when that picture is completely visible it should start fading again and start showing a picture of a buddha ( wich is behind that picture with the word ) and that's all I want it to do.
So now I will show you what I have, I've got the screen fading whenever it's really quite, but that's where I get stuck, I don't know how to set the timer, how to set the images behind it etc :
import ddf.minim.*;
Minim minim;
AudioInput in;
PImage img;
int a = 125;//sound value
int fade = 0;//starting fade, big fade is darker
int stmin = 2; //fadestep darker
int stplus = 20; //fadestep lighter
float gw = 0.001;//sensitivity smaller = more sensitive
void setup() {
img = loadImage("emptyness.jpg");
background(0);
size(1000, 1000);
frameRate(10); // Maximum 30 frames/images per second
minim = new Minim(this);
// get a line in from Minim, default bit depth is 16
in = minim.getLineIn(Minim.STEREO, 640);
}
void draw() {
image(img, 10,10);
fill(255);
rect(0,0,1000,1000);
if (abs(in.left.get(a))> (gw)) {
fade = fade-stplus;
}
else {
fade = fade+stmin;
}
fade = constrain(fade,0,300);
fill(0,fade);
rect(0,0,1000,1000);
}
void stop()
{
// always close Minim audio classes when you are done with them
in.close();
minim.stop();
super.stop();
}
I really hope someone can help me with this for posting this here really is my last resort, I have only 2 days left untill my jury, i've been trying, getting crashes, and the worst thing of all, I really don't understand anything about java or processing cause we never got any lessons about it, they just expected us to 'find out ourselves'
thanks for reading this, and hopefully someone can help me
greetz and lots of thanks in advance
The advice I gave you on the Processing forum still stands: You have to break your problem down into smaller individual steps and take on those steps one at a time instead of trying to tackle the whole thing at once.
Can you create a simple sketch that just fades to black after 30 seconds?
Can you create a simple sketch that fades to black after 30 seconds, but then fades back to white when you click the mouse?
Can you create a simple sketch that shows you whether it can hear sound?
Now can you combine those ideas to create a sketch that fades to black after 30 seconds, but fades back to white when it hears a sound?
This might seem like a lot for 2 days (and that's a lesson in time management), but you'll have better luck if you take a step back and focus on one small thing at a time instead of your whole project. That will also allow you to ask more specific questions, as this one is too broad to really answer without doing your homework for you. And you don't want to cheat, do you?

Can be smoothing image in a loaded SWF?

I'm trying to load an SWF into another in AS3/Haxe. The loaded SWF contains some images - but only on some Shape.graphics elements. (Like graphics.beginBitmapFill(); ...)
This images are not smoothed, and jaggy.
Can this images be smoothed anyhow during runtime?
Any hack interested! :)
Thanks in advance!
Tom
Update: Sorry, but I forget to mention, that I'm loading more AS2-SWFs (AVM1) into one AS3-SWF (AVM2) with AVM2Loader, which hack the loaded bytes, and convert the AVM1 SWFs into AVM2 - it works very well. :)
So, in these SWFs I need to find the images/bitmaps, but only found the Shapes, which graphics elements has the 'images'. If I clear this graphics, then all images are gone, so I think, the images are in some graphics.beginBitmapFill(...);, without smoothing. I want to reach them, and switch smoothing on at runtime, if possible.
(Sorry, if the first time I was not enough clear.)
Edit (Jan 23 '14): I found solution for it. It is not fast, and required Flash Player 11.6. Every MovieClip graphics properties has a new readGraphicsData function, which give all the graphics commands (Vector IGraphicsData) to draw the whole MC. And iterate in these commands, if I change every bitmapFill command smooth parameter to true, and redraw the MC, it will be smoothed, and nice.
That's it. Not fast, but working.
I found solution for it. It is not fast, and required Flash Player 11.6. Every MovieClip graphics properties has a new readGraphicsData function, which give all the graphics commands (Vector IGraphicsData) to draw the whole MC. And iterate in these commands, if I change every bitmapFill command smooth parameter to true, and redraw the MC, it will be smoothed, and nice.
That's it. Not fast, but working.
function onLoad(event):Void
{
pic.forceSmoothing = true;
}
Smoothing is a property of bitmaps that's off by default.
var image = new Bitmap(bitmapData);
image.smoothing = true;
Typically, your bitmapData will be in the loader.content.bitmapData when loading externally, but it's up to you were you've stored it.
Update:
If you want to smooth all images in a loaded SWF without any knowledge of the structure of the SWF, then you'll have to recursively dig through the hiarchy of that SWF, and depending on whether or not the object is a Bitmap, turn on smoothing.
function recursivelySmooth(obj):void {
for (var i:int = 0; obj.getChildAt(i); i++) {
var item:* = obj.getChildAt(i);
if (item is Bitmap) {
item.smoothing = true;
} else if (item.hasOwnProperty("numChildren") == true) {
recursivelySmooth(item);
}
}
}
This was written freehand, so you may have to doublecheck everything is correct, but that's the basic idea. Just call recursivelySmooth() on your swf, and it'll dig through all objects that can have child elements and smooth them.

Resources