Flex Examples » depthColors http://blog.flexexamples.com Just a bunch of Adobe Flex Examples Wed, 26 Jan 2011 18:09:51 +0000 en hourly 1 Alternating row colors in a Flex Tree control using the depthColors style http://blog.flexexamples.com/2007/11/27/alternating-row-colors-in-a-flex-tree-control-using-the-depthcolors-style/ http://blog.flexexamples.com/2007/11/27/alternating-row-colors-in-a-flex-tree-control-using-the-depthcolors-style/#comments Wed, 28 Nov 2007 05:22:54 +0000 Peter deHaan http://blog.flexexamples.com/2007/11/27/alternating-row-colors-in-a-flex-tree-control-using-the-depthcolors-style/ In a previous example, “Alternating row colors in a Flex Tree control using the alternatingItemColors style”, we saw how you can alternate row colors by setting the alternatingItemColors style.
The following example shows how you can alternate item colors based on the item’s depth in a Flex Tree control by setting the depthColors [...]]]> In a previous example, “Alternating row colors in a Flex Tree control using the alternatingItemColors style”, we saw how you can alternate row colors by setting the alternatingItemColors style.
The following example shows how you can alternate item colors based on the item’s depth in a Flex Tree control by setting the depthColors 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-depthcolors-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.1.1">
                            <node label="One.1.1.1">
                                <node label="One.1.1.1.1" />
                            </node>
                        </node>
                    </node>
                    <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"
            depthColors="[#FFFFFF, #EEEEEE, #DDDDDD, #CCCCCC, #BBBBBB, #AAAAAA]"
            rowCount="4"
            width="300" />

</mx:Application>

View source is enabled in the following example.

 
]]> http://blog.flexexamples.com/2007/11/27/alternating-row-colors-in-a-flex-tree-control-using-the-depthcolors-style/feed/ 0