Flex Examples
The following example shows how you can truncate text in the Spark RichText control in Flex 4 by setting the maxDisplayedLines property and specifying the maximum number of visible lines.
The following example(s) require Flash Player 10 and the Adobe Flex 4 SDK. To download the Adobe Flash Builder 4 trial, see http://www.adobe.com/products/flex/. To download the latest nightly build of the Flex 4 SDK, see http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4.
For more information on getting started with Flex 4 and Flash Builder 4, see the official Adobe Flex Team blog.
<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2009/05/27/truncating-text-with-the-spark-richtext-control-in-flex-gumbo/ --> <s:Application name="Spark_RichText_maxDisplayedLines_test" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"> <s:controlBarContent> <mx:Form> <mx:FormItem label="truncation:"> <s:HSlider id="slider" minimum="-1" maximum="22" /> </mx:FormItem> </mx:Form> </s:controlBarContent> <s:RichText id="richText" maxDisplayedLines="{slider.value}" width="200" horizontalCenter="0" verticalCenter="0"> <s:text><fx:String source="dummy.txt" /></s:text> </s:RichText> </s:Application>
View source is enabled in the following example.
You can also set the maxDisplayedLines property using ActionScript, as seen in the following example:
<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2009/05/27/truncating-text-with-the-spark-richtext-control-in-flex-gumbo/ --> <s:Application name="Spark_RichText_maxDisplayedLines_test" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"> <s:controlBarContent> <mx:Form> <mx:FormItem label="truncation:"> <s:HSlider id="slider" minimum="-1" maximum="22" change="slider_changeHandler(event);" /> </mx:FormItem> </mx:Form> </s:controlBarContent> <fx:Script> <![CDATA[ protected function slider_changeHandler(evt:Event):void { richText.maxDisplayedLines = slider.value; } ]]> </fx:Script> <s:RichText id="richText" width="200" horizontalCenter="0" verticalCenter="0"> <s:text><fx:String source="dummy.txt" /></s:text> </s:RichText> </s:Application>
This entry is based on a beta version of the Flex 4 SDK and therefore is very likely to change as development of the Flex SDK continues. The API can (and will) change causing examples to possibly not compile in newer versions of the Flex 4 SDK.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
Share
hey …
i hav to looking for solution to connect to oracle database from AIR application …the application is installed on machine is not same as one database is installed on … i know its not the right post to ask abt oracle connectivity … but i cudnt find any such post … and hopefully u will read comments on ur latest post more likely than ur older posrt … if u do anything abt how to solve my problem plz let me know here or if possible on email address i provided as i cudnt find anything on it so far … thanks in advance
PS : same request is posted on ur air examples site too .. i just really need a solution :|
regards
Yogesh Gaur
yogesh gaur,
I don’t think you can talk directly to a database from ActionScript/AIR (but I could be wrong). I believe that you’ll need to proxy DB requests through a server-side-script using ColdFusion/Java/PHP/<other>.
Your best bet would be to ask in the FlexCoders list and see what suggestions everybody has.
Peter
hi Peter deHaan ,
thanks for the quick reply …you are correct that u cannot connect directly to a database from ActionScript/AIR atleast oracle ( i hav seen one api for mysql connection but its still in development ) … i also know u can use httpservice request in air application …. but whenever i use it ..since i hav to give full url “http://://page location … its giving me server error and request fail error .. if u do know anything abt it .. ur help will be directly appreciated .. in the meanwhile i will post about the same on http://www.flexcoders.com
thanks again
Yogesh
Truncating text is always hard, the most difficult part is knowing where to start eliding so it fits in the available space — does this code do the right thing for that?
To be honest I am a huge fan of Flex 4, but I have found truncating text tough – thanks for the head up!
Hi
This is a nice feature, but is it possible to disable the truncation inside words?
For example my text is:
this text ends with a longlonglong word.
If i truncate it at 100 pixels, the text will be:
this text ends with a longlon…
By my client wants to have:
this text ends with a…
So basically truncation should cut the whole word, and not in the middle of it.
If its not possible can you tell me the function which handles the text truncation?
Thanks.
is there any way to do the same with RichEditableText? (editable=false but needed selection capabilities)