Wrapping BitmapData in Actionscript 3

Sometimes you overlook the easiest solutions. I had implemented a wrapping bitmap in actionscript 2, by some complex copyPixels code, which would cut 1 to 4 pieces from the original image and put them together again, providing you with a bitmap that wraps.

Then I realized that there is a much easier solution, with more functionality as well (not only wrapping but tiling too). But surprised however that it performed much better too. Surprised because I would have thought that 4 copyPixel operations would have been faster than using the drawing API combined with beginBitmapFill.

I’ve wrapped (no pun intended) the idea into two utility classes, the first WrappingBitmap is a simple sprite which takes a bitmapdata as source and creates a tiling wrapping display object that you can scroll.
The second is a WrappingBitmapData class which subclasses BitmapData and overrides the scroll method to wrap.

The demo is the pattern below. Click on the demo to give it focus and scroll using the cursor keys.

You can download the example here: Wrappingbitmap (656).

3 replies
  1. Tim
    Tim says:

    Great info, thanks.

    The one thing I found is that the graphics.clear() function doesn’t clear the beginBitmapFill() from the previous call.

    If you have an image with sections that are totally transparent, they don’t get cleared out and you can see the old positions in the updated position (they bleed through).

    Any thoughts? Thanks again.

    Reply
  2. Tim
    Tim says:

    I found the solution. In the ‘grab’ function of the WrappingBitmap, I needed this before the draw call:

    lResult.fillRect(lResult.rect, 0x0);

    Thanks again.

    Reply
  3. Durss
    Durss says:

    Thanks for this usefull class :)!
    However, I just added thoses lines in the paint method :

    _matrix.tx = _matrix.tx % _width;
    _matrix.ty = _matrix.ty % _height;

    Indeed, there’s a really short limitation due to bitmapFill (i guess), if you go over something like 32.000, the scroll freezes. The matrix.tx value still grows but the scrolling is locked.
    Adding those lines prevents from that easily 🙂

    Thanks for this neat scrolling solution !

    Reply

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *