Home Tutorial Flex Flex4 Components RichTextEditor control in Flex4

 
 

Share on Google+Share on Google+
RichTextEditor control in Flex4
Posted on: June 24, 2010 at 12:00 AM
Advertisement
The RichTextEditor Control is a MX component. There is no spark component. The user can edit, enter and formatted a text in RichTextEditor control.

RichTextEditor control in Flex4:

The RichTextEditor Control is a MX component. There is no spark component.
The user can edit, enter and formatted a text in RichTextEditor control. It contains so many control which are following:

1. MX TextArea
2. Font family
3. Font size
4. Button bar of bold, italic and underline font style
5. Text color
6. Text alignment button: left, right, center and justify
7. Bullets
8. URL links

In this example you can see how we can use a RichTextEditor control.

Example:

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark"

xmlns:mx="library://ns.adobe.com/flex/mx"

minWidth="955" minHeight="600">

<fx:Style>

@namespace s "library://ns.adobe.com/flex/spark";

@namespace mx "library://ns.adobe.com/flex/mx";

.titleStyle{

color:#FFFFFF;

font-size:20;

font-family:courier;

font-weight:bold;

}

.controlbarStyle{

color:#FFFFFF;

}

</fx:Style>

<fx:Script><![CDATA[

[Bindable]

public var htmlData:String="<textformat leading='2'><p align='center'>

<b><font size='20' face='courier' color='#FFFFFF'><u>

<a href='http://www.roseindia.net'>Roseindia Technologies</a></u></font></b></p>

</textformat>" +

"<textformat leading='2'><p align='center'><b>

<font size='20' face='courier' color='#FFFFFF'><u><a href='http://http://www.roseindia.net/tutorial/flex/flex4/components'>FLEX 4</a></u></font></b></p></textformat>" +

"<textformat leading='2'><p align='left'><font size='16' color='#d31f1f'><i>

<b>Provided Training in</b></i></font></p></textformat>" +

"<br><textformat ><p align='left'><font size='14' face='courier' color='#808080'><li>Java</li><br><li>Php</li><br><li>iphone</li><br>

<li>Flex</li></font></p></textformat>";

]]>

</fx:Script>

<s:Panel title="RichTextEditor control Example" width="509" height="378">

<mx:RichTextEditor id="richtxtedit"

x="13" y="12"

width="483"

chromeColor="#333333"

cornerRadius="30"

symbolColor="#ffffff"

headerHeight="40"

htmlText="{htmlData}"

title="Rich Text Editor" height="320"

contentBackgroundColor="#555555"

titleStyleName="titleStyle"

controlBarStyleName="controlbarStyle"

dropShadowVisible="false"

focusColor="#000000"/>

</s:Panel>

</s:Application>

Output:

Running Application:

To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.

Download this code

Advertisement

Related Tags for RichTextEditor control in Flex4:


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: June 24, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com