RichTextEditor control in Flex4


 

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.

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>

0

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

]]>

</fx:Script>

1

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

<mx:RichTextEditor id="richtxtedit"

x="13" y="12"

2

width="483"

chromeColor="#333333"

cornerRadius="30"

3

symbolColor="#ffffff"

headerHeight="40"

htmlText="{htmlData}"

4

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

contentBackgroundColor="#555555"

titleStyleName="titleStyle"

5

controlBarStyleName="controlbarStyle"

dropShadowVisible="false"

focusColor="#000000"/>

6

</s:Panel>

</s:Application>

Output:

7

Running Application:

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

Download this code

8

Ads