Solved

Flex ItemRenderer in grid no longer uses datagrid styling.

Posted on 2010-09-20
2
551 Views
Last Modified: 2013-11-11
I have a datagrid with a column that uses an ItemRenderer (Text component since it is multi-lined) to set the font style to italics when the column contains a certain value.  This works fine.  My problem is that the column no longer displays the css styles set for the datagrid.  The rollover color is working, but the textRollOverColor and textSelectedColor are no longer working.  How do I get my Text ItemRenderer to maintain the datagrid styles?  Thanks.
0
Comment
Question by:trudyhlittle
2 Comments
 
LVL 11

Accepted Solution

by:
petiex earned 250 total points
ID: 33726467
I think the problem is that the mx.controls.Text component does not have a textRollOverColor or textSelectedColor style.

To simulate the textRollOverColor style in the renderer, you could add event listeners to the mouseOver and mouseOut events to change the Text control's style["color"] to the roll-over color and back to the default color, respectively. Then for the textSelectedColor, you could change the text color on the focusIn and focusOut events of the dataGridColumn.

OR, I think you could just extend the default DataGridItemRenderer, override the set data function to conditionally set the style to italic using something like the attached code, and then, to allow for multi-line text, just set variableRowHeight="true" on the DataGrid, and set wordWrap="true" on the DataGridColumn.
package testflex {
import mx.controls.dataGridClasses.DataGridItemRenderer;

public class TestRenderer extends DataGridItemRenderer {
    public function TestRenderer() {
        super();
    }
    public override function set data(data:Object):void{
        if(data["clam"]=="try"){// set the field value where you want to italicize
            setStyle("fontStyle", "italic");
        }
        super.data = data;
    }
}
}

Open in new window

0
 

Author Closing Comment

by:trudyhlittle
ID: 33726922
Thanks a bunch.  I tried using the MouseOver and MouseOut events originally.  This worked if the user was actually over the data column itself, however, if they were hovering over another column when the were selected a row, the rollovers weren't displayed.  Extending the DataGridItemRenderer worked and with a lot less coding.  Thanks.
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Here are some practices and techniques that can be adopted into your Flash/Flex application development process. Note: Not all "performance tips" provide an immediately-recognizable benefit.   This article does not include timing validation data,…
The last time I worked with Flash and Socket connections was in AS1. A recent project required flash connecting to a Socket, and sending receiving information - we figured it would be easy enough - we all know about the socket policy documents and c…
The goal of the tutorial is to teach the user how to how to record live broadcast.
The goal of the tutorial is to teach the user what frame rate is, how to control it and what effect it has on the video.

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question