Problem Using Scale9Grid

Scale9Grid Sux
When I first heard about the Scale9Grid feature, I thought, "Wow, that's a pretty cool and practical feature."

But then I tried to use it.

The Flash Help files don't do a real good job explaining how to apply the Scale9Grid feature to a clip in the Flash authoring environment. Just to make things a little clearer, you need to check the "Enable guides for 9 slice scaling" option when converting items to symbols via Modify/Convert to Symbol. Or you can right-click the clip in your library, select "Properties" then check the "Enable guides for 9 slice scaling" option at the bottom. Even when properly enabled, you will only see the Scale9Grid guidelines ~properly~ if you edit the clip from the library; double-clicking the clip on stage won't work.

Although the Flash Help Files clearly show a charming bitmap of an orangutan right smack dab in the middle of the clip to which the Scale9Grid is being applied, the Scale9Grid functionality doesn't apply to bitmaps. That's a pretty important thing to know so I'll make it real clear, "SCALE9GRID FUNCTIONALITY DOESN'T APPLY TO BITMAPS." You see, the catch to using Adobe's bitmap monkey (I know it's an ape but I like the word monkey more, so there) is that the bitmap is fully contained within the center block of the 3X3 grid which uses 'standard' scaling. Any bitmap extending beyond the bounds of the center block will not scale in the expected Scale9Grid fashion. This means you can't import that cool picture frame with smooth gradients and photographic details from Photoshop and use it in Flash... unless of course you want to use the "trace bitmap" command and convert it to vectors.

Scaling vector shapes with Scale9Grid works as expected... well, as long as you don't expect to set your scale to negative numbers. Setting the clip's _xscale or _yscale to a negative number causes the clip to be scaled in the standard distorting fashion.

Someone else on Adobe LiveDocs has pointed out that clips also lose their scale9Grid functionality when used as masks.

MovieClips, TextFields and Buttons inside the clip you're trying to scale with Scale9Grid will NOT scale as expected, instead they will stretch and distort in the 'standard' fashion. Graphic symbols inside the clip you're scaling will "attempt" to be scaled in the expected Scale9Grid fashion but I've had some odd results such as distorted shapes around the perimeter so I don't recommend it.

I've attached a file demonstrating some of Scale9Grid's odd (buggy) behavior. First, open the file then test it. See how the frame looks like a 1970's TV screen? That's a bug, the corners should be nice and round and the edges should be straight. If you open the attached file and move the rainbow box Graphic towards the center a few pixels or delete it entirely you might see how it "should" work. Moving the Graphic towards the very center causes the Graphic to be scaled in the 'standard' fashion. Also, if you leave the Graphic at (0, 0) but un-check the MovieClip layer's "guide" property the frame draws as expected, but the red square MovieClip will scale in the standard fashion. I'm sure it all makes sense to the guy who wrote the scale9Grid method, but to me it's a bit perplexing (i.e. stupid).

Okay, I've vented. I feel better now. Hopefully you'll find some of the info provided helpful. And if you're really lucky, you'll find it BEFORE you really need to.

-PiXELWiT
http://www.pixelwit.com

View Replies !    View Related

---

Scale9Grid
Hello everyone,

Code:
private function initScale9Grid():void {
var rectX:Number = this.x + 20;
var rectY:Number = this.y + 10;
var rectWd:Number = this.width - 50;
var rectHt:Number = this.height - 50;

var rect:Rectangle = new Rectangle(rectX, rectY, rectWd, rectHt);

this.scale9Grid = rect;

}
Error #2004: One of the parameters is invalid.

This is my code to create the scale9Grid for my movieClip. I even drew a sprite with the exact dimensions as the rect (and it lies right within the movieclip). But I keep getting this error.
I have been trying to get this working for a very long time. ANY idea whats wrong??

View Replies !    View Related

---

Scale9Grid
Ah, I forgot that the 3rd, and 4th parameters are width and height, not x and y....







Attach Code

var rectangle:Shape = new Shape();
rectangle.graphics.beginFill(color);
rectangle.graphics.drawRect(0, 0, 20, 20);
rectangle.graphics.endFill();
var grid:Rectangle = new Rectangle(2, 2, 18, 18);
rectangle.scale9Grid = grid;

























Edited: 11/02/2007 at 04:44:09 PM by cayennecode

View Replies !    View Related

---

Scale9Grid
Why doesn't this work?


ActionScript Code:
import flash.geom.Rectangle;
this.createEmptyMovieClip("test_mc", 10);
var grid:Rectangle = new Rectangle(30, 30, 370, 370);
test_mc.scale9Grid = grid;
test_mc._x = 50;
test_mc._y = 50;
function onMouseMove() {
    test_mc._width = _xmouse-50;
    test_mc._height = _ymouse-50;
}
test_mc.lineStyle(5, 0x000000, 80);
test_mc.beginFill(0xFFCC66, 100);
test_mc.moveTo(20, 0);
test_mc.lineTo(380, 0);
test_mc.curveTo(400, 0, 400, 20);
test_mc.lineTo(400, 380);
test_mc.curveTo(400, 400, 380, 400);
test_mc.lineTo(20, 400);
test_mc.curveTo(0, 400, 0, 380);
test_mc.lineTo(0, 20);
test_mc.curveTo(0, 0, 20, 0);
test_mc.endFill();


What's wrong?

View Replies !    View Related

---

Scale9Grid
Does anybody know how it actually works. All I know is that it breaks down quite often; that is, every time a scaled movie clip hosts another movie clip (instead of only shapes), it reverts to plain old scaling.

Cheers.

View Replies !    View Related

---

BitmapData And Scale9Grid
Hi all,

I've been trying to use the scale9Grid property with BitmapData.

I know that scale9Grid doesn't work with child Movieclips, but does this relate to BitmapData Objects aswell?

What I'm doing is taking an imported images (convert to BitmapData), and combining it to form one image. this is then attached to the movieclip via attachBitmap().

Is there a way to use scale9Grid with an attached Bitmap?

If anyone knows of a way, help would be appreciated

Cheers.

View Replies !    View Related

---

Scale9Grid Question?
Hello I am having some problems with setting up 9-grid scaling using Actionscript.

I keep getting this error message:

Code:
ArgumentError: Error #2004: One of the parameters is invalid.
at flash.display::DisplayObject/set scale9Grid()
here is my code:

Code:
private function menuSeed():void{
trace("menuSeed");
var cont:Sprite = new Sprite();

cont.graphics.beginFill(0x555555, 1);
cont.graphics.drawRoundRect(0,0,60,45,15,15);
cont.graphics.endFill();

var grid = new Rectangle(15, 15, 45, 30);
cont.scale9Grid = grid;
cont.scaleY *= 2;

cont.x = 30;
cont.y = 80;
addChild(cont);
}
I have noticed that I start getting this error when I set the parameters for the grid rectangle to a number greater than the radius of the rounded corner, 15 in this case. Anything lower than 15 will solve this issue.

Why wont this work with 15 or greater?
Any ideas how to resolve this problem?

thanks

View Replies !    View Related

---

Scale9Grid Problem Again
If the rectangle grows, scale9Grid works well. (the corners stay fix) But if the rectangle decreases scale9Grid doesn't work. Why?
I've written a script that shows:







Attach Code

function mouseWheelHandler(event:MouseEvent):void {
Rect.width += event.delta;
Rect.height += event.delta;
}

var Rect:Sprite = new Sprite();
Rect.x = 10; Rect.y = 10;
Rect.graphics.lineStyle(1, 0x000000, 1.0, true, "none");
Rect.graphics.drawRoundRect(0, 0, 320, 240, 20, 20);
Rect.graphics.endFill();
var Grid:Rectangle = new Rectangle(10, 10, 10, 10);
Rect.scale9Grid = Grid;
addChild(Rect);

stage.addEventListener(MouseEvent.MOUSE_WHEEL, mouseWheelHandler);

View Replies !    View Related

---

AS2 Scale9Grid And CurveTo
Hi there,

Having problems getting the scale9Grid to work correctly.
Here is a sample of the code:

//
////////////////////////////////////////////////////////////////////////////////////////
MovieClip.prototype.drawRoundedRect = function ( W:Number, H:Number,
R:Array ):Void
{
this.moveTo (R[0], 0);
this.lineTo (W - R[0], 0);
this.curveTo (W, 0, W, R[0]);
this.lineTo (W, H - R[1]);
this.curveTo (W, H, W - R[1], H);
this.lineTo (R[2], H);
this.curveTo (0, H, 0, H - R[2]);
this.lineTo (0, H - R[2]);
this.lineTo (0, R[3]);
this.curveTo (0, 0, R[3], 0);
this.lineTo (R[3], 0);
}

var radius:Number = 10;

this.createEmptyMovieClip ("mc",this.getNextHighestDepth ());
mc._x = mc._y = 5;
mc.beginFill (0x000000,100);
mc.drawRoundedRect ( 300, 300, [radius,radius,radius,radius] )
mc.endFill ();

import flash.geom.Rectangle;
var grid:Rectangle = new Rectangle (radius+1, radius+1, mc._width-radius-1,
mc._height-radius-1);
mc.scale9Grid = grid;

function onMouseMove ()
{
mc._width = _xmouse;
mc._height = _ymouse;
}
//
////////////////////////////////////////////////////////////////////////////////////////


Can anyone help me?
Thanks

View Replies !    View Related

---

Scale9Grid Problem
I'm trying everything to get this box to scale with rounded corners not getting stretched. I can't figure it out. The box is about 167 x 35 and this is my code, sorry if it's a lot

ActionScript Code:
import flash.geom.Rectangle;import mx.transitions.Tween;import mx.transitions.easing.*;onEnterFrame = function():Void{    space = 2;    btn2._x = (btn1._x + btn1._width + space);    btn3._x = (btn1._x + btn1._width + btn2._width + (2 * space));}btn1.scale9Grid = new Rectangle(6, 10, 5, 5);function enlarge(target:MovieClip):Void {            var twUpY:Tween = new Tween(target, "_yscale", Elastic.easeOut, target._yscale, 360, 40, false);    var twUpX:Tween = new Tween(target, "_xscale", Elastic.easeOut, target._xscale, 160, 40, false);    target.mytoggle = true;    var oListener:Object = new Object();    oListener.onMotionFinished = function():Void{        if (target.mytoggle == true){         target.play();        }    }    twUpY.addListener(oListener);}function shrink(target:MovieClip):Void{    target.mytoggle = false;    target.gotoAndStop(1);    var twDownY:Tween = new Tween(target, "_yscale", Elastic.easeOut, target._yscale, 100, 40, false);    var twDownX:Tween = new Tween(target, "_xscale", Elastic.easeOut, target._xscale, 100, 40, false);}btn1.onRollOver = function(){    enlarge(btn1);}btn1.onRollOut = function(){    shrink(btn1);}btn2.onRollOver = function(){    enlarge(btn2);}btn2.onRollOut = function(){    shrink(btn2);}btn3.onRollOver = function(){    enlarge(btn3);}btn3.onRollOut = function(){    shrink(btn3);}

I tried changing all the dimensions of the rectangle, that didn't help at all, it's like it doesn't even acknowledge it's there...

View Replies !    View Related

---

Scale9Grid Error
Does anyone know why this error if no graphics present

eg:

Code:
var square:Shape = new Shape();
square.graphics.lineStyle(20, 0xFFCC00);
square.graphics.drawRect(0, 0, 100, 100);

var grid:Rectangle = new Rectangle(20, 20, 60, 60);
square.scale9Grid = grid ;

addChild(square);

eg with error

Code:
var square:Shape = new Shape();
var grid:Rectangle = new Rectangle(20, 20, 60, 60);
square.scale9Grid = grid ;

addChild(square);
error

Quote:




ArgumentError: Error #2004: One of the parameters is invalid.
at flash.display:isplayObject/set scale9Grid()
at Untitled_fla::MainTimeline/frame1()




Thanks
T

View Replies !    View Related

---

Quick Question About Scale9Grid
Is it possible to use scale9Grid properties on a dynamically assigned mask? I can't seem to get it to work. And if I CAN use it...why isn't it working?

The scale9Grid property DOES work if it's not assigned as a mask.

View Replies !    View Related

---

Scale9Grid & SetMask Issue
Can any of you confirm: once scale9Grid MovieClip is used to mask another MovieClip the mask won't scale properly any more.

Thanks

View Replies !    View Related

---

Scale9Grid And Masking Problem
first of all .. thank you very much for your interest

the following actionscript 2.0 code for simple reveal effect applied on a movieclip ..
movie has curved corners and loaded image ..
I'm tring to scale the border and the image mask within that movie while rolling over regardless of which regions of the 4 corners using scale9Grid class ..
well .. the border does scale properly, but the mask does not !

the only conclusion I've got that the mask movie does scale properly when disable masknig !
any help please ?


// importing nesessary classes //
import flash.geom.Rectangle;
import mx.transitions.Tween;
import mx.transitions.Tween.easing.*;

// API drawing engine //
function drawRec(mc:MovieClip, side:Number, corner:Number, stroke:Number, fill:Number) {
if (fill != undefined) {
mc.beginFill(fill);
}
mc.lineStyle(5, stroke);
mc.moveTo(-side+corner, -side);
mc.lineTo(side-corner, -side);
mc.curveTo(side, -side, side, -side+corner);
mc.lineTo(side, side-corner);
mc.curveTo(side, side, side-corner, side);
mc.lineTo(-side+corner, side);
mc.curveTo(-side, side, -side, side-corner);
mc.lineTo(-side, -side+corner);
mc.curveTo(-side, -side, -side+corner, -side);
if (fill != undefined) {
mc.endFill();
}
}

// creating test movie holder //
this.createEmptyMovieClip("_box", 1);
_box._x = Stage.width/2;
_box._y = Stage.height/2;

// creating border within movie holder //
_box.createEmptyMovieClip("_brd", 3);
drawRec(_box._brd, 100, 20, 0xA8A8A8);

// creating mask for image container //
_box.createEmptyMovieClip("_msk", 2);
drawRec(_box._msk, 95, 18, 0xA8A8A8, 0xA8A8A8);

// creating image container //
_box.createEmptyMovieClip("_img", 1);

// loading image //
var img_lodr:MovieClipLoader = new MovieClipLoader();
var img_lsnr:Object = new Object();
img_lsnr.onLoadInit = function(target:MovieClip) {
target._x = -(target._width/2);
target._y = -(target._height/2);
target.setMask(target._parent._msk); // commenting this line shows proper mask scaling !
};
img_lodr.addListener(img_lsnr);
img_lodr.loadClip("image.jpg", _box._img);

// enable 9-slice scaling for border and mask only //
var grid:Rectangle = new Rectangle(0, 0, 30, 30);
_box._brd.scale9Grid = grid;
_box._msk.scale9Grid = grid;

// assign scaling events for movie holder //
_box.onRollOver = function() {
new Tween(this._brd, "_xscale", Regular.easeOut, this._brd._xscale, 200, .5, true);
new Tween(this._brd, "_yscale", Regular.easeOut, this._brd._yscale, 200, .5, true);
new Tween(this._msk, "_xscale", Regular.easeOut, this._brd._xscale, 200, .5, true);
new Tween(this._msk, "_yscale", Regular.easeOut, this._brd._yscale, 200, .5, true);
};
_box.onRollOut = function() {
new Tween(this._brd, "_xscale", Regular.easeOut, this._brd._xscale, 100, .5, true);
new Tween(this._brd, "_yscale", Regular.easeOut, this._brd._yscale, 100, .5, true);
new Tween(this._msk, "_xscale", Regular.easeOut, this._brd._xscale, 100, .5, true);
new Tween(this._msk, "_yscale", Regular.easeOut, this._brd._yscale, 100, .5, true);
};
// end of code //

View Replies !    View Related

---

Scale9grid On Mask Object
i can't make this work for some reason

PHP Code:



masking = new Sprite(); // declared outside method...masking.graphics.beginFill(0x111111, 0.75);masking.graphics.drawRoundRect(0, 0, 75, 15, 5, 5);masking.graphics.endFill();  addChild(masking);masking.scale9Grid = new Rectangle(5, 5, 65, 5);this.mask = masking; // this extends Sprite... 




..if I don't apply mask, scaling works great, but when I do scaling is wrong... Any ideas what might be a problem?

View Replies !    View Related

---

AS3 Scale9Grid For Library Objects
Hi,

I have a rounded rectangle movieclip in the library. I want to have multiple instances of the same on stage, each with different dimensions. But i do not want to loose out the perfect rounds on the edges on each instance. Can you pls help me with this in AS3.

thanks.

View Replies !    View Related

---

Scale9Grid Not Applying To Child Nodes Properly
I am running into something funky with my scale9Grid. I have a valid scale9 grid applied to a display object. I have a child object, that is basically a copy of the shape that I show on my roll overs to give me a color change.

The parent clip's shape scales as I would expect with the scale9Grid. The child however distorts as though the scale9Grid didn't exist. I even tried assigning a unique scale9Grid to the child, but it didn't seem to have any effect either. So the end result is a display object that looks distorted when I roll over it.

Anybody have any ideas about what I am doing wrong? This is my first time bothering with the scale9Grid property.

View Replies !    View Related

---