Papervision 3D Programming Tutorial – Tweener

Google+ Pinterest LinkedIn Tumblr +


How often do you want to move an object by some predefined amount over a certain period of time? Like “move to this point in 2 seconds”. This sort of movement over a timescale is the cornerstone of animation and scripting. Unfortunately to implement this in code is quite tedious. You first need to work out how fast you should be moving, and then keep track of how long you have actually moved. It’s not hard, but it does require writing a lot of boring code.

Fortunately there is a very elegant solution for this sort of animation. The Tweener library allows you to modify the properties of an object over a certain period of time with one or two lines of code. Lets take a simple example of a model that you want to move to the point (100, -98, 25) in 3D space, and you want it to take 2 seconds. With Tweener you do this with one line of code like Tweener.addTween(model, {x:100, y:-98, z:25, time:2});. It’s worth noting that the Tweener library has no concept of 3D space – it simply changes the properties of a supplied object over a period of time. By modifying the x, y and z properties of a 3D model we effectively get movement. You could just as easily modify the rotation, transparency or scale of an object using the same code.

In the demo application I have used the Tweener library to create 4 cubes that move to random points around the screen. The cubes themselves are controlled by a class called TweenedMeshObject. You’ll notice that TweenedMeshObject doesn’t have any code that actually moves the cubes around – it simply waits until the Tweener has finished moving the cube for it and then gives the Tweener class a new destination. It’s very simple to code, but the possibilities for this sort of scriptable object modification are endless.

Go back to Papervision Tutorials



About Author

Leave A Reply