Resize the Flex / Flash object on the left side?
I am working on a Flex component that can be modified with handles on the right and left (that is, if you click and drag on the left side, the component will grow to the left, if you click and drag on the right, it will grow to the right).
I am currently using:
var oldX:Number = this.x;
this.x = event.stageX + (initial.x - initial.stageX); // Move the left edge to the left
this.width += oldX - this.x; // Increase the width to compensate for the move to the left
But it makes the right side jump and generally looks ugly.
What is the "right" to this? Is there something fundamental that I was wrong?
Thanks!
Edit : The jitter occurs on the right side of the component. When I install this.x
, the component moves to the left, the screen is redrawn, then the width is updated and the screen is redrawn again.
a source to share
I'm not a Flex guy, but I think your jitter is something to do with the Flex framework using Stage.invalidate()
or some thing to cause a redraw at frame time.
I guess there is probably a "skeleton" way to solve this problem, but for a workaround to make changes in one atomic operation, you can directly convert the transform object to the following lines:
var dx:Number = // however you're finding this
var m:Matrix = new Matrix();
m.scale( scaleX*(width-dx)/width, scaleY );
m.translate( x+dx, y );
transform.matrix = m;
This should work for simple graphics, but I'm not sure if it will work with a component that should probably catch events that have changed and redrawn. I think the only way is to make your update atomic, so if something along these lines doesn't help, you'll need an answer from someone else in the framework.
a source to share
Depending on how you have listeners for your customized grips, the problem might be that the resize code gets called over and over again, because when you set a new x position for the component, the handle will move under the mouse cursor effectively again calling resizing code, etc.
a source to share