how to add a spark component to an mx extended custom itemrenderer?

hey all, i have been working on an air app for quite some time and in one of my mx:lists i have a custom renderer written in pure AS (no mxml). it extends the listitemrenderer mx componenet. in it i have overrode the createChildren() function to add some children of my own.

now, fort right-to-left text i want in this itemrenderer, i would like to add a spark:TextArea component in this createChildren() functio开发者_StackOverflown

is there a way to do so?

this is the itemRenderer:

import flash.text.TextField;

import mx.controls.listClasses.ListItemRenderer;

import spark.components.TextArea;

public class MySumTileIR2 extends ListItemRenderer
{
    public function MySumTileIR2()
    {
        super();
    }

    override protected function createChildren():void {
        super.createChildren();
        label.visible = false;

        var tf:TextField = new TextField();
        tf.text = "this is a TextField";
        this.addChild(tf);
        var ta:TextArea = new TextArea();
        ta.text = "this is a Spark TextArea"; 
        this.addChild(ta);
    }
}

and this is it's owner:

<mx:Panel id="MTGpicsPanel" label="totalPics" title="{totalPics}" height="100%" horizontalAlign="right">
   <mx:List width="100%" top="18" bottom="18" left="18" right="18" id="MTGpicsList" x="0"y="0" height="100%" variableRowHeight="true" editable="false" dataProvider="{chosenPics}"  doubleClick="gotoPic();" doubleClickEnabled="true" itemRenderer="MySumTileIR2"/>
</mx:Panel>

running this i see the textfield but not the textarea

What problems are you having doing so?

Inside createChildren(), do this:

var ta : spark.components.TextArea = new TextArea();
this.addChild(ta);

I've never done it w/ a Spark TextArea, but I have done it with a BorderContainer and it worked well, for the most part. I couldn't get BorderContainer to show up on a UIComponent or Container, but it worked fine on a Canvas. You may run into similar issues w/ a TextArea.