Search code examples
apache-flexeventslistflex4flex4.5

Detect mouse click on spark.components.List items, but ignore arrow keys


I have a custom component, containing a List displaying items from an XMLListCollection:

        [Bindable]
        private var _games:XMLListCollection = new XMLListCollection();

...

        <s:List itemRenderer="Game" dataProvider="{_games}"
          change="gameClicked(event)">
            <s:layout>
                <s:TileLayout />
            </s:layout>
        </s:List>

where XML data can look like this:

              <game id="0"/>
              <game id="9012">
                <user id="VK48058967" />
                <user id="MR14315189992643135976" />
                <user id="OK10218913103" />
              </game>
              <game id="9013">
                <user id="OK151358069597" />
                <user id="OK515549948434" />
              </game>

and the screenshot like this (representing joinable games with up to 3 players):

enter image description here

My problem is, that the change-Event listener is not only fired, when an item is clicked by mouse, but also when arrow keys on the keyboard are pressed:

        private function gameClicked(event:IndexChangeEvent):void {
            var game:XML = event.currentTarget.selectedItem as XML;
            if (game == null)
                return;
            Alert.show("Clicked game: " + game.@id);
            dispatchEvent(new PrefEvent(PrefEvent.GAME_CLICKED, game.@id));
        }

Also if I click twice, only 1 mouse click will cause my custom event to be dispatched (because obviously there is no change between the items).

Does anybody please know, how to make my List only react to mouse clicks?

UPDATE:

Yes, I've tried using "change" event for the List before, but then I have the problem that it is fired, even if the List scrollbar is clicked.


Solution

  • Erm, yourList.addEventListener(MouseEvent.CLICK, onClick)? Or you can just use the inline event in MXML. This listens for all clicks within the list.

    You might want to just have a custom item renderer have it's own click handler and dispatch a custom event that bubbles up where you can listen for it up the display list, so it can be more specific.