2 Replies Latest reply on Apr 27, 2010 10:38 AM by acath

    Can you fade in and fade out the same layer in the same page state?


      I am simulating a lot of touch interactions, and have a hand object that moves over the simllated screen. I want to add small "taps" under the hands to show touch; I can see how its easy to fade IN an object (say a small circle) that represents the touch; but how do I fade OUT that same object?


      Any help appreciated!



        • 1. Re: Can you fade in and fade out the same layer in the same page state?
          Tara Jane Feener Level 3

          Hey Rob,

          I think you can achieve the effect you're looking for by using 'on click' interactions in conjunction with action sequences.

          I just made a simple example, here are the steps:

          1) Select the component you'd like to react on 'tap'

          2) In the Interactions panel, click 'Add Interaction', and select 'play action sequence'

          3) The timelines panel should now be given focus, and display the new 'on click' action sequence

          4) Select the "circle" you'd like to make the fade in followed by fade out effect.  If their opacity is set to 0 at this point, use the layers panel to select them.

          5) With the circle selected, in the timelines panel click 'add action', located at the bottom.

          6) Select 'fade' from the options available.

          7) In the properties panel, define the fade properties (for fade in, obviously set 'from' to be 0, and 'to' to be 100)

          8) Repeat steps 5 through 7, but choose from=100 and to=0

          9) Arrange the fade in, and fade out events on the timeline to get the timing choreography right.

          10) If you haven't done so already, set the opacity of your circles to be 0.


          Does this work for you?

          Is this what you were looking for?

          Let me know if you need clarification on any of the steps.

          Thanks for posting, great question!


          • 2. Re: Can you fade in and fade out the same layer in the same page state?
            acath Level 4

            Here's how I would do it:



            1.  Create a component called "TouchIndicator".

            2.  Add two states: "Off", "On".

            3.  Create transitions between the states.

            4.  In the outer component, create an instance of "TouchIndicator" (e.g. drag it out from the Library panel).

            5.  Create the interaction that is supposed to trigger the touch. In the Interactions panel, choose "On (whatever)", "Play Action Sequence". When you hit OK, the timeline will switch to show the action sequence.

            6.  Select the touch indicator and choose "+ Add Action > Set Component State". Choose "On".

            7.  Choose "+ Add Action > Set Component State" again. Chose "Off".

            8.  Drag the second action to the right so that you have "Set Component State: On" at time 0 and "Set Component State: Off" at some later time.

            9.  Now you have an interaction which triggers an action sequence which transitions to "On" and then transitions to "Off".