Main

July 03, 2007

Z-Order of Components in a Flex Canvas

This isn't a blog about Flex bugs - honest. But I found another yesterday.

If you have a bunch of components in a Flex Canvas, and show/hide/animate them with states and transitions, the components can change z-order on you without warning. I had a pernicious problem today with something like:

<mx:Canvas> 
 <mx:Panel id='content'/> 
 <mx:Panel id='tool_palette'/> 
</mx:Canvas>

Where content started out behind tool_palette, but when the latter got hidden (using a RemoveChild node in a state), and reappeared (by transitioning back) it was shown behind the content panel. Clearly a problem.

The solution I found was to separate the objects into two canvases:

<mx:Canvas> 
 <mx:Canvas height="100%" width="100%"> 
  <mx:Panel id='content'/> 
 </mx:Canvas> 
 <mx:Canvas height="100%" width="100%"> 
  <mx:Panel id='tool_palette'/> 
 </mx:Canvas> 
</mx:Canvas>

which is a bit of a hack, but works. This is the first time I've missed old-flash's z-depth model.

July 01, 2007

Binding Selected Items in a Flex List

Just a quickie.

Discovered today that if you try to programatically deselect the currently selected item in a ListBase subclass with selectedItem=null the change doesn't propagate to anything bound to {my_list.selectedItem}. In fact in my application it seems to permanently break the data binding.

Instead, to deselect a list item, do selectedIndex=-1, that seems to work.

So I've got something like:

 <mx:Button label="Clear" click="entries.selectedIndex=-1"/> 
 <mx:List id="entries" dataProvider="{my_data}"/> 
 <components:MyEntryDisplay entry="{entries.selectedItem}"/>

which is fine for me.