Halftone effect with simple API
Posted: November 5th, 2009 | Author: admin | Filed under: Effects | No Comments »I started working on an effect library with an easy-to-use API which will be easily attached to any tweening engine. I’m still working hard on the API and on how the whole thing is architectured, so I’m not going to include source code this time, but to give you a glimpse of how this is going to look, here’s an example of the Halftone effect which is going to be part of the Matrix2D package (it will include stuff like pixelate and explode effects).
the following effect is achieved simply by typing the following:
addChild(halfTone);
but the fun part is animating the effect with a simple API. I’m using the new TweenLite v11, but any tween engine or really any other way (like controlling the swipe with the position of the mouse). here’s how I’m creating the different swipes in the example below:
seq = new TimelineLite({onComplete:restartTween});
seq.append(new TweenLite(halfTone, 1, {swipeLeftToRight:1}));
seq.append(new TweenLite(halfTone, 1, {swipeRightToLeft:0}));
seq.append(new TweenLite(halfTone, 1, {swipeTopToBottom:1}),1);
seq.append(new TweenLite(halfTone, 1, {swipeBottomToTop:0}));
seq.append(new TweenLite(halfTone, 1, {swipeTLtoBR:1}),1);
seq.append(new TweenLite(halfTone, 1, {swipeTLtoBR:0}));
Special thanks to Joe Ferrari for helping me through the diagonal array math (still working on the BottomLeft to TopRight swipe)
Leave a Reply