Skip navigation
Currently Being Moderated

How to resize text container efficiently?

Jan 19, 2012 12:47 AM

Tags: #textlayout #textcontainermanager #textlayoutframework

Hi all,

I'm new to TLF and have managed to put together a small test project to try out right-to-left support. Maybe due to the overwhelming number of classes and APIs I am struggling a bit to create the equivalent of an autoresizing text field which grows as the user adds new text to it.

 

I have a container (a canvas) to which I add my TextFlow. Example:

 

 

                              textFlow = new TextFlow();

                              textFlow.direction = Direction.RTL;

 

                              var p:ParagraphElement = new ParagraphElement();

                              var s:SpanElement = new SpanElement();

                              textFlow.addChild(p);

                              p.addChild(s);

                              s.text = "وثيقة إثبات صلة القرابة مصدقة من سفارة دولة الإمارات – إذا لم يكن اسم المكفول مدرجاً في جواز سفر";

 

                              textFlow.flowComposer.addController(new ContainerController(this, container.width, container.height));

                              textFlow.flowComposer.updateAllControllers();

 

This works fine. Now I'd like the user to be able to add more text and grow the canvas container so that it fits the size of the text contained within. What's the best way to do that? Is there an Event I can listen to that informs me once new text has been added? If so, where should I look?

 

My plan was to then update the container size with logic along this line:













var controller:ContainerController = textFlow.flowComposer.getControllerAt(0);
























var rec:Rectangle = controller.getContentBounds();








_container.width = rec.width;







_container.height = rec.height;




 

 




controller.setCompositionSize( _container.width, _container.height );



textFlow.flowComposer.updateAllControllers();

 

Am I on the right track here? Unfortunately I cannot use the Spark components in this project since this logic is contained within a custom MX component.

 

Regards,

 

 

Stefan

 
Replies
  • Currently Being Moderated
    Jan 28, 2012 9:32 PM   in reply to Stefan Richter

    Every input should trigger a re-compose of TLF. You'd better listen to the CompositionCompleteEvent.COMPOSITION_COMPLETE to decide if the text is over the boundary.

     

    Why not make the scrollPolicy is on. TLF will automatically make your text to be scrolled.

     
    |
    Mark as:
  • Currently Being Moderated
    Feb 6, 2012 2:01 AM   in reply to Stefan Richter

    I'm assuming you want a text field that has a fixed width and height is adjusted to amount of text.

     

    It's not well documented, but setting a containerController's height or width to NaN will make it dynamic:


                        ie, new ContainerController(this, container.width, NaN)) gives you a container with fixed width and dynamic height

     

    You can use controller.getContentBounds(); to measure the height of the current text, and as Gang writes, it's best to do that after a CompositionCompleteEvent.COMPOSITION_COMPLETE event to be sure all changes are in place

     
    |
    Mark as:
  • Currently Being Moderated
    Feb 6, 2012 3:08 AM   in reply to Stefan Richter

    Have you tried without setting setCompositionSize ? If you set width initially and height to NaN, it should not be necessary. I only use the composition_complete event to track height of text to be able to place other elements aligned to bottom of text.

     
    |
    Mark as:
  • Currently Being Moderated
    Feb 6, 2012 3:30 AM   in reply to Stefan Richter

    Ok. just checking. It's been working without glitches for me, but then I haven't been working with RTL text, only vanilla LTR. Glad it worked out.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (1)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points