This is a follow on to my previous blog entry:
http://blog.739saintlouis.com/2007/11/22/flex-linebreaks-in-the-datagrid/
Here I show how to deal with line breaks in itemRenderer and itemEditors instead of in a datagrid labelFunction.
(This is also a nice example of writing simple, separate itemRenderer and itemEditors.)
Read the rest of this post»
4 Comments »
This is a follow up to my previous linebreak post.
This demonstrates how to deal with parsing linebreaks when they are in the text data for a datagrid.
You can either escape them in your source text data as shown in the previous post or you can use a labelFunction and some simple regular expression parsing to handle the escaping.
Here is the application code:
<mx:application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:script>
<!–[CDATA[
private function format(item:Object, column:DataGridColumn):String{
var str:String=item[column.dataField]–> var myPattern:RegExp = /\\n/g;
var newStr:String=str.replace(myPattern, "\n");
return newStr;
}
]]>
</mx:script>
<mx:array id="arr1">
<mx:object articlename="Finding out a characters \nUnicode character \ncode" data="15">
<mx:object articlename="Setting an icon in an Alert control" data="14">
<mx:object articlename="Setting an icon in a Button control" data="13">
<mx:object articlename="Installing the latest nightly \nFlex 3 SDK build into Flex Builder 3" data="10">
<mx:object articlename="Detecting which button a user pressed to dismiss an Alert dialog" data="9">
<mx:object articlename="Using the Alert control" data="8">
<mx:object articlename="Formatting data tips in a Slider" data="7">
<mx:object articlename="Downloading the latest Adobe Labs version of Flex 3 SDK/Flex Builder 3 (codename: Moxie)" data="6">
</mx:object>
<mx:arraycollection id="arrColl" source="{arr1}">
<mx:array id="arr2">
<mx:object articlename="Finding out a characters {’\n‘}Unicode character code" data="15">
<mx:object articlename="Setting an icon in an Alert control" data="14">
<mx:object articlename="Setting an icon in a Button control" data="13">
<mx:object articlename="Installing the latest nightly {’\n‘}Flex 3 SDK build into Flex Builder 3" data="10">
<mx:object articlename="Detecting which button a user pressed to dismiss an Alert dialog" data="9">
<mx:object articlename="Using the Alert control" data="8">
<mx:object articlename="Formatting data tips in a Slider" data="7">
<mx:object articlename="Downloading the latest Adobe Labs version of Flex 3 SDK/Flex Builder 3 (codename: Moxie)" data="6">
</mx:object>
<mx:arraycollection id="arrColl2" source="{arr2}">
<mx:text text="this dg uses a labelFunction to manipulate the linebreaks">
<mx:datagrid id="dataGrid" dataprovider="{arrColl}" variablerowheight="true" width="60%" height="35%">
<mx:columns>
<mx:datagridcolumn labelfunction="format" datafield="articleName" headertext="Name of the article in question">
<mx:datagridcolumn datafield="data" headertext="ID of the article">
</mx:datagridcolumn>
</mx:datagridcolumn>
<mx:text text="this dg has the linebreaks modified in the source {’\n‘}arraycollection using curly braces and single quotes.">
<mx:datagrid dataprovider="{arrColl2}" variablerowheight="true" width="60%" height="35%">
<mx:columns>
<mx:datagridcolumn datafield="articleName" headertext="Name of the article in question">
<mx:datagridcolumn datafield="data" headertext="ID of the article">
</mx:datagridcolumn>
</mx:datagridcolumn>
</mx:columns>
</mx:datagrid></mx:text></mx:columns></mx:datagrid></mx:text></mx:arraycollection></mx:object></mx:object></mx:object></mx:object></mx:object></mx:object></mx:object></mx:array></mx:arraycollection></mx:object></mx:object></mx:object></mx:object></mx:object></mx:object></mx:object></mx:array></mx:application>
Browse the source of this example.
Download a zipfile containing the source to this sample.
This movie requires Flash Player 9
No Comments »
I had a customer who was having problems with linebreaks in her Flex code.
I had used linebreaks before with no problem until I realized that she was setting text with linebreaks in mxml and not setting properties dynamically as I had done in all instances in teh past when dealing with linebreaks.
I search the Adobe public bugbase and found this bug:
http://bugs.adobe.com/jira/browse/SDK-12649
I thought I’d write a simple app to demonstrate the problem and workarounds.
Here is the source for the app:
<mx:application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:label id="ta1" height="75" width="250" text="This does not \nwrap">
<mx:button label="click to set via actionscript" click="ta2.text=’Setting via actionscript and\nthis does wrap’">
<mx:label id="ta2" height="75" width="250">
<mx:label id="ta3" height="75" width="250" text="Alternatively with this workaround,{’\n‘}this wraps too">
</mx:label>
</mx:label></mx:button></mx:label></mx:application>
Browse the source of this example.
Download a zipfile containing the source to this sample.
This movie requires Flash Player 9
1 Comment »
Recent Comments