There is a property of MovieClip class called scale9Grid. It accepts a Rectangle object and if you pass one, your clip will be sliced to 9 pieces.
If you scale or resize the MovieClip only piece 5 will be transformed. In other words you are keeping the rounded corners unchanged.
The original:
Resizing without the grid:
Resizing with the grid:
The code of the example:
function set9Grid():void {
var grid:Rectangle = new Rectangle(clip.slicing.x, clip.slicing.y, clip.slicing.width, clip.slicing.height);
clip.scale9Grid = grid;
}
function startLoop():void {
addEventListener(Event.ENTER_FRAME, loop);
}
function loop(e:Event):void {
clip.width = mouseX - clip.x;
clip.height = mouseY - clip.y;
}
set9Grid();
startLoop();
I used a child of my clip called "slicing". It gave me the exact x,y,width and height of the grid.
Download the example source files from here.