transformAroundCenter not working with UILoader?

[sakre]

It still seems to transform with the original reference point (0,0) of the UILoader?

 

edit: it works fine with bitmap that I place on the scene and turn into an MC though.

centrepoint.swf.zip

[Carl]

Hi and welcome to the GreenSock forums.

 

UILoaders (and other various Flash/Flex components) are often quite horrible at accurately reporting their width and height which are what TransformAroundCenter needs access to in order to calculate the center. 

 

Per the UILoader docs:

The UILoader class makes it possible to set content to load and to then monitor the loading operation at run time. This class also handles the resizing of the loaded content. If loading content from a different domain (sandbox), security implications may mean content properties are inaccessible. Please see the ProLoader class for more information.

 

 

When your content is done loading does the UILoader resize to match the width and height of the content properly?

 

Can you trace() the width and height of the UILoader after the content is loaded?

 

Are you sure you are creating the TransformAroundCenter tween after the content is loaded?

 

There are a few more questions, but It would be more helpful if you could create a very basic Fla example that illustrates what is happening. You can zip your Fla and attach it here. Please don't include the com/greensock folder (which contains the memebers' plugins).

 

Also FWIW I would recommend our LoaderMax tools for any loading tasks: 

http://www.greensock.com/loadermax/

http://www.snorkl.tv/2011/07/loadermax-vs-native-as3-loader-exhibit-a/

http://www.snorkl.tv/2011/08/loading-images-with-loadermax-load-and-track-the-progress-of-multiple-images/

[sakre]

yes, I have tried everything. I can get width and height before, during and after transformation and I know for a fact that it happens also if you explicitly wait for the loader to finish loading its content.

 

I am adding the files to my OP so you can test for yourself. Left (UILoader) is what happens, right (Bitmap) is what I want.

[sakre]

ok, I just managed to get the files uploaded (took some playing around with the 500kb limit)

[Carl]

Your zip appears to only contain a swf which doesn't help me investigate what is going on.

 

Please just include a very simple fla and small version of the file you are loading. 

 

I can't imagine this needs to be anywhere need 500kb, but if that is a concern, just use a free file hosting site like http://ge.tt/ which doesn't require any registration and doesn't have sketchy ads.

[sakre]

sorry, kind of rushed it, here is the link:

http://ge.tt/6oqb6Vo1/v/0?c

[Carl]

Thanks for the files, VERY helpful.

I see what you mean.

 

I assume UILoader is doing something strange, but give us some time and we'll take a deeper look.

[GreenSock]

Yep, UILoader is very buggy and I wouldn't recommend using it. For various reasons, TransformAroundCenterPlugin and TransformAroundPointPlugin need to use the getBounds() method, but try doing that with a UILoader and you'll see that it exposes a bug in Adobe's stuff - it reports width and height as zero. 

yourUILoader.getBounds(yourUILoader); //should return the object's native width/height and origin offset, but UILoader doesn't

You could simply wrap your UILoader in a Sprite or MovieClip instead and tween that. 

 

Again, this isn't a bug in GreenSock stuff, it's a bug in Adobe's stuff. 

[sakre]

 

You could simply wrap your UILoader in a Sprite or MovieClip instead and tween that. 

 

I'm sorry, but due to the nature of the project that is simply not possible.

 

Is there really no other way?

[GreenSock]

Not really. 

 

Another bug in Adobe's stuff that's causing problems is that if you alter the scaleX or scaleY of a UILoader, it has no effect whatsoever on the transform.matrix! Crazy. 

 

So no, it's not something we can just easily side-step in our plugin. There are fundamental problems in the UILoader class itself. 

 

You could use LoaderMax and its ImageLoader or something. We put a bunch of effort into making that work much better than UILoader, plus it has a ton of other features. 

 

Why is it impossible for you to wrap your UILoader in a Sprite or MovieClip? It seems like it should actually be quite easy, even if it means creating your own class that extends Sprite or UILoader. Heck, you could extend UILoader and override the faulty methods like getBounds(), scaleX, and scaleY such that they work around the bugs inherent in Adobe's class. Just an idea. 

[sakre]

Our swf is a template that can be loaded into an edit mode, where clicking on UILoader triggers a JS function that pops up a HTML image selector. The selected image is then loaded into the UILoader. Then, when the swf is loaded for presentation, the image source paths are pulled from a DB and the correct images are loaded. This enables the end-user to quickly change the image in the swf from any image in our extensive DB.

 

It would be easy to replace UILoader with LoaderMax for this, were it not that we need UILoader because the component needs to be placed/manipulated in the Flash editor GUI, as our designer cannot code.

 

Furthermore, putting the UILoader in a MC will send the wrong instance name to the JS, which will cause the swf to try and load the image into MC.source instead of MC.UILoader.source. Of course, it would be possible to rewrite the code to do just that, except that when designing in the GUI this will make things quite a hassle.

 

The point is, currently we have a system that enables our designer to create templates with minimal knowledge of AS3 or coding. I want to keep it that way.

 

Could you elaborate on extending the UILoader class?

[Carl]

Thanks for the more thorough explanation. It certainly helps. 

It is apparent now that

1. UILoader has inherent bugs which make it incompatible with TransformAroundCenterPlugin.
2. UILoader's main convenience for you is that it gives your non-coder designer a way to declare where things should go and how they should be sized
3. You are most likely going to have to code your way around these limitations

It sounds like your app is fairly robust and I don't mean to minimize the amount of effort it may take to make some changes, but it seems like it would be fairly straight-forward to

 

• Give your designer a very basic MovieClip in the library called UILoaderMax. It can be a simple grey rectangle. 
• Let them place instances of these UILoaderMax clips anywhere they want and size the however they want
• Write a class for UILoaderMax that automatically creates an ImageLoader with the same position and size as the UILoaderMax instance
• Add code that handles all the interactivity and communication with your JS to UILoaderMax

I think you will be very impressed with ImageLoader's ability to scale and crop loaded content. Furthermore, ImageLoader has a centerRegistration property which means you won't even need TransformAroundCenter. It handles scaling and rotating around center built in.

http://www.greensock.com/as/docs/tween/com/greensock/loading/ImageLoader.html

 

Just an idea.

[sakre]

Carl, thank you for your suggestion. It certainly merits a try!