Creating custom List renderers, the complete guide (Part II)

Continuing from the last post, this entry just adds a few more tips for working with List controls.

Creating RollOver/hit states:
In the last entry I had shown how to create custom renderers that respected their position in the List. The next thing you will probably need to do is create custom rollover effects. One way to do is to add event listeners to Mouse Events in your renderer. However there is a better way. Since your renderer is aware of the List it is a part of, you can modify your updateDisplayList function with the following snippet:
if(this.owner as List &&
((this.owner as List).isItemHighlighted(this._data)){
// instructions on how to draw out the over state

It should be noted that this function will only work if the useRollOver is set to true and will not be executed otherwise. Once again this lets you create renderers whose behavior can be controlled by the List settings.

To create a hit state, you can use the isItemSelected() method the same way.

Attaching your renderer via actionscript:
The final tip I would like to mention is the way you can attach your renderer using actionscript. This technique is more useful if you want to create a list with multiple views, for example a simple text, image+text and just image view of some kind of data. The first time I implemented this was by creating two Lists and switching between them. A better way is to switch item renderers via actionscript. To do this we must remember that Lists use a ClassFactory to generate new item renderers as needed. So assigning the renderer to the list is as easy as shown:

list.itemRenderer = new ClassFactory(YourCustomRendererClass);

Thats it. Hopefully these 5 tips will help you create lighter item renderers and get better performance off your Lists.

Author: Arpit Mathur

Arpit Mathur is a Principal Engineer at Comcast Labs where he is currently working on a variety of topics including Machine Learning, Affective Computing, and Blockchain applications. Arpit has also worked extensively on Android and iOS applications, Virtual Reality apps as well as with web technologies like JavaScript, HTML and Ruby on Rails. He also spent a couple of years in the User Experience team as a Creative Technologist.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: