Toggling the control bar in a Flex RichTextEditor control (redux)

It seems that I’ve covered this before, “Toggling the control bar in a Flex RichTextEditor control”, but here is another useful way to toggle the control bar in a Flex RichTextEditor control. The following example shows how you can toggle the RichTextEditor control’s control bar by moving the mouse cursor over or out of the RichTextEditor instance.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/12/31/toggling-the-control-bar-in-a-flex-richtexteditor-control-redux/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:RichTextEditor id="richTextEditor"
            title="RichTextEditor"
            status="version {richTextEditor.getStyle('version')}"
            showControlBar="false"
            cornerRadius="0"
            width="100%"
            height="100%"
            rollOut="richTextEditor.showControlBar = false;"
            rollOver="richTextEditor.showControlBar = true;" />

    <mx:Label text="Roll over the RichTextEditor control above to toggle the control bar." />

</mx:Application>

View source is enabled in the following example.

3 thoughts on “Toggling the control bar in a Flex RichTextEditor control (redux)

  1. Very responsive and quiet cool. I can not wait until I can do this kind of stuff. However, when I go to change the font size via the select control, it goes away.

  2. Mark Fuqua,

    Ha, good point. I never noticed that. It seems that when you move your mouse over the ComboBox control’s dropdown menu it is dispatching a rollOut event for the RichTextEditor control. It seems to work if you use your mouse to select a font name or font size though.

    Peter

Comments are closed.