I have setup some code (AS3) to handle the scaling of images. I have a Container in my XML that contains an Image. My AS3 code finds the Image, removes it from the Container, wraps the Image with a TouchSprite and then adds the TouchSprite back to the Container. I want to eventually be able to control some of the drag boundaries, which is why I want to do this with AS3.
I'm running into some problems though. First of all, I've seen numerous tutorials that reference properties like $xscale and $yscale, but I don't see these attributes anywhere on the objects I'm working with. Are these tutorials just out dated w/old property names? Similarly, I've seen disableNativeTransform mentioned, but the TouchSprite I'm working with only has a nativeTransform property.
Also, what exactly is the different between a native transform and a non-native transform? What is affineTransform? Should I be using this?
Any scaling that I have gotten to work has strange behaviors, where if I scale it too quickly (in test mode w/mouse) the image inverts and is then upside down. Sometimes it goes completely off the screen too. Scaling rapidly back end forth causes the image to lose it's original x/y coordinates which I would like to avoid.
Using the latest version of OpenExhibits AS3, what is the correct way to scale an Image (using gestures) where the CML looks like this:
Any help is greatly appreciated!
As usual, I end up making progress on something as soon as I post it. I have something working now, but I can't say I completely understand it all. I set nativeTransform=false, affineTransform=false and gestureEvents=true. After assigning my "scale" event handler, I could see it getting called when scaling the image.
It seems to scale (and obeys the scaleMax and scaleMin properties on the TouchSprite, nice!). But it scales from the top-left corner. How can I get this to scale according to where the touch points are at? For example, if someone touches the bottom center of the image an scales, I need it to zoom to that area, not the top left. What am I doing wrong?
All elements extend TouchSprite so you do not need to wrap the Image in a TouchSprite in order to apply transform boundaries. Yes the prepended $ used to indicate affine transform properties but is obsolete and no longer valid syntax. The disableNativeTransform has also been replaced with nativeTransform to avoid the double negative confusion.
All transformations are applied automatically by the gesture engine.
Transformations you apply in custom gesture event handlers
Transforms around the cluster (center of touch points) - this is the setting you want to enable to prevent scaling frome the default registration point (top left corner)
If you scale any object into negative values it will invert the transform, you need to bound your scaling to prevent this from happening