TweenMax Saturation not working on iPad project

[FPCreative 1 Likes (Newbie)]

I am using TweenMax to fade some interface arrows on an AIR / iOS project, using the following (slightly simplified) code:

 

TweenMax.to( overlay.arrowE, 0, { alpha:overlayFactorX + minOverlayAlpha, colorMatrixFilter: { saturation:overlayFactorX }} );

 

The tween essentially responds to a user drag action, and highlights one arrow graphic (colour and alpha up) to show the direction of travel, whilst other arrows recede (colour desaturates to greyscale, and alpha decreases). A bigger drag creates a stronger highlight.

 

Everything works fine when viewed in preview on PC, and the code does runs when compiled and running on an iPad, BUT the saturation doesn't appear to work.

The arrows (there are four) change alpha, but their colour saturation remains unchanged.

 

Any ideas why this might be the case?

 

Thanks!

TweenTest.zip

[GreenSock 16,230 Likes (Superhero)]

Never heard of that before. Have you tried duplicating the issue in a completely different FLA that only has the one tween in place? I'm just curious to know if maybe something else in your file is causing the issue (tough to know without having your file to publish on our end).

 

Also, you're using the latest version of the platform, right? And you're not subloading a swf that uses a much older or newer version, right?

[FPCreative 1 Likes (Newbie)]

Thanks for the reply.

No old external files. Fairly fresh TweenMax.

 

I have updated my original post and attached some test files - and FLA (CS6), and a class file.

My test compile targets AIR 3.3.0.3650 (for iOS).

 

I have made a simple test which only runs the required graphics and tweens them in a very similar way to my real-case class.

The only difference in this set-up is the movieclip loaded is in a .swc in my real-case, but for simplicity i have added it directly to the test library.

 

Test results exactly mimic my real set-up.

Everything runs fine in a test, but the saturation doesn't show when running on an iPad.

I have tested on iPad2 and iPad3.

 

Look forward to your further thoughts.

[GreenSock 16,230 Likes (Superhero)]

Have you tried applying a ColorMatrixFilter directly? In other words, remove TweenMax from the equation completely. If you still have the trouble, at least you know that it's likely a bug in Adobe's or Apple's stuff.

 

For example, to desaturate, you could do:

myObject.filters = [new ColorMatrixFilter([0.212671,0.71516,0.072169,0,0,0.212671,0.71516,0.072169,0,0,0.212671,0.71516,0.072169,0,0,0,0,0,1,0])];

 

And then to apply a normal one (no desaturation), either empty the filters array or do this:

 

myObject.filters = [new ColorMatrixFilter()];

 

I would recommend applying the desaturation filter several times with slightly different values (which is what a tween would do).

[FPCreative 1 Likes (Newbie)]

Interesting results.

I applied a ColorMatrixFilter directly, as you suggested, and it worked!

However, I had inadvertently switched render modes.

It turns out that the saturation change works perfectly in all render modes except GPU.

 

Am now testing performance with Direct mode, but I can report that TweenMax works correctly in that mode.

 

Mystery solved, and I will let Adobe know - any thoughts who to send a report to?

 

Thanks for the help.

[FPCreative 1 Likes (Newbie)]

Discovered that filters don't work with GPU Mode:

http://esdot.ca/site/2011/fast-rendering-in-air-3-0-ios-android See: The gotchas.

[GreenSock 16,230 Likes (Superhero)]

Excellent, thanks for reporting your findings. Well, I don't mean "excellent" that things don't work in GPU mode, but I'm relieved to hear that the problem wasn't with TweenMax.