How to vertical align the content of a line in a TextFlow?
I'm trying to vertical align a line of text and image, so that the text is not align at the bottom but at the middle. I've tried p.vertialAlign and the p.lineHeight but it doesnt work. An example of the code I'm using is below.
<?xml version="1.0" encoding="utf-8"?>
<!-- Simple example to demonstrate the Halo TextArea control. -->
<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"
creationComplete="init()">
<fx:Script>
<![CDATA[
import flashx.textLayout.elements.TextFlow;
import flashx.textLayout.elements.InlineGraphicElement;
import flashx.textLayout.elements.ParagraphElement;
import flashx.textLayout.elements.SpanElement;
[Bindable]
private var textFlow : TextFlow = new TextFlow();
function init():void {
var p:ParagraphElement = new ParagraphElement();
var span:SpanElement = new SpanElement();
span.text = "Hello ";
var img:InlineGraphicElement = new InlineGraphicElement();
img.source = drwCircle();
var span2:SpanElement = new SpanElement();
span2.text = " World";
p.addChild(span);
p.addChild(img);
p.addChild(span2);
textFlow.addChild(p);
}
private function drwCircle():Sprite
{
var yellowCircle:Sprite = new Sprite();
yellowCircle.graphics.beginFill(0xFFFF33);
yellowCircle.graphics.drawCircle(15,15,15);
yellowCircle.graphics.endFill();
return yellowCircle;
}
]]>
</fx:Script>
<s:RichEditableText id="textArea" editable="false" width="200" height="300"
horizontalCenter="0" verticalCenter="0" mouseChildren="true"
paragraphStartIndent="5" paragraphEndIndent="5"
multiline="true" textFlow="{textFlow}" />
</s:Application>
