Since I don't know english very well, I'm not able to find clear examples and/or tutorials for what I'm trying to do.
So the (maybe stupid) question is:
How can I strongly customize tweens using Starling framework and make my Sprites(or MovieClips) following a line, curve or create every other non-linear movement that doesn't exist in Transition Class?
I have no problem with Basic Starling animation. So it should be a good start point.
Thanks in advance for examples, resources or suggestions.
PS. I already visit the "Starling Wiki" page about custom Transitions but, as a Beginner(almost Intermediate) coder I wasn't able to completely understand it.
I know there are many online resources about AS3/Starling/Flash/Nape/Box2D but it's not easy for a non-english Beginner programmer to understand them.
You can simple move Starling's movieClip by set .x .y .rotation
Since now, I haven't heard of scripted transition to make predefined non linear movement. As you said, you can move object from one position to another, but it won't happen in a curved line.
What I've done in the past is to predefine the path of the movement, as I needed exactly the same weird path. I did a path tween in Flash, then used one simple function to loop through all frames (using gotoAndStop()) and getting x and y property of the object, storing them in an array. This was done when initializing. Later on I could start animation on all my weird paths whenever I wanted, using onUpdate method of tween, and passing positions from the array I've populated in the beginning.
This of course is good if you have very weird paths. If you want very little curves, you could try to do a mathematical equation. Tween classes have an update function, which will be called on each frame. So on each frame you could do some calculations and modify the parameters. For example if you tween x and y properties, you could use the update function to add a random number to those values. Of course this will make very uncontrolled movement, I'm just giving an example.
The best solution I could think of, speaking of complexity/result ratio - to use Greensock's TweenMax (look at the second example) - it has a built in bezier tweening. This means it could move from point A to point B within a bezier curve. I think this will be a good solution for your problem :)
Related
I am new to libGDX. I am trying to move a sprite from one point to another by changing the x and y of the rectangle. Can I do this gradually ?
I am currently using this to set new co-ordinates
batch.draw(bucketCyan, bucket.x, bucket.y);
What you're talking about is called interpolation, and there are a bunch of different ways to do it. You can either update the variables yourself using the approach noone commented with, or you can check out the Interpolation class: http://libgdx.badlogicgames.com/nightlies/docs/api/com/badlogic/gdx/math/Interpolation.html
Google Universal Tween Engine. It's an easy to use interpolation "engine". It lets you modify or interpolate any values over time. It is easy to use and works well. It's worth spending some time to get familiar with.
I'm a beginner to AS3 and programming in general, but have learned enough that I want to now start learning how to render animations on the screen. These are the methods that I know of from two days of "researching" on google.
I'm not in a situation where I could afford to take courses from an educational institution, so my only means of learning are through online sources.
Update an objects x or y positions in a loop on every frame. Very basic. Of course any kind of advanced animation (say, showing a character running) is not possible with this method alone.
Using Flash and creating animation on a movie clip's timeline and, combined with moving the position of the object we can achieve some proper animation this way. However I cannot afford Flash, so this is not an option available to me. It also doesn't seem to be a popular option among more experienced programmers either (I think, due to having poor performance when lots of objects animating on the screen?)
Using a sprite sheet and then blitting the relevant image from the sprite sheet onto the screen.
Is there any other way to put an image from a sprite sheet onto the screen other than blitting?
And what other methods of rendering animation are available?
Some online websites claim that blitting is all I'll ever need, but I want to know all the options available so I could choose the most appropriate one for any given situation.
Any help would be appreciated :)
Another option for blitting is Stage3D. Take a look at Starling for 2D animations.
Blitting would be my best opinion. The only other thing I can think of is manually taking the images from the sprite sheet and putting it into each frame of an animation.
To render animation, you can create a frame in a MovieClip and convert it into a MovieClip and name the frame 'running'. Then you need to create an Enter Frame event where the MovieClip's instance name is 'Guy' and in the code on the function write 'Guy.x += 5;' to make your MovieClip go 5 pixels to the right every frame and also in the function write "Guy.gotoAndStop('running');"
Use TweenMax engine for better animation purposes. Easy coding, more Animation!!
I am looking for a simple AS3 script to move/follow a movieclip (arrrow) along a manually drawn path in flash. Like.. it moves for the start point if the line to the end point of the line, also should rotate at curves automatically.
Also is it possible to duplicate this movieclip (arrrow) tho specific distance, like a ground of arrows moving along a path continuously with specific distance from eachother?
I am working on few infoGraphs and need this arrows animation to show the workflow.
I desperately needs this, pls help!
Cheers,
bp
There could be libraries that help with this, as George Profenza mentions in his comment, and it is certainly possible to calculate points along a bezier.
However, a much simpler solution is to do what people have done since Flash 4. Draw the curve in Flash, then create a motion tween along the curve using an empty MovieClip. At runtime, you can use addChild() to insert your MovieClip as a child of the empty one. You will have a lot more manual control this way, compared to the bezier library.
I have an object in a Movieclip that I currently have a tween set up for. I set it up on the stage, not with actionscript.
I need to dynamically change the duration of this tween. I have not found reference to a way to do this.
I don't mind dynamically creating the tween if I need to, setting the initial duration in code, but I still have not found any reference to changing the duration dynamically.
Is this possible?
I'm just learning as3, so sorry if this is something that should be obvious.
I strongly suggest you to switch to TweenLite/TweenMax library, it's awesome, free, super-easy to use and it will change the way you work!
Have a look here, and here on the forum there's an explanation on how to change duration dynamically
Ideally you'd do it by programming the tween, there are many libraries out there that make it quite easy.
One of the ones I use frequently is eaze-tween, it has a timeline tween function, though I haven't used it, it is worth a try. eaze(target).to(duration, { frame:"label" });
Grant Skinner's gtween library also seems to be able to that using the GTweenTimeline Class.
The other thing you can do is modify the frame the animation is at at a varied rate, so to speed it up you'd go through it two frames at a time, so twice as fast. This way makes it limited to multiples of speed.
If you want to have more control there you'd need to have a longer tween, otherwise you might notice movement that is not very smooth. The way to do that would be to have a transition of a 100 frames, and use a tweening library, where the on update makes the value of the tween(which is a number between 0 and 1) and multiply it by the number of frames(100) and update the frame mc.gotoAndStop(int(val*100);. You can then assign various tweening functions and durations.
hope it helps
I'm trying to create a multi-level dungeon adventure in Flash CS4. The layout is an instance created of a symbol called Level, within the symbol are multiple wall subsymbols (wall), instances of Wall. There is a collision routine to stop the player walking through the walls, called from Wall.As.
Level is drawn about the centre point (0,0).
When I create an instance on the stage of Level (level), the collision tester is using the xy coordinates for the walls drawn about 0,0, not the "real" xy where it's appearing on the stage.
So what I need to know, is how to "update" the xy for each wall subsymbol with the live stage information, overriding the XYs drawn in the parent. It has to be updated unfortunately (I can't keep it static), as the levels are big so have to scroll.
Thanks for your advice.
With all due respect forget your approach, you're reinventing the wheel for nothing and probably to end up getting worse performance. What you need is pixel-perfect collision detection and probably including basic physics so already we're talking a huge amount of work. If you want to build levels in a design way for a game, use this, it'll blow your mind how awesome/easy/cool this is:
http://www.gotoandlearn.com/play.php?id=135
Its always a guess when trying to answer questions like this, as there are a lot of unknowns. That being said, in programming, there are always more than a few ways to solve a problem. Examine your collision detection routine - if you worked with hitTestPoint, and the point that was being tested (mouseX,Y or your main actor) with localToGlobal, you likely wouldn't need to test for the x,y variables of your collision objects. Read up on those two subjects and this question might be rendered moot.
At any rate, you could update relative coordinates in your Wall.as instance by leveraging globlaToLocal:
public function get curLoc():Point
{
return globalToLocal(new Point(this.x, this.y));
}
and retrieve them from your parent class as a point you can then test against:
trace(_wall.curLoc);
Hope that helps
I suppose you could accomplish what you're trying to do by manipulating the transform property of the wall symbols, but honestly I would concur with Ascension Systems and just abandon your collision testing routine for something different.
You may not need to go all out with a physics engine for your game, in which case just use hitTestObject to do the collision detection.