Vector shape tweening

[shume...@gmail.com]

Hi!

what exactly is vector shape tweening and how does it work with
Tweensy? Is it similar to shape tweening?
I'm somewhat new to as3 and I haven't been abe to find clues from the
given examples.

thanks, I appreciate your help.


-Shumeng

[Shane McCartney]

The 0.2 beta does not include vector shape this will be in a later release.

In 0.2 you can do curveLine, gradient and line tweening documentation
for this is found under http://docs.flashdynamix.com/tweensy/fx/ in
the vector package. Though these classes don't seem to clearly support
shapes it is of course possible to then apply your own fillStyles as
per normal with a graphic then achieving a shape tween.

If you need further help let me know,

Shane M

[shume...@gmail.com]

Actually I am working on something where I would like to tween just
curves and lines. Sorry if I'm asking obvious questions, but how do
you draw a line with the vector package? I've tried the code below,
but it returns a type coercion error. Also, what is the purpose of the
rect:Rectangle parameter in the Line.draw() -method?


var pts1:Point = new Point(10,10);
var pts2:Point = new Point(70,70);
var pts:Array = [pts1, pts2];
var newline:Line = new Line(pts);
newline.style = [5, 0x5EEC2F];

var sp:Sprite = new Sprite();
addChild(sp);
newline.draw(sp.graphics, new Rectangle(0,0,100,100));


When the line is drawn, how would you go on to make a tween e.g. where
one point moves to a new position?

Thanks again for your help!!

-Shumeng

[Shane McCartney]

Well that's good then cause Tweensy 0.2 supports this.

I should of given you a bit more information in that last email though
the classes CurveLine, Line and Gradient can be used on there own they
are best used with the VectorLayer class. I have put together an
example to demonstrate this and how you would tween the Point Object
parameters in order to tween the CurveLine. But if you want to do a
simple Line just exchange the class names because CurveLine extends
Line.

package {
import fl.motion.easing.Elastic;

import com.flashdynamix.motion.*;
import com.flashdynamix.motion.layers.VectorLayer;
import com.flashdynamix.motion.vectors.*;

import flash.display.Sprite;
import flash.geom.Point;

/**
* @author FlashDynamix
*/
public class TweensyCurveLine extends Sprite {

protected var layer : VectorLayer;
protected var tween : TweensyGroup;

public function TweensyCurveLine() {
layer = new VectorLayer();
tween = new TweensyGroup();

var line : CurveLine = new CurveLine(true);

line.style = [1, 0x000000];

layer.add(line);

var pt1 : Point = new Point(175, 200);
var pt2 : Point = new Point(275, 100);
var pt3 : Point = new Point(375, 200);

var timeline : TweensyTimeline = tween.to(pt2, {y:"100"}, 1,
Elastic.easeOut);
timeline.repeatType = TweensyTimeline.YOYO;

line.pts = [pt1, pt2, pt3];

addChild(layer);

[shume...@gmail.com]

That's great, many thanks Shane!