Musings on AdvancedDataGrid (Part 2)

english mobile

Review Part 1

I'd found a neat little sample that shows how to change the background color on the row by extending AdvancedDataGridItemRenderer (ADGIR) to set the existing background and backgroundColor properties based on a style set on the component.

I had no trouble copying this, but I found that for some reason the entire first column stubbornly refused to pick up my carefully applied color. Undaunted, I set the itemRenderer property of the first column explicitly to my extended ADGIR.

The result I had was closer to what I wanted--most of the cells in that column now had the color my styleFunction had insisted upon--but the ones with the triangle in them remained white. Aha! Clearly this was a different thing altogether, so I went back to the docs and looked for inspiration. It seems that the uncolored cells were being rendered by another component, the AdvancedDataGridGroupItemRenderer (ADGGIR).

So I set about extending that worthy component. At first, I thought I'd be able to just cut and paste the code I'd modified for my ADGIR, but no such luck. Unfortunately, the ADGGIR had no background or backgroundColor properties. So I fell back on more conventional tactics, drawing a rectangular background on the component when the style changed. First lesson: the AdvancedDataGridItemRenderer is based on the Flash TextField component and the AdvancedGridGroupItemRenderer is based on UIComponent. These two components have completely different capabilities and must be dealt with in entirely different ways.

As soon as I saw my extended ADGGIR next to the extended ADGIR, I realized that the ADGIR was not yeilding to my attempts to set its alpha transparency. I'd included code in both to set the alpha transparency, but it was only working in the ADGGIR.

Tomorrow, I'll talk about my attempts to add alpha transparency to the ADGIR.

Musings on AdvancedDataGrid (Part 1)

english mobile

This last week, I had my first experience with the AdvancedDataGrid component. I knew I needed to have multi-column heirarchical data display. I also needed to be able to dynamically color and also set an icon each row based on the content of the data item. I scoured the docs for a component that would meet these requirements, and the ADG's styleFunction and iconFunction seemed like they would fit the bill perfectly--and ultimately they did. But in the meantime, they led me on a merry chase because the docs didn't include all the pieces I needed to understand what was happening. Ultimately I did understand it, so I thought I'd pass my surmises along in the hope that others can shortcut the many hours I spent on the problem.

Tomorrow, I'll talk about the relationship between AdvancedDataGridItemRenderer and AdvancedDataGridGroupItemRenderer.

Using a CSS TypeSelector with an itemRenderer

english mobile

Today, I had more fun with item renderers. I had a component I was working on to try to prototype some new functionality, and I had set up styles for it in the <mx:styles> declaration of the Application tag. If I put my component in a container in the main Application, the style came through fine. If I used it as an itemRenderer of a List based class, only the text styles worked.

It seems that when you use a component this way, Flex will assign ListBaseContentHolder as the style name instead of the class name, but for some reason this only negates things like backround colors—text declarations come through just fine. This interesting feature isn't documented anywhere, so it took me a whole day to figure out the fix, which is so simple I wanted to pound my head against the wall till I couldn't see straight.

override protected function commitProperties():void{
this.styleName = this.className;
}

Hope this saves someone some time!