Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Adobe AIR Development

Reply
Highlighted
Developer
Posts: 264
Registered: ‎10-05-2010
My Device: Not Specified

Fading images in Flex...

I'm trying to figure out how to fade between images in Flex. I want to use images in a counting sequence. It works now but the animation is not smooth. A nice crossfade would be better.

 

e.g. digit-1.png -> digit-2.png -> digit-3.png... etc...

 

I see lots of examples on the web for altering between two states. But how do you do it as a progression?

 

Can I polease borrow a code snippet?

 

Thanks

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Fading images in Flex...

You can use Tweener and change the alpha value of the image.  You can use the delay and onComplete methods to go from one image to the next.

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Fading images in Flex...

BTW, Tweener is in the QNX library so no need to use the MX.Fade class.

Developer
Posts: 264
Registered: ‎10-05-2010
My Device: Not Specified

Re: Fading images in Flex...

[ Edited ]

I seemed to have figured it out by defining 10 states - one per digit and then setting the Current State...

 

Not having a clue what I am doing... it works. But is it an efficient way to accomplish it?

 

More: Okay. It's maybe not scaling well. Images may or may not show up now... 

 

How do you manage currentState on different objects?

 

<s:states>
	<s:State name="m1s0"/>
	<s:State name="m1s1"/>
	<s:State name="m1s2"/>
	<s:State name="m1s3"/>
...

<s:transitions>
	<s:Transition id="tm1" fromState="*" toState="*">
		<s:CrossFade target="{m1}" duration="333" />
	</s:Transition>
...

<s:Group id="m1">
	<s:Image visible="false" visible.m1s0="true" width="150" height="300" source="dig-0.png"/>
	<s:Image visible="false" visible.m1s1="true" width="150" height="300" source="dig-1.png"/>
	<s:Image visible="false" visible.m1s2="true" width="150" height="300" source="dig-2.png"/>
...

	currentState = "m1s"+secs1;
	currentState = "m2s"+secs2;

 

 

Developer
Posts: 264
Registered: ‎10-05-2010
My Device: Not Specified

Re: Fading images in Flex...

Does the ONLY way to do this require alternating between two states?

Developer
Posts: 264
Registered: ‎10-05-2010
My Device: Not Specified

Re: Fading images in Flex...

[ Edited ]

I've added 

 

import caurina.transitions.Tweener;

 

But it says that Tweener can not be found. I've added the source to the library but still nothing. Using Burito...

 

What's the trick?

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Fading images in Flex...

Tweener is in the QNX BB library.

Developer
Posts: 264
Registered: ‎10-05-2010
My Device: Not Specified

Re: Fading images in Flex...

Yes but which one?

 

How on earth are people supposed to learn this stuff with the current state of the documentation???

Developer
Posts: 6,541
Registered: ‎10-27-2010
My Device: HTC One, PlayBook, LE Z10, DE Q10
My Carrier: Verizon

Re: Fading images in Flex...

QNX BB is merged with AIR 2.5 to build against one thing in FB.  I guess you're looking for individual SWC files?  There are 2 that have the qnx prefix.  Try one of those.

 

This is all beta, so documentation will always lag.  Hopefully documenation and tutorials will improve after 1.0.  The other issue that there are about 6 different ways to build an AIR application, so covering all those variations will be time consuming to document as well.  If you're using a "different" way then BB, then coding and documentation will probably always be a little more diffilcult.

Developer
Posts: 264
Registered: ‎10-05-2010
My Device: Not Specified

Re: Fading images in Flex...

But how do I get FlashBuilder to recognize any of the QNX libraries? I'm missing something fundamental here. Can you please explain in mode detail? 

 

Thanks