We present a simple custom AS3 class, KaleidoscopeMirror, that creates keleidoscopic effects from any image that you pass to its constructor. Take a photo of street graffiti, or any other image, and transform it into fascinating symmetric patterns. Click on the screen shot below to open the gallery:
- Download all source fla, as, and jpg files corresponding to this tutorial: gallery_kal.zip
The 'fla' file corresponding to the example above is called gallery_kal.fla. The simple, well-commented code on the MainTimeline consists of creating several instances of the custom AS3 class, 'KaleidoscopeMirror' (provided in the zip file as well), and adding functionality for the thumbnail buttons and a timer. You can easily customize the size of your kaleidoscope, the bitmap image behind it, and other properties.
The gallery presented here builds upon our earlier tutorial Kaleidoscope Effect in Flash CS4. The Kaleidoscope class presented there has been significantly modified to add more symmetry to the resulting images. The underlying method remains the same, though. It is graphics.copyFrom AS3 method new to Flash Player 10.
The tutorial is by a new member of the Flash and Math team, Dan Gries, together with Barbara Kaskosz. Welcome Dan!
On the next page we discuss the KaleidoscopeMirror class.