Another application of tweenlite: Effect of image jigsaw puzzle Loading

During the evening, I saw a sample of tweenlite, which I thought was quite practical. I finally stole it :)

Note: After playing the video, you can press the mouse on your chest to replay the video :)

Thought comment: When I first saw this effect, I thought it should be quite complicated. Later I Came To See It.CodeThen I found it was so simple! Key: First load a complete image, and then use the copypixels function of bitmapdata to copy the pixels of each small block to form a series of new bitmapdata (that is, small block images ), then, use tweenlite to move it in sequence (with latency.

Code:

Package {import flash. display. sprite; import flash. display. bitmapdata; import flash. geom. rectangle; import flash. display. bitmap; import flash. geom. point; import flash. events. mouseevent; import Gs. tweenlite; import Gs. easing. back; public class imageup extends sprite {VaR _ originalimagedata: bitmapdata; VaR _ Cols: uint = 5; VaR _ rows: uint = 5; VaR _ imgarr: array = new array (); VaR _ w: Number = 0; VaR _ H: Number = 0; var _ Flag: Boolean = false; Public Function imageup () {Init ();} private function Init (): void {_ originalimagedata = new Mimi (); // Mimi is an image imported in the library // calculate the width and height of each small block _ w = _ originalimagedata. width/_ Cols; _ H = _ originalimagedata. height/_ rows; var I: uint = 0, J: uint = 0; for (I = 0; I <_ rows; I ++) {for (j = 0; j <_ Cols; j ++) {VaR _ imgcell: bitmapdata = new bitmapdata (_ w, _ H); // key: copy the corresponding small pixel from the source image to _ imgcell in imgcell. copypixels (_ orig Inalimagedata, new rectangle (J * _ w, I * _ H, _ w, _ H), new point (); VaR _ sprite: SPRITE = new sprite (); _ Sprite. addchild (New Bitmap (_ imgcell); // locates _ Sprite. X = J * _ w; _ Sprite. y = I * _ H; this. addchild (_ sprite); _ imgarr. push (_ sprite) ;}} this. stage. addeventlistener (mouseevent. click, mouseclick); begin ();} private function mouseclick (E: mouseevent) {begin ();} private function begin (): void {for (var I: uint = 0, j = _ imgarr. lengt H; I <j; I ++) {tweenlite. From (_ imgarr [I], 0.5, {delay: 0.1 * I, y :( _ flag? -) * _ H * _ rows, Alpha: 0, timeout: Back. easeout});} _ flag =! _ Flag ;}}}