Hidden Gems - mouseFocusChange

Today I was working on a project using the Flex TileList component to make an icon bank for a project I'm working on. The problem I ran into was deselecting the items. Like other ListBase Components, when an item gets selected in a TileList it stays selected until you select another item. I needed to unselect the icons when I clicked anywhere but an icon. My first thought was to use the onFocusOut event but that only worked when you clicked somewhere that took focus. Scanning through the list of events for the TileList component I saw the mouseFocusChange event that is fired by all DisplayObjects. I used it to change the selectedIndex to -1 and it worked as required. ...

Here's a sample of my MXML code for the icon bank

<?xml version="1.0" encoding="utf-8"?><mx:TileList xmlns:mx="http://www.adobe.com/2006/mxml" 
  itemRenderer="com.provismedia.dashboard.views.Icon" 
  backgroundAlpha="0" dataProvider="{model.userIconData}" 
  doubleClickEnabled="true" 
  itemDoubleClick="this.selectedItem.event.dispatch()"
  mouseFocusChange="this.selectedIndex=-1" >
  <mx:Script>
    <![CDATA[
      import mx.events.ListEvent;
      import com.provismedia.dashboard.model.DashboardModel;

      [Bindable]
      private var model:DashboardModel = DashboardModel.getInstance();
    ]]>
  </mx:Script>
</mx:TileList>

----
Daryl "Deacon" Ducharme is currently Director of Application Development for the Interactive Agency Provis Media Group, LLC which helps organizations enhance identity, connect with customers and increase productivity.

Previous
Previous

Sick Kids and Christmas

Next
Next

You've got Moxie - Flex Builder 3 Beta 3