Fun with code (since 2006)

ScaleBitmap : New version


12.28.09 Posted in Actionscript 3 by

Let me introduce the new version of ScaleBitmap :

ScaleBitmap

I have totally rewritten ScaleBitmap to suit my needs :

  • Better usage of memory : no more creation of BitmapData instance (possibility to swap BitmapData)
  • Outer drawing capability
  • ScaleBitmapSprite

The outer drawing & ScaleBitmapSprite allows you to :

  • Easily deal with shadow, glow, overlapping icon effects
  • Use real size & position to align or place your elements

Usage 1 : ScaleBitmap

ScaleBitmap.draw(
bitmap : BitmapData, // the bitmap source
graphic:Graphics, // the destination graphic
width:Number, // width (defined by outer rectangle if not null)
height:Number, // height (defined by outer rectangle if not null)
inner : Rectangle, // inner rectangle for scale 9
outer : Rectangle=null // outer rectangle : visual size reference
):void

If outer is not null, ScaleBitmap use a negative offset for drawing (according to outer properties)
If outer is null, ScaleBitmap works as a classic Scale9 grid drawer

Usage 2 : ScaleBitmapSprite

ScaleBitmapSprite(
bitmap : BitmapData, // the bitmap source
inner : Rectangle, // inner rectangle for scale 9
outer : Rectangle=null) // outer rectangle : visual size reference

var s:ScaleBitmapSprite=new ScaleBitmapSprite(mySkin, new Rectangle(20,20,80,20), new Rectangle(15,15,90,30));
addChild(s);
s.width=80;
s.height=40;</a>

ScaleBitmapSprite override public size setter & getter : you can move & resize a ScaleBitmapSprite object without taking care of bitmap outer drawing.

Simple MyButton class using ScaleBitmapSprite (click the button) :

A Flash animation should have appeared here, but it seems that your browser has an older version of the Flash Player or it is not installed at all. Please, install the last release of the Flash Player now, then reload this page.


Sources FCS4 [ require Eaze to compile]

Download ScaleBitmap & ScaleBitmapSprite :
Repository : http://gist.github.com/264250

Some of you prefer gist, so as possible, I will share my new projects via gist.

Hope this class help & merry Xmas to bytearray readers.

[EDIT 2010-05-18]

A new version 1.1 is available !

Jerôme Decoster, a talented french developer have made a lot of improvements in this new version :

  • smooth support
  • invalidation for ScaleBitmapSprite
  • code optimization
  • inner drawing correction

So many thanks to you Jerôme :)

Repository : http://gist.github.com/264250



25 Responses to “ScaleBitmap : New version”

  1. fenixkim says:

    Long waiting for these improvements, many congratulations on this great and usable class

  2. The original class was great and this one is even better. The new outer rectangle is going to be a time saver. Thanks!

  3. James Penman says:

    Thanks for the excellent utility class. Stuff like this really helps with every scale of web design project’s productivity. You’re the man.

  4. Antonin says:

    Génial ! Très beau boulot, bravo !

  5. Didier says:

    Thanks guys, don’t hesitate to report any problems or bugs :)

  6. Jloa says:

    Really nice update. I on download the source and see myself the improvment around the ‘BitmapData’

  7. Almog says:

    Thanks, this is great

  8. Daniel Hai says:

    Not sure if some of you know this, but you can embed a bitmap with scale9 as long as you set the scale dimesions, and make sure you embed it as MovieClip rather than Bitmap or BitmapData.

    Either way this is extremely useful for non-embedded assets :)

  9. Markus says:

    great job! thanks for sharing!!

  10. sitron says:

    this is just great! the outer addition is really useful!
    Something odd: it seems that with ScaleBitmapSprite, the original bitmap size is not respected by default (at least without outer Rectangle).
    Anyway… thanks a lot!

  11. sharedtut says:

    thank you for sharing the source code

  12. Tink says:

    Yes nice job, thanks!

  13. Bonsoir, à quand le scale nine grid et scale Bitmap porté à Photoshop ?Une feature pour Photshop cs6 ?

  14. [...] 在AS3环境下,可以通过著名的ScaleBitmap来实现。   No Comments [...]

     
  15. Jerome says:

    Bonjour, pourquoi se limiter au scale9 ? A quand le scale15 ? Une feature pour Flash CS6 ?

  16. Didier Brun says:

    hello all, many thanks for your comments.

    @sitron> Do you use the outer capability ? could you send me an example ?

    @jerome> Well, just for you : http://www.didierbrun.com/demos/scale_grid.swf (using one PNG file http://www.didierbrun.com/demos/layout.png)

  17. [...] bytearray.org のDemoで使われていた EazeTween が面白そう。 ScaleBitmap : New version [...]

     
  18. myrddin says:

    Thanks, I just used it, very nice ! It works perfectly.

  19. penny says:

    Hi,

    thank you for this usefull tool. Is there a simple way, to change ScaleBitmap.draw behavior, to work the oposite way – outer slices are scaled, and the inner stays untouched?

  20. Dennis says:

    Hello Didier,

    I used these classes a lot and they’re great.

    But I have an issue while using a checked bitmap. The inner rect will be squeezed/stretched, if the width/height is not the original width/height.

    Is there a way to improve the display in this case?

    Thanks a lot for any hint.
    Dennis

  21. Max says:

    Hi,

    Just used these very nice classes to create some scaleable bitmaps for UI elements. I noticed however it doesnt render till its added to stage.

    What is the reason it doesnt render once right away, when positioning/resizing your UI before adding it to stage this gives some weird hard to debug results.

    An extra render cant possible give that much of a performance drop and even so, is worth it when using it extensively.

    greets
    max

  22. Max says:

    Hi again,

    Just wanted to add, for some more practical use like i mentioned. It might be nice to change:

    if (stage != null) stage.invalidate();

    to:

    if (stage != null){
    stage.invalidate();
    }else{
    onRender();
    }

    greets
    max

  23. - ludev says:

    [...] 본 라이브러리는 배경 이미지의 크기조절을 위해 내부적으로 bytearray.org 의 ScaleBitmap을 사용합니다. [...]

     
  24. zeke says:

    hello jerome,
    why did the ScaleBitmapShape extends Sprite instead of Shape, thanks~

Leave a Reply

Open Sort Options

Sort comments by:
  • * Applied after refresh

ByteArray.org
Fun with code since 2006.