ScaleBitmap : New version [ by Didier Brun ]

Let me introduce the new version of ScaleBitmap :

ScaleBitmap V2 Illustration

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

    Post a comment | Trackback URI

    Comments (17)

    1. fenixkim wrote::

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

      Monday, December 28, 2009 at 3:56 pm #
    2. Paw Suddergaard wrote::

      Very nice work!

      Monday, December 28, 2009 at 4:16 pm #
    3. Christopher Black wrote::

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

      Monday, December 28, 2009 at 4:58 pm #
    4. James Penman wrote::

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

      Monday, December 28, 2009 at 5:06 pm #
    5. Antonin wrote::

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

      Saturday, January 9, 2010 at 10:07 am #
    6. Didier wrote::

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

      Sunday, January 10, 2010 at 2:38 pm #
    7. Jloa wrote::

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

      Monday, January 11, 2010 at 11:16 am #
    8. Almog wrote::

      Thanks, this is great

      Tuesday, January 12, 2010 at 7:26 pm #
    9. Daniel Hai wrote::

      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 :)

      Wednesday, January 13, 2010 at 10:12 pm #
    10. Markus wrote::

      great job! thanks for sharing!!

      Thursday, January 14, 2010 at 1:05 am #
    11. sitron wrote::

      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!

      Tuesday, January 19, 2010 at 4:25 pm #
    12. sharedtut wrote::

      thank you for sharing the source code

      Friday, January 22, 2010 at 4:45 am #
    13. Tink wrote::

      Yes nice job, thanks!

      Wednesday, February 17, 2010 at 10:21 am #
    14. Fabien Lesbordes wrote::

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

      Wednesday, February 24, 2010 at 11:54 pm #
    15. Jerome wrote::

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

      Thursday, April 1, 2010 at 3:46 pm #
    16. Didier Brun wrote::

      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)

      Thursday, April 1, 2010 at 3:57 pm #
    17. myrddin wrote::

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

      Friday, April 23, 2010 at 5:35 pm #

    Trackbacks/Pingbacks (2)

    1. 9格切片位图脚本 « tamt on Monday, March 22, 2010 at 4:00 pm

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

       
    2. イナヅマtvログ » Flex SDK, asdocコマンドでAPI ドキュメント出力その２ on Tuesday, April 20, 2010 at 7:22 am

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