CODEWITHSUNDEEP
apache-flexflashactionscript
Thanatos
Thanatos

Reputation: 44256

Rendering text in Flex in Graphics

I'm new to Flex (and Flash) and just playing around at the moment. I was using the drawing methods on a Canvas to color it blue, and wanted to draw text, however, I have an error somewhere in the code.

<?xml version="1.0" ?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" paddingLeft="0" paddingRight="0" paddingTop="0" paddingBottom="0" enterFrame="enterFrame(event)" applicationComplete="addtext(event)">
    <mx:VBox width="640" height="480">
        <mx:Label id="debug" text="No debug yet." />
        <mx:Button id="myButton" label="Hello World" />
        <mx:Button id="myOtherButton" label="Foo Bar Baz" />
        <mx:Canvas id="myCanvas" width="100%" height="100%" />
    </mx:VBox>
    <mx:Script>
    <![CDATA[
    import flash.text.engine.*;
    import mx.controls.*;

    public function addtext(event:Event):void
    {
        Alert.show("foo!");
        var str:String = "Hello World.";
        var format:ElementFormat = new ElementFormat();
        var textElement:TextElement = new TextElement(str, format);
        var textBlock:TextBlock = new TextBlock();
        textBlock.content = textElement;
        var textLine:TextLine = textBlock.createTextLine(null, 300);
        textLine.x = 30;
        textLine.y = 200;
        Alert.show("baz!");
        this.addChild(textLine); // Execution appears to cease here.
        Alert.show("bar!");
    }

    public function enterFrame(event:Event):void
    {
        myCanvas.graphics.clear();
        myCanvas.graphics.beginFill(0x66666FF);
        myCanvas.graphics.drawRect(0, 0, myCanvas.width, myCanvas.height);
        myCanvas.graphics.endFill();
    }
    ]]>
    </mx:Script>
</mx:Application>

The alerts get to "baz!" but not "bar!", so the error is somewhere there. Also, I've been running this in Firefox and fdb, but fdb isn't outputting anything - it's just launching a Flash player. A starting point on how to debug Flash

Upvotes: 0

Views: 471

Answers (1)

NielsBjerg
NielsBjerg

Reputation: 701

IMHO this is a somewhat fuzzy mix up between flash and flex. First: I would suggest that if you would like your canvas to be blue, you'd use:

<mx:canvas backgroundColor="0x66666FF" width="100%" height="100%" />

Secondly the text layout framework (Commonly TLF) is a topic I would reccomend you skip until you are a bit more familiar with flex and flash.

The error you are having is because TextLine does not implement IUIComponent, and therefore cannot be added to a Flex container.

If you want to use TLF, you will need to add a spark component capable of handling it, to your application, ex. s:RichText or s:TextArea

Happy coding!!

Upvotes: 1

Related Questions