Alternating row colors in a Flex Tree control using the alternatingItemColors style

by Peter deHaan on November 27, 2007

in Tree

The following example shows how you can alternate item colors in a Flex Tree control by setting the alternatingItemColors style to an array of colors.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/11/27/alternating-row-colors-in-a-flex-tree-control-using-the-alternatingitemcolors-style/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:XMLListCollection id="xmlListColl">
        <mx:source>
            <mx:XMLList>
                <node label="One">
                    <node label="One.1" />
                    <node label="One.2" />
                    <node label="One.3" />
                </node>
                <node label="Two">
                    <node label="Two.1" />
                    <node label="Two.2" />
                    <node label="Two.3" />
                </node>
            </mx:XMLList>
        </mx:source>
    </mx:XMLListCollection>

    <mx:Tree id="tree"
            dataProvider="{xmlListColl}"
            labelField="@label"
            alternatingItemColors="[#DFDFDF,#EEEEEE]"
            rowCount="4"
            width="300" />

</mx:Application>

View source is enabled in the following example.

{ 1 comment… read it below or add one }

1 GT August 27, 2008 at 9:21 am

Excellent little tute – like many of the things I’ve cribbed from your site (I applied it to a DataGrid though).

It is amazing the amount of out of date stuff there is out there – perhaps things changedbetween FLex2 and 3, but when I initially went a-Googling for a way to alternate row colours I got ll manner of stuff talking about how hard it was.

Your tute on XML Filtering, and a couple of others, have between them saved me dozens of hours of graft. (I’m an economist by training, with the native programming ability of a hockey puck).

Cheers

GT
France (actually I’m Australian)

Reply

Leave a Comment

Sorry, this blog is terrible at eating HTML comments.
If you're pasting any HTML/XML/MXML code, you need to convert your < characters to &lt; and your > characters to &gt; .

You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

Anti-Spam Protection by WP-SpamFree

Previous post:

Next post: