The following example shows how you can remove controls from the MX RichTextEditor control by removing the controls from the display list and resizing the linkTextInput TextInput control.

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2010/02/17/removing-controls-from-the-mx-richtexteditor-control-in-flex/ -->
<mx:Application name="RichTextEditor_linkTextInput_test"
        xmlns:mx="http://www.adobe.com/2006/mxml"
        xmlns:comps="comps.*"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">
 
    <comps:LinkOnlyRichTextEditor />
 
</mx:Application>

And the custom RichTextEditor control, comps/LinkOnlyRichTextEditor.mxml, is as follows:

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2010/02/17/removing-controls-from-the-mx-richtexteditor-control-in-flex/ -->
<mx:RichTextEditor name="LinkOnlyRichTextEditor"
        xmlns:mx="http://www.adobe.com/2006/mxml"
        creationComplete="init();">
 
    <mx:Script>
        <![CDATA[
            private function init():void {
                // remove unwanted controls...
                fontFamilyCombo.parent.removeChild(fontFamilyCombo);
                fontSizeCombo.parent.removeChild(fontSizeCombo);
                toolBar2.parent.removeChild(toolBar2);
                colorPicker.parent.removeChild(colorPicker);
                alignButtons.parent.removeChild(alignButtons);
                bulletButton.parent.removeChild(bulletButton);
 
                // remove vertical separators...
                _RichTextEditor_VRule1.parent.removeChild(_RichTextEditor_VRule1);
                _RichTextEditor_VRule2.parent.removeChild(_RichTextEditor_VRule2);
 
                // resize link TextInput control...
                linkTextInput.width = toolbar.width;
            }
        ]]>
    </mx:Script>
 
</mx:RichTextEditor>
 
Tagged with:
 
About The Author

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.

2 Responses to Removing controls from the MX RichTextEditor control in Flex

  1. Cesare says:

    Pretty “hacky” but works :)

  2. Arto says:

    Does anybody knows how to remove container?
    I need only textarea to be visible, whithout any borders or containers.

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

Anti-Spam Protection by WP-SpamFree