5 Replies Latest reply on Jan 12, 2010 1:28 PM by Tvoliter

    Assigning Multiple Actions to one Group

    DrewPaluRebDre

      I am trying to create a wheel of buttons that rotates each button to the top of the wheel when clicked.  I attached a static image of what I working with.  Each "thought bubble" is a button but all of the buttons are all grouped so they will rotate together.  Ideally I would like the whole wheel to spin when one button is clicked.  I can manage this once, but after the wheel spins once, it will not spin again.  Also, I cannot manage to have the rotation angle be different for each action sequence attached to each button.  I would like the button that is pressed to rotate to the top of the wheel.

       

       

      Would apprecaite any thoughts or suggestions.

       

      Thanks.

      Drew

        • 1. Re: Assigning Multiple Actions to one Group
          Tvoliter Adobe Employee

          Hi Drew,

             Here is how I recommend building this:

           

          1. Draw with the wheel artwork, select it all, right click, and Convert to Custom Component

          2. Double click the new custom component to edit it

          3. Select each part of the wheel and convert it to a button (this is so we can assign click interactions later)

          4. Click "Duplicate State" several times. You will want a state for each position on the wheel

          5. Now you need to edit the rotation of the wheel in each state to put the "active" bubblle in the right location.

             Go to each state and use the Transform tool to rotate the entire wheel. Each state will remember this rotation

          6. Now select each button on the wheel, and in the Interactions panel create a "On Click Play Transition to State X" interaction

           

          Lastly, you need to handle the animation:

          7. Since you rotated the wheel in each state, Catalyst automatically generated effects for you in the timeline, but they don't have a duration. Shift-select all the transtions in the left side of the Timeline panel and then click the "Smooth Transitions" button. This will smooth everything in one go.

           

          Ty

          1 person found this helpful
          • 2. Re: Assigning Multiple Actions to one Group
            DrewPaluRebDre Level 1

            Thanks so much!  That is totally working.

             

            But I am still having a problem.  In addition to the rotation I would like to have a new group of images appear in each state, like a popup -- i have attached an image.  I understand how to do this in the transition timing, but when I click the button i have created to fade out the new images (popup) the wheel buttons no longer function.

             

            Any thoughts?

            • 3. Re: Assigning Multiple Actions to one Group
              Tvoliter Adobe Employee

              Glad to hear that got you going.

              I am guessing now  you have a custom component with a whole bunch of states. In each state the wheel is rotated to a different position and you have an additional graphic in each state for the bubble. For each transition you have a Rotate effect that moves the wheel and then a Fade In effect that shows the bubble. If I understand right, after the bubble is dismissed by clicking on the "x" the wheel doesn't work?

               

              I am curious, are you changing visibility or alpha on the bubble to hide and hide it? I ask because if you set alpha=0, then the object is not visible, but it will get mouse clicks. If it is on top, then it will prevent clicking on objects underneath. Make sure you are using visibility (the eyeballs) then when the popup disappears the wheel will be clickable.

               

              By the way, if you have 10 or so different popups and you want it so that clicking the "X" closes them, here's an efficient way to do this. Create a single "X" button. Create an interaction for this button "On click play action sequence". You now have an action sequence in the timeline. Now shift select all the popups in the layers panel, and in the Timeline choose Add Action > Set Property. In the properties inspector adjust the Set Property effect so it sets visibile to false. Now the x will hide all popups, so you can reuse this X for every state.

               

              - Ty

              1 person found this helpful
              • 4. Re: Assigning Multiple Actions to one Group
                DrewPaluRebDre Level 1

                You are understanding -- and thanks for being so helpful.

                 

                I am a bit confused by your questions wether I am changing the visibility or the alpha.  For my "close" buttons I am using a fade action and setting the transparency from -- to 0.  Perhaps there is a cleaner way to accomplish this. . .  The trouble with using the eyeballs is i want the "popups" to appear when the new state loads and only disappear when the "X" is clicked (but be able to reload when that state is loaded again).  I am not sure how to use the eyeballs in an action sequence or if that is even possible.

                 

                Your tip about creating one "close" button is much appreciated.  I have attempted it, but I do not see where to see how to set the property effect to visible false.  When I select "set property" from the "add action" menu the only options I can see in the properties inspector are property (which has the options Alpha or Enabled).

                 

                I think there is a problem with the way I am "closing" the popups, but I am not sure the best way to fix it. . .

                • 5. Re: Assigning Multiple Actions to one Group
                  Tvoliter Adobe Employee

                  My mistake, it looks like the "Set Property" action in the timeline doesn't current offer "visible" as a settable attribute. I have a bug in the works to fix that for the next release.

                   

                  Here is a work-around. Make a custom component out of the item you are using as the popup. Make the popup custom component have two states, one where the content is visible, the other where it is not. Then in the action sequence in the application that closes the popup you can use the "Set component state" action to set the popup custom component to the state in which it is invisible.

                   

                  Ty