Placing graphics within a scroller area

Question

I have on one of my view a lot of text so I have created it so to scroll see below, (if wrong plese let me know):
<s:Scroller left="20" right="20" top="20" bottom="0">
     <s:RichEditableText percentWidth="100" percentHeight="100" editable="false" selectable="false">
          <s:p>My text goes here</s:p>
     </s:RichEditableText>
</s:Scroller>
Now with in this text would live to place some graphics like boxes with text inside as I want to create a diagram etc, but if i place my rectangle code (see below) with in the 'RichEditableText' section all goes well until till I click on a link to goto this view and nothing happens and it freezes up
<s:Rect width="135" height="71" radiusX="10">
     <s:fill>
<s:SolidColor color="#ff990" />
     </s:fill>
</s:Rect>
Does any one know how I can add the graphics etc with in there to work an scroll with the text, or am i using the wrong scroll method etc.
Many Thanks
Si

Answer 1

Ok I read the doc and searched the web and I found the problem.
RichEditableText can only accept text or InlineGraphicsElement. If you want to add graphics in the text, you will have to create an InlineGraphicsElement and add it to a paragraph.
My first suggestion would be to change your declaration for this :
<s:Scroller left="20" right="20" top="20" bottom="0">
   <s:RichEditableText percentWidth="100" percentHeight="100" editable="false" selectable="false">
        <s:textFlow>
           <s:TextFlow>
               <s:p id="firstPar">
                     My text goes here
               </s:p>
           </s:TextFlow>
       </s:textFlow>
  </s:RichEditableText>
</s:Scroller>
This will allow you to have more than 1 paragraph. It's how Adobe implement a RichEditableText in the doc.
To add a graphic to this paragraph, you will add this code in the fx:Script tag.
import flashx.textLayout.elements.InlineGraphicElement;
private var rec:InlineGraphicElement;
protected function view1_viewActivateHandler(event:ViewNavigatorEvent):void
     rec = new InlineGraphicElement();
     rec.source = drawRect();
     firstPar.addChild(rec);
private function drawRect():Sprite
     var spt:Sprite = new Sprite();
     spt.graphics.beginFill(0xff9900);
     spt.graphics.drawRect(0,0,135,71);
     spt.graphics.endFill();
     return spt;
The InlineGraphicElement can load an external file (an image for example). You can also create a sprite and set it as the source as I do here.
I hope this will help you to understand how you could do what you want to do
EDIT : here are my sources :
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flashx/textLayout/elem ents/InlineGraphicElement.html
http://docs.huihoo.com/flex/4/spark/components/RichEditableText.html