Creating a simple TLF TextContainerManager in Flex 4

The following example shows how you can create a simple TextContainerManager in Flex 4 using the Text Layout Framework (TLF) classes.

Full code after the jump.

The following example(s) require Flash Player 10 and the Adobe Flex 4 SDK. To download the Adobe Flash Builder 4 trial, see www.adobe.com/products/flex/. To download the latest nightly build of the Flex 4 SDK, see opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4.

For more information on getting started with Flex 4 and Flash Builder 4, see the official Adobe Flex Team blog.

package {
    import flash.display.Sprite;
 
    import flashx.textLayout.container.TextContainerManager;
 
    [SWF(width="550", height="300")]
 
    public class TextContainerManager_setText_test extends Sprite {
        public function TextContainerManager_setText_test() {
            var spr:Sprite = new Sprite();
            addChild(spr);
            spr.x = 40;
            spr.y = 50;
 
            var tcm:TextContainerManager = new TextContainerManager(spr);
            tcm.compositionWidth = 300;
            tcm.compositionHeight = 200;
            tcm.setText("(1)The quick brown fox jumps over the lazy dev. (2)The quick brown fox jumps over the lazy dev. (3)The quick brown fox jumps over the lazy dev. (4)The quick brown fox jumps over the lazy dev. (5)The quick brown fox jumps over the lazy dev.");
            tcm.updateContainer();
        }
    }
}

This entry is based on a beta version of the Flex 4 SDK and therefore is very likely to change as development of the Flex SDK continues. The API can (and will) change causing examples to possibly not compile in newer versions of the Flex 4 SDK.

5 thoughts on “Creating a simple TLF TextContainerManager in Flex 4

  1. I must be missing something because this doesn’t appear to compile even when using the nightly (8654 build) SDK. I get several “Type was not found or was not a compile-time constant” errors pointing at TextBlock and TextLine as the missing classes.

    1. Rob,

      Out of curiosity, are you using Flex Builder 3, or Flash Builder 4 beta? If you are using FB4, it should correct the Player version automatically based on the current SDK version (unless you disabled that).

      Peter

      1. I was using Flex Builder 3. It’s good to know that Flash Builder will help me avoid forgetting that setting though.

  2. How do you add a border to text elements using TLF? This seems like something that should be extremely simple yet I’ve been hunting for days. I’m currently doing something like this:


    protected var _textFlow:TextFlow;
    protected var _editManager:EditManager;

    var _textLayoutFormat:TextLayoutFormat = new TextLayoutFormat();
    // I add a whole bunch of formatting such as:
    _textLayoutFormat.color = 0xff0000;
    _textLayoutFormat.fontFamily = "Arial, Helvetica, _sans";
    //but of course there's no border-like settings here.

    _textFlow = new TextFlow();
    _textFlow.hostFormat = _textLayoutFormat;
    _textFlow.flowComposer = new StandardFlowComposer();
    _textFlow.flowComposer.addController(new ContainerController(this));
    _editManager = new EditManager();
    _textFlow.interactionManager = _editManager;
    _textFlow.flowComposer.updateAllControllers();

    // ... and later to "activate" it...

    _textFlow.interactionManager.selectRange(0,0);
    _editManager.setFocus();

    I was playing around with a TextContainerManager before, too… but I guess I just didn’t understand it enough. I see on help.adobe.com it says about the drawBackgroundAndSetScrollRect method, “Override this method to draw a background or a border. Overriding this method can be tricky as the scrollRect must be set as specified.

    I guess I’ll look into that, although… I’m not sure where to begin yet. (Any recommendations?)

Comments are closed.