Hi everybody,
I have just finished a simple class which allows you to resize dynamically any Bitmap (just like the MovieClip.scale9Grid feature).
 |
This project is OPEN SOURCE under RPL License. 2009-02-19 v1.2.2 scaleBitmap_v122.zip |
The zip file contains :
- the v1.2.2 ScaleBitmap class
- a Flash CS3 demo file
- a demo PNG Bitmap file
Some features :
- dynamically set the scale9Grid parameter
- use setSize() method
- get the originalBitmapData instance
- ScaleBitmap extends flash.display.Bitmap
Don't hesitate to post any comments/bugs 
NEW
Alexandre Legout has contributed to this v1.2 ScaleBitmap which introduce these
new features :
- bitmapData setter
- redrawing scale9Grid optimization
- null scale9Grid capability (restore the default Bitmap class behaviour)
Thanks Lalex
Comments (59)
really great job… liquid components are using this class??
thx!, i love this one!
Nice! Should be handy for raster-based interfaces.
Wow… That kick ass.
as far as i understand this Class could rewritten to AS2 Flash 8.
am i right?
Wow, nice one. I don’t have to break apart bitmaps anymore. Thanks.
Freddy > No, Liquid Components are based on a more complex multi-states grid : LiquidGrid.
Eugene > Yes, it could be ported to AS2.
Thanks for your comments
Nice, nice and very nice… not more comments.
Yes one comment, good work.
which are differences between this class and the embedded scale9Grid feature?
teejay > the scale9Grid does not work with Bitmap.
Nice, I made a similar class byself a while ago to use in my controls, however I was having problems scaling controls in a 3-slice setup, some of my controls only needed to be scaled horazontaly but I wanted to use the same scaling class to manage everything, so I would pass a rectangle with y set to 0 and height set to the height of the bitmap. This will cause an error in adobes 9 slice implementation. What would yours do in this situation?
Keep up the good work
Hi Pleh,
It’s working pretty well with a 3-slice rectangle
Nice work Didier.
Can you make available the AS2 version, please?
Whoah, THANK YOU! I always hated that scale9 was for vectors only. Yay, me and my skins thank you!
William > Sorry, I think I will never find enough free time to port it to AS2, maybe a ByteArray reader ?
A new V1.2 is up ! (thanks Lalex)
There’s an issue if I try to do more of scale3 rect (say I only want to stretch horizontally or vertically).
I updated validGrid to allow the right or bottom to be
My comment goto stripped.
I meant to say validGrid() allow right or bottom to be less than/equal to width or height.
Danny > Yes you’re right, I’ve just fixed this issue, the new 1.2 is up.
Thanks
My mistake!
I changed the v1.1 condition to return the opposite result, changing the and(&&) by a or(||) and “more than” by “less than” instead of “less than or equal”…
Good use!
AS2 implementation. http://durej.com/?p=59
Slavomir > Nice !
There is a bug which only allows scale9 rectangles to have evenly distributed widths/heights for example a scale9rect of {2,2,2,2} will not work on an image what has a width and height of {10,10}
to fix this change the following 2 lines in resizeBitmap…
var dRows : Array = [0, _scale9Grid.top, h - (_originalBitmap.height - _scale9Grid.bottom), h];
var dCols : Array = [0, _scale9Grid.left, w - (_originalBitmap.width - _scale9Grid.right), w];
Thanks Pleh
I’ve updated it.
sorry, I made a mistake… Please delete previously comment.
Just a little bug to fix :
function ScaleBitmap(bmpData : BitmapData = null, pixelSnapping : String = “auto”, smoothing : Boolean = false) {
// super constructor
super(bmpData, pixelSnapping, smoothing);
// original bitmap
if (bmpData) _originalBitmap = bmpData.clone();
}
Thanks a lot Pleh! you helped me on a hard problem which was annoying me so much!
Bonjour.
Premièrement, bravo pour cette classe.
Ensuite, il semble y avoir un bug lorsque je redimensionne l’objet scaleBitmap de 700 à 790 pixel en largeur.
En effet, dans cette plage de largeur, toute la partie centrale de l’image (haut, milieu et bas inclus) disparait.
En dessous et au dessus de cette plage, tout est normal.
Pour information, mon image fait 220*130
Rectangle de redimension :
var rect:Rectangle = new Rectangle(105, 60, 10, 10);
Merci bien
2009-02-19 v1.2.2 scaleBitmap_v122.zip
200″9″ ? Am I way too picky or I self just missing something
no problem DJ_ouf, Thanks Didier for creating the class in the first place, I have now scrapped my existing SplitBitmap classes and im now using this because its soooo good
Blue 112 > Merci, je vais regarder çà et je te tiens au courant.
mediakid > Oops ! Welcome to the future
Pleh > You’re welcome !
Des nouveautés au niveau de mon bug ?
thanks a lot for this class! very handy!
shouldn’t you add a clear() (or dispose()) method which would dispose() both the original bitmap and the scaled one?
Hi. I found a bug. I tried to add a ScaleBitmap with null bmpData:
_bodySBM = new ScaleBitmap();
There was an Exception thrown because:
(ScaleBitmap.as@48) _originalBitmap = bmpData.clone();
So I fixed it with:
(ScaleBitmap.as@48) if(bmpData != null) _originalBitmap = bmpData.clone();
(ScaleBitmap.as@123) if(super.bitmapData != null) super.bitmapData.dispose();
So now I am able to change original BitmapData if it’s even unknown at init. Sweet ;]
BTW you have year 2009 next to download link :]
Hello,
I just try your class. Thanks a lot to share it.
I try to use an embedded asset :
[Embed(source="bmp.png")]
var bmp:Class;
var test:ScaleBitmap = new bmp() as ScaleBitmap;
addChild(test);
I’ve got an execution error (null object reference).
I solved it doing:
[Embed(source="bmp.png")]
var bmp:Class;
var temp:Bitmap = new bmp() as Bitmap;
var test:ScaleBitmap = new ScaleBitmap(temp.bitmapData);
addChild(test);
But it’s not very nice.
Did I miss something ?
Thanks.
Wow, thanks man. I just discovered that scale9Grid doesn’t support bitmaps. Under a serious time crunch, and didn’t have time to write my own class to do this. You just saved my butt. Thank you!
Thank you, it works great!
if you try to use the same bitmapdata to conserve memory it will Error out : 2015
var msb1:ScaleBitmap=new ScaleBitmap(MainBitData);
var msb2:ScaleBitmap=new ScaleBitmap(MainBitData);
msb1.scale9Grid = new Rectangle(20,20,80,80);
msb1.setSize(200,64);
addChild(msb1);
msb2.scale9Grid = new Rectangle(20,20,80,80);
msb2.setSize(200,64);
addChild(msb2);
using your example.
comment out .scale9Grid and it works without correctly scaling.
Hi Didier,
I’m trying to reflect a movieclip containing an instance of the ScaleBitmap class but I get a really strange result. Seems that the original bitmapdata is reflected.
I just uploaded an example here:
http://www.rblab.com/reflect.zip
Thanks a lot for all the shared work
There is a weird bug that happens when I set my width and height of the scale9 rect to 1 and 1.
Hi,
I wnat to report broken link, I can’t download example:(
I’ve created scaleX and scaleY properties.
//add to class properties
private var _originalWidth:Number;
private var _originalHeight:Number;
private var _scaleX:Number = 1;
private var _scaleY:Number = 1;
//add to constructor
_originalWidth = bmpData.width;
_originalHeight = bmpData.height;
//add to getters/setters
override public function get scaleX():Number { return _scaleX;}
override public function set scaleX(value:Number):void {
if ( value != _scaleX) {
_scaleX = value;
var w:Number = _originalWidth * value;
setSize(w, height);
}
}
override public function get scaleY():Number { return _scaleY;}
override public function set scaleY(value:Number):void {
if ( value != scaleY) {
_scaleY = value;
var h:Number = _originalHeight * value;
setSize(width, h);
}
}
SUPER-MEGA-BEST class!
Hey, I really like the Idea!
Unfortunately I’m having a problem with rotating the scaled Bitmap. It looks distorted like the bitmap is not smoothed. But I pass smoothing = true.
Do you have an Idea?
Thank you,
Raphael
nice work!
I merged all changes from comments (me, Joel Stransky etc.), cleanded the code and published at http://gist.github.com/232800. I think it will be much easier to have it hosted as a gist…
Very nice class – thanks!
However I encountered a bug with missing middle section graphics.
Example(original 80×45 png)
If using scale9Grid=new Rectangle(10,10,4,10) the
following bitmap widths causes the middle section not to be drawn:
600,700,800,900,1000,1500,1600,1700,1800,1900,2000.
If setting the following bitmap widths it shows just fine:
100,200,300,400,500,1100,1200,1300,1400,2100,2200
If I figure out why I’ll post my findings.
Best,
Jakob E
thnx… Excellent class
A Really useful class that’s also super easy to use
Thanks, man!
What more could I want
Hi, Didier.
Any thoughts on why I’m getting this
http://bit.ly/ScaleBitmap
(just move around with the mouse down to test)
Notice how the sides disappear.
Here’s a close-up of the bitmap showing the grid.
Thanks
http://img717.imageshack.us/i/grid.gif/
+1 thanks
very great, thanks !
Hello Didier, I incorporated this really nice class into my open source toolkit.
Check it out: http://code.google.com/p/as3petoolkit/source/browse/trunk/PET%20Core/src/at/vy/pet/visuals/Scale9Bitmap.as
If anybody is curious the solution outlined below is over twice as fast to execute:
http://troygilbert.com/2009/08/quick-fix-for-scale-9-issues/
Hi!
I use this class as the base component in a gui framework i wrote for my games.
In my last project I started to recycle bitmapdata and found a bug when trying to do so. it seems the class is destroying the original bitmapdata when asigning a scale9grid. Reusing the bitmapdata somewhere else causes a #2015 – invalid bitmapdata.
I am starting investigations.
michael
Hi!
I found the reason and it’s not wrong to say:”It’s a feature, not a bug”
The feature is: As long as scaling isn’t used the class uses the original bitmapdata member of the super class. When asigning a scale9grig, the dispose function of the super class’ bitmapdata is called and the own implementation for bitmapdata is used.
Clear this saves performance. And there are situations where this behavior is correct and there are other situations where this behavior is wrong.
I sugest a member to control if the super.bitmapdata is disposed or not.
My solution looks like this:
…
public var disposeSuperBitmapData:Boolean = true;
private function assignBitmapData( bmp:BitmapData ):void {
if ( super.bitmapData != null && disposeSuperBitmapData) {
super.bitmapData.dispose();
}
…
regards,
michael
Hi!
I made a test file last night.
I created an instance of the scaleBitmap class on stage and assigned a scale9grid to it.
In an enterFrame-Event I created a new Bitmapdata object and assigned it to the scalebitmap instance.
I completely disabled the call of dispose in the class and watched the memory consumtions of the flash player. It was stable and didn’t increase with each new Bitmapdata.
As far as I know the flashplayer uses reference counting to determine if objects are still in use or not. If we assign a new bitmapdata object to our instance, flashplayer knows the old one isn’t used anymore.
But when we want to recycle our bitmapdata object we have a second reference to it from your “bitmapdata library”.
I think we could remove the dispose call.
Someof you may argue, that the flashplayer’s behavior isn’t the same in every version/plattform. – You may be right!
regards,
michael
I can’t download the zip archive. Is it still available?
Hi vamapaull,
Yes, just fixed, sorry for the inconvenience.
Thibault
Thank you for this great and very useful project!
Hi,
I’m trying to use ScaleBitmap in combination with TweenMax. When I’m resizing the BMP it is growing to the left and down. Is there a possibility to make it individual. So in some cases I want the BMP to grow to the left and up…
Trackbacks/Pingbacks (21)
[...] Visit site: http://www.bytearray.org/?p=118 [...]
[...] was inspired by the the poston Bytearray blog , well this is basicaly it’s slightly different AS2 implementation. [...]
[...] AS3 one can be found with our friends over at Byte Array http://www.bytearray.org/?p=118 addthis_url = ‘http%3A%2F%2Fwww.robmccardle.com%2Fwp%2F%3Fp%3D21′; addthis_title = [...]
[...] 15. ScaleBitmap : 9-slice bitmap class The owner have just finished a simple class which allows you to resize dynamically any Bitmap (just like the MovieClip.scale9Grid feature). [...]
[...] 15. ScaleBitmap : 9-slice bitmap classThe owner have just finished a simple class which allows you to resize dynamically any Bitmap (just like the MovieClip.scale9Grid feature). [...]
[...] 15. ScaleBitmap : 9-slice bitmap class The owner have just finished a simple class which allows you to resize dynamically any Bitmap (just like the MovieClip.scale9Grid feature). [...]
[...] 15. ScaleBitmap : 9-slice bitmap class The owner have just finished a simple class which allows you to resize dynamically any Bitmap (just like the MovieClip.scale9Grid feature). [...]
[...] ScaleBitmap 은 http://www.bytearray.org/?p=118 이 아저씨가 [...]
[...] 15. ScaleBitmap : 9-slice bitmap class The owner have just finished a simple class which allows you to resize dynamically any Bitmap (just like the MovieClip.scale9Grid feature). [...]
[...] 15. ScaleBitmap : 9-slice bitmap class The owner have just finished a simple class which allows you to resize dynamically any Bitmap (just like the MovieClip.scale9Grid feature). [...]
[...] scaling nine Bitmap instances. When developing the MAX Companion, I tried Didier Brun’s ScaleBitmap class, but discovered a costly memory leak in which it instantiates a new BitmapData instance with [...]
[...] 项目地址：http://www.bytearray.org/?p=118 [...]
[...] Glück gibt es Abhilfe von ByteArray.org. Anwendungsbeispiel: var bg:SomeSwcClip = new SomeSwcClip(); var bgBitmapData:BitmapData = new [...]
[...] 15. ScaleBitmap : 9-slice bitmap class The owner have just finished a simple class which allows you to resize dynamically any Bitmap (just like the MovieClip.scale9Grid feature). [...]
[...] : 9-slice bitmap class http://www.bytearray.org/?p=118 [...]
[...] The ScaleBitmap25 and ScaleBitmap9 classes are based on the ScaleBitmap class created by ByteArray’s Didier Brun. [...]
[...] ByteArray’s Didier Brun provided us with a solution to the problem that eliminates most, if not all, the limitations that the native tools and APIs [...]
[...] 15. ScaleBitmap : 9-slice bitmap class The owner have just finished a simple class which allows you to resize dynamically any Bitmap (just like the MovieClip.scale9Grid feature). [...]
[...] 原文地址：http://www.bytearray.org/?p=118 [...]
[...] ScaleBitmap by [...]
[...] : 9-slice bitmap class http://www.bytearray.org/?p=118 [...]