9-slice Bitmap Images

OzMachine

I’ve been searching, but can’t seem to easily find if there’s a good way to make a 9-slice image in openfl. Would this be better as a feature of feathers, or openfl?

joshtynjala

You can use scale9Grid with graphics.beginBitmapFill() on a Sprite or Shape object.

It's a relatively new feature for OpenFL, so be sure to file bug reports with example code if you run into any quirks.

Hersir

Are 9-slice and 3-slice image skins in themas already working, if yes is there any example ?

joshtynjala

You should be able to create an OpenFL Shape, call graphics.beginBitmapFill() to draw BitmapData, and then set the scale9Grid property.

var shape = new Shape();
shape.graphics.beginBitmapFill(bitmapData);
shape.graphics.drawRect(0.0, 0.0, bitmapData.width, bitmapData.height);
shape.graphics.endBitmapFill();
shape.scale9Grid = new Rectangle(/* your grid values here */);

var button = new Button();
button.backgroundSkin = shape;

Hersir

joshtynjala Thank you will try out

joshtynjala

Just a little followup, in case anyone finds this thread on Google:

The latest alpha.2 preview includes a new Scale9Bitmap class to make it easier to use BitmapData and scale9Grid for skinning:

var bitmap = new Scale9Bitmap(Assets.getBitmapData("myBitmap"), new Rectangle(4.0, 4.0, 16.0, 8.0));