Techno Curry

In my last blog post I talked about the Spark Tree from Maxim . When I was looking for a Spark Tree my final objective was to have a Spark Tree with a custom renderer that involved a three state checkbox. A checkbox that could show selected, unselected and "intermediate" states. After googling a bit I decided it was a good exercise to build on from scratch in Spark using Skins. It turned out to be much easier than I thought so I decided Ill share the full sample code here. 

This sample is a Spark Tree from Maxim http://kachurovskiy.com/2010/spark-tree/ that has a Custom Renderer with a 3 state checkbox that indicates when a child element is selected. I have also included a custom class for the Data which controls the child elements and parent elements states. This is just a sample so the code is a bit messy, since I did all the clean up in my main project after I established proof of concept. 

Here is the sample with view source enabled. Spark Tree with Checkbox renderer

First off thank you to Maxim for posting a really great Spark component. It was when I was trying to wrestle with a custom renderer for an mx tree that I started looking to see if someone had developed a Spark Tree component. Not only did I find a great component but it was free to use. Maxim has created this Spark Tree component by extending the spark List component and made it really easy to integrate into your project. One of my struggles with mx tree was that when you created item renderers that had varying height, the scroll bar would keep jumping around depending on what nodes you had expanded and collapsed. The great thing about the Spark Tree component from Maxim is that it extends the list with and by setting useVirtualLayout to false you can render all the nodes at once eliminating the varying size scrollbar. It is also extremely easy to implement your own itemrenderer by using the DefaultItemRenderer as a template.