The ItemRenderer class in Flex 4 has an itemIndex property that was added after beta2. You can use this property within your item renderer to display the row number or index of an item in a spark List.
Continue reading Displaying the row number or index in a spark List
ItemRenderer has logic built in that changes between some standard states like normal, hovered, selected, etc. You can supplement this logic by overriding ItemRenderer.getCurrentRendererState(), or do away with the built in states altogether by subclassing DataRenderer instead of ItemRenderer.
Continue reading Using DataRenderer to add custom states to a spark List renderer
HTML’s select control included a tag called optgroup where you could group items in the drop down together and provide a heading that wasn’t selectable. This post looks at making an equivalent component in Flex 4 by extending DropDownList.
Continue reading Spark DropDownList equivalent of the HTML optgroup tag
In spark components, the focusSkin is treated differently from the normal skin. Unlike the skin of a spark component, the focusSkin is not automatically sized or positioned by the component. Instead, it is added as the first child of the component. In addition, if the focusSkin has a property called
target is set to point to the parent component.
Continue reading Custom focus skin for spark components in Flex 4
The VerticalLayout and HorizontalLayout classes now support both the horizontalAlign and verticalAlign properties. This brings the VGroup and HGroup components in line with how the VBox and HBox halo controls worked.
Continue reading Major axis alignment now supported in spark
I recently created a form in Flex that required using multiple DropDownLists with a custom item renderer that loads in preview images of each item. This was really easy to do initially, but I noticed a couple performance issues that bothered me. I decided to improve the performance by implementing a simple caching strategy.
Continue reading Caching images loaded from a spark item renderer
The spark TitleWindow allows you to drag it around the stage through the use of a skin part called “moveArea”. By attaching mouse handlers to the moveArea, the TitleWindow can be dragged around the screen. In a similar fashion, we can add another skin part called “resizeHandle” to allow the TitleWindow to be resizable.
Continue reading Resizable TitleWindow in Flex 4
The spark List component in Flex 4 treats every item equally with regards to selection. Sometimes I find it useful to customize this behavior so certain items cannot be selected. You can simulate this behavior by customizing the item renderer to make the selected state visually identical to the normal state, but to get more accurate functionality you will need to subclass List.
Continue reading Disable selection on some items in a spark List
The spark List component in Flex 4 allows you to select multiple items when you set allowMultipleSelection to true. With this flag set you can select multiple items by using the control/command key.
If you want to have a List that allows multiple selection, but does not require the user to hold down the control key when selecting items you can subclass List and override the item_mouseDownHandler() method.
Continue reading Multiple selection in a spark List without the control key
The IVisualElement interface has both a parent and owner property defined on it. These can both be used to traverse up the display hierarchy, but there are some key differences to be aware of when working with either one.
Continue reading Differences between IVisualElement.parent and IVisualElement.owner