Flex: Datagrid, break line in case of very long string

Question

Hi,

I am trying to implement simple chat application using flex. In it all my chat messages are stored as array collection items, where each item is a string (correspondent to one chat message). I am using datagrid to display all messages. One message goes to one cell of datagrid.

Here how it looks: http://img.skitch.com/20091129-qt3gjneh8ksygypyjnra67auf.png

I want to add a feature for the tool to handle big lines of text. Is there a way to implement line break in case it's very long.

Thanks in advance

Answer 1

I haven't used flex in a while, but I can think of 2 ways to deal with this:

You create a custom renderer, or alter the existing renderer's textfield to be multiline = true, wordWrap and autoSize = TextFieldAutoSize.LEFT.

You can try to get away by setting a labelFunction. Something like:

//assuming an item has a user and a message property, your might be called something else
private function chopString(item:Object):String{
   var fullMess:String = item.user + " > " + item.message;
   if(fullMess.length > 30) fullMess.substr(0,30) + "\n" + fullMess.substr(0,31);
}

That is rough code, you should test it and adjust it, but I hope the idea is readable. HTH

Answer 2

Just add this two properties to your Datagrid and Datagrid column.

<mx:Datagrid variableRowHeight="true" 

<mx:DataGridColumn wordWrap="true"

Just a note: you should probably use a List here, as it would be sufficient to display a single column of messages, and is more lightweight.