Scaling bug when exporting texture atlas of nested symbols

New Here ,
May 08, 2021 May 08, 2021

Copy link to clipboard


Summary: In the context of a texture atlas animation, Free Transforming a symbol instance can affect the scale of other instances of the same symbol. The animation looks fine in Animate, but when rendering it from Animation.json, those other instances will be too big.


Demo: ("scaling-bug.docx" is actually a ZIP file containing a project "bug.fla" and a texture atlas export in the "bug" directory. You should be able to open it if you rename the file from "scaling-bug.docx" to "". Sorry for the inconvenience--it would not let me upload a zip.)


Open the attached project "bug.fla", select the "Stage" symbol, and press play. You will see a transformed square for 1 second, and then a normal square for 2 seconds.

Now, play the attached video "scaling-bug.mp4". This video was generated directly from the files produced by running "Generate Texture Atlas" on the "Stage" symbol. In the video, you will see a transformed square for 1 second, a normal square for 1 second, and then a big square for 1 second. The big square in the last second is the bug--it should be a normal square.


Steps to reproduce:

  1. Starting from an empty project, create a graphic symbol (called "Stage") to hold everything.
  2. Create a new graphic symbol (called "Square") and put a 100x100 square in it.
  3. Create a keyframe in "Stage", add an instance of "Square", and Free Transform the instance, applying a random rotation, shear, and scaling.
  4. Create another keyframe in "Stage", and add an instance of "Square" (no transformation).
  5. Create a new graphic symbol (called "Square Wrapper"). In it, add one instance of "Square" (no transformation).
  6. Create one more keyframe in "Stage", and add an instance of "Square Wrapper" (no transformation).
  7. Play "Stage"'s animation. You will see the transformed square, and then the same square for two keyframes, as mentioned before.
  8. Run "Generate Texture Atlas" on "Stage". Default options are used (e.g. no Animation.json optimization, no flattening of skewed objects, MaxRects, etc).


Detailed explanation:

If you look in spritemap1.json, the sprites for "Square" and "Square Wrapper" use the same image. However, the image has been scaled to 133x133, which means that it will need to be scaled back down to 100x100 in Animation.json.

Indeed, if we look in Animation.json, under SYMBOL_DICTIONARY, we can see that the ATLAS_SPRITE_instance for "Square" has a Matrix3D which scales the sprite image to 0.75x the original size. But, if look at the Matrix3D for "Square Wrapper", we can see that it is the identity matrix. This means that "Square Wrapper" is using the 133x133 sprite without scaling it down. This causes the big square at the end of "scaling-bug.mp4".


To sumarize, Free Transforming the "Square" instance causes its sprite in spritemap1.png to be scaled up. To compensate, Animation.json defines the "Square" symbol with a Matrix3D that scales down the image. But, this downscaling is not propagated to the "Square" instance nested in "Square Wrapper". So, "Square Wrapper"'s square ends up being too big.


System details:

Animate version: 21.0.5

Build: 40714

OS: macOS Catalina

Product issue







Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
no replies

Have something to add?

Join the conversation