5 Replies Latest reply on Sep 14, 2010 11:35 PM by Shongrunden

    Responding only to the Item Renderer Click

    RKaster Level 1

      I'm working on an application right now where I've built an archive of images along with their titles. The archive is displayed in a s:list, and the items are displayed through an Item Renderer. The way I had it work previously is I put the click inline on the list component, which worked, except it has a little problem as you can expect. Whenver I click anything else in the list, such as the scroller or black space, it performs the action click handler. I want it to activate only if it's an item renderer that was clicked.

       

      Since it's inside of a component, how might I achieve this while still maintaining my linking? Is there an easy way? Or will I have to reorganize this a bit more? I wouldn't know since I can't create metadata within the item render component.

        • 1. Re: Responding only to the Item Renderer Click
          krafttimd

          You could just have your code ignore the processing if the events target is not the item renderer.

           

          The code might look like this:

           

          private function listClickHandler(event:MouseEvent) : void {

               if(event.target is myRenderer)

               {

                    // process the clicked item

               }

          }

           

          hope this helps,

          T.K.

          • 2. Re: Responding only to the Item Renderer Click
            RKaster Level 1

            I think that's on the right track. I tried as you suggested, but I think I'm making a silly mistake. You typed myRenderer, but what is that referencing exactly? My item renderer isn't inline, so I don't know how to reference. And even when I ID it, it can't be found by the function, which I'm guess is a result of being inside of a function.

             

            However I tried taking your idea and telling the function:

             

            protected function red_clickHandler(event:MouseEvent):void
                        {
                            if(event.target is Scroller)
                            {
                                null;
                            }
                            else
                            {
                            Alert.show("I've been clicked!");
                            }
                        }

             

            But it didn't work.

            • 3. Re: Responding only to the Item Renderer Click
              krafttimd Level 2

              My bad...you should use an itemClick event for a list component. The event has these properties copied from the language reference:

              property               value

              bubblesfalse
              cancelablefalse
              columnIndexThe zero-based index of the              column associated with the event.
              currentTargetThe Object that defines the             event listener that handles the event. For example, if you use             myButton.addEventListener() to register an event listener,             myButton is the value of the currentTarget.
              itemRendererThe item renderer that was               clicked.
              reasonnull
              rowIndexThe zero-based index of the              item associated with the event.
              targetThe Object that dispatched the event;             it is not always the Object listening for the event.             Use the currentTarget property to always access the             Object listening for the event.
              TypeListEvent.ITEM_CLICK

               

              T.K.

              1 person found this helpful
              • 4. Re: Responding only to the Item Renderer Click
                RKaster Level 1

                Goodness, I thought that was the one, it all made perfect sense. But I wrote this:

                 

                            protected function inti():void
                            {
                                red.addEventListener(ListEvent.ITEM_CLICK, theClicker);
                            }
                           
                            protected function theClicker():void
                            {
                                Alert.show("I've been clicked!");
                            }

                 

                And it's still unresponsive. Am I doing it wrong? I'm still very new to Flex and making my way around.

                • 5. Re: Responding only to the Item Renderer Click
                  Shongrunden Adobe Employee

                  Are you using the spark List?  If so there is no longer an itemClick event on it like there was for the mx List.  Check out this thread for an example of adding a click handler to the renderer itself: http://forums.adobe.com/message/2569370#2569370