[as3] Tutorial, blitting

Dans: Actionscript|Flash|Tutorial

8 nov 2012

Definition

Blit is to copy bits from one part of a computer’s graphical memory to another part.

It is commonly believed that Blit is an acronym for BLock Image Transfer, according to wikipedia this is not the real definition but it fit perfectly, so it’s fine with me :p

Real worl example

Here the signature of SDL_BlitSurface function

int SDL_BlitSurface(SDL_Surface *src, SDL_Rect *srcrect, SDL_Surface *dst, SDL_Rect *dstrect);

SDL_Surface is an area of graphical memory that can be drawn to the video framebuffer.

SDL_Rect is a rectangle

Just like the definition said, blitting is to copy a rectangle of the first image (source) onto another one (destination)

A basic rendering process works like this

Télécharger Flash Player :D

A variation involves dividing the screen into segments and erasing only the segments where patterns have been drawn on. This technique is known as dirty rectangles.

Why blitting ?

  • Perfs, copying a whole block of memory is the fastest copy we can do.
  • Memory, depending of the platform you may have no other choice

Let’s practice !

C++/SDL are great but need some alchemy cross bridge to run into the browser. So let’s use regular Flash and Action Script 3 for a web friendly demo :)

First we need to know bitmap related stuff

Here how to create a surface in graphical memory

var myBackground_dat:BitmapData = new BitmapData( iMyWidth, iMyHeight, bAlphaChanel, imyFillColor );

And how to display it on screen

var myBackground:Bitmap = new Bitmap( myBackground_dat );
addChild(myBackground);

Notice that you cannot put directly a bitmapdata on Screen, you need a wrapper to build an image from it.

Demo (the slider is just a toy to change ‘gravity’)

Télécharger Flash Player :D

Explanations

The keypoint of the algorithm

  1. Blitting background
    _screen.copyPixels(_background, _background.rect, _background.rect.topLeft);
  2. Locking the screen
    _screen.lock();
  3. Computing stuff like position,bounce and split
  4. Blitting ice cream
    _screen.copyPixels(_yBalls[b.idx], _yBalls[b.idx].rect, P);
  5. Finally, unlocking the screen.
    _screen.unlock();

Pro Tip

You can manipulate datas and tell to the bitmap to refresh the display.

myBackground_dat.lock():
// do stuff here
myBackground_dat.unlock();

Profiling

#Number of objects

  • 1 Bitmap for the screen
  • 1 BitmapData for the scren
  • 1 BitmapData for the background
  • 7 BitmapData for each differents size of the yBall (check the ‘count’ column)

#Memory management

You will have more than 6000 objets on screen, question is.
Is it better to keep object alive and recycle them or dispose them and recreate when needed ?
The new keyword is known to be slow and intensive, so I think it’s better to keep objects even if it allocate a fixed amount of memory.

#CPU

Always check your CPU. Use some vodoo-dark-magic and test your app on the Dead-Android-Mobile-Flash-Player.
When you run smooth on it, you can be sure that your content run everywhere else.

hope you like this tut :)

Graphics » Icy Splash android, web

Source » Download


Vote in HexoSearch

A voir aussi

Adobe Air Wand
Adobe Air Wand

Getting started with Flash
Getting started with Flash

Hydra Dominatus
Can you beat ‘Hydra Dominatus’ ?

Rendering soft bodies
Rendering soft bodies

How to build a billiard game with Flash regular display list
How to build a billiard game with Flash regular display list

2D lighting with normal map
2D lighting with normal map




Contact

Idées, remarques ou propositions vous pouvez m'écrire à cette adresse mail

Categories

Raccourcis

Flash Info Icy Splash Allez Viens !