3 Replies Latest reply on Jan 21, 2010 3:53 PM by Primal Atom

    Scroll bar, buttons and a Custom Component - help

    dougtimber

      Thanks to another forum I was able to create a scroll panel and add a scroll bar to it.  That works fine.  Inside the scroll panel I have thumbnails of the product that I'm highlighting.  I want to be able to click on the thumbnail and have a full size photo of the product come up in the window next to the scroll panel.  I created a custom component that has a stage showing each full size product individually.  This worked fine when I simply had buttons and no scroll bar.  I could convert the thumbnail to a button and then add interaction so that it would go to the proper state of the custom component.  Where I'm having problems is now that I've imbedded the buttons in a scroll panel I'm no longer given the custom component as an option to pick from.  I can add interaction, but it only gives me the option of picking one of the pages, and not a component.

       

      I've attached a screen grab to help show what I'm describing.

       

      Any ideas?

       

      Doug

        • 1. Re: Scroll bar, buttons and a Custom Component - help
          acath Level 4

          Hi Doug,

           

          Indeed, you've hit one of the limitations of Interactions in Flash Catalyst: you can only change the state of the the main application, the current component, or a child component - not a sibling or cousin component.

           

          There are two ways to work around this:

           

           

          1.  Instead of putting the full-size images in a custom component, make them states of your application. This may or may not be feasible for your application.

          2.  Instead of using a scroll panel for the content on the left, consider using a Data List. A Data List consists of a template that is repeated and filled in once for each piece of data in your list. Having looked at your application, I'd recommend doing it this way. Here's a video we made on working with Data Lists: http://tv.adobe.com/watch/adc-presents/working-with-lists-and-data-in-flash-catalyst

           

          -Adam

          • 2. Re: Scroll bar, buttons and a Custom Component - help
            disguy

            If Doug were to do number 2, and creates a data list for the handbags, would he inlcude the large picture of the handbag in his data list? 

            I'm trying to create a panel with buttons that play videos in a video player and discovered I can't add interactions to repeated items.  Does this mean I should include the video I want to play in my data list.  Here's a pic of what I'm trying to do.

            • 3. Re: Scroll bar, buttons and a Custom Component - help
              Primal Atom Level 1

              Doug, thanks for asking this question.

               

              Hi ADAM...

              It seems that a lot of us are asking the same question: Scrollbar Navigation-Make Actionable

              (I created a low-fidelity proof-of-concept to test—using a datalist as you suggested. See link in my posting).

               

              I have reviewed the video you refer to here, but you example still does not allow for individual items in the datalist (scrollbar) to be assigned individual actionable events.

               

              Can you expain your thinking in Option 1, as a workaround? Do you have any other suggestions?

               

              BOTTOM LINE

              We are all looking to do the same thing... something we are going to see A LOT MORE of after Uncle Steve's TABLET presentation next week:

              A scrolling menu, with selected items in the menu causing "navigation" to a certain point in a scroll panel. (imitating the flick or slide effect of iPhone).

               

               

              Suggestion: Can you add a field to thedatalist so that when the "repeated item" (in edit mode) is configuredto do an action (i.e., On-Click, Transition to State), we can then assign the state  you'd like for each item in thetable itself?

               

              Now the issue is making it change the "State" within another component (i.e. scrolling panel). Can that be done?

               

              Thanks,

              - Rick