Skip to main content
Participating Frequently
November 9, 2009
Question

Fit To Box and Determine if Doesn't Fit In Box

  • November 9, 2009
  • 3 replies
  • 1420 views

I hope the subject line says it all.

First step - how can I determine if the TexFlow that needs to get rendered fits into the target area? Is there a boolean of some sort or do i have to check the overflow length?

Once I've done that is there any easy method to get the content that did not fit?

More complex - is there a way to force the flow to fit within a container by some means? Or is this too complicated of a situation requring iterating through all flows and resizing, adjusting leading/tracking, etc. until it fits?

thanks for any advice!

This topic has been closed for replies.

3 replies

Aaronius9er9er
Inspiring
April 28, 2010

Here's what I ended up with in case anyone's interested: http://aaronhardy.com/flex/size-text-to-container/  I'd love to hear if you have a better way of doing it.

Aaronius9er9er
Inspiring
April 23, 2010

Has anyone come up with a solution for this recently that they would  be willing to share?  Smirnoff's resizes the container to fit the text whereas I'm trying to fit the text to the container (and I think that's what bustback was getting at).  If not, I'll be doing essentially what robin.briggs suggested.

Adobe Employee
November 10, 2009

It depends a little on how you have set up the container. For your purposes, it might be easiest to turn scrolling off. You can do this by setting the ContainerController's verticalScrollPolicy and horizontalScrollPolicy to "off". Once you have done this, and forced a recompose (you can do this by calling the flowComposer's updateAllControllers() method), then you can see how much text fit into the container by looking at the container's textLength property. If controller.absoluteStart + controller.textLength < textFlow.textLength, then there was more text than fit in the container, and you have overset text.

This will also, by the way, tell you exactly which text did not fit, and how much there is, which is very useful if you intend to do any copyfitting. So, the text that didn't fit is the text starting at controller.absoluteStart + controller.textLength and going up to the end of the TextFlow (textFlow.textLength).

Forcing the flow to fit is more complex. There are some simple truncation methods that work on the TextLineFactory classes to remove text. You can define how many lines you want, etc. If you want to be able to see the whole text, then it gets more complicated. In that case, you may need to do some osrt of iterative process where you apply things such as scaling the text, applying tracking, etc. according some algorithm that gets reasonable results for what you're trying to do. In this case, I would suggest using the FlowComposer's compose methods to force composition up to date, then see how much text fits at each stage before applying the next transformation. That will look better and be slightly faster than calling updateAllContainers each time.

Hope this helps,

- robin

bustbackAuthor
Participating Frequently
November 10, 2009

Thanks Robin,

That seems reasonable. The determination of whether or not the text will fit within the container seems easy.

The hard part is to actually try to fit the text within a bounding region. For the sake of argument, I think the text entry would need to be very limited so that leading/tracking are uniform. Otherwise, I can't imagine an easy way (without iterating through all TextFlow elements and lines) to accomplish this without a serious performance hit.

I've done the same for the previous text renderer - along with hacking the way lines are rendered to match Photoshop and InDesign by forcing the leading to be accurate (among other things). In those cases, I didn't have to worry about limiting the user because, well, the previous functionality was limited already. With TLF, it will be much more complex.

I'm going to keep this thread open as unanswered in case anyone else has tried to do the same (fit text to a region). There are quite a few use cases to fitting text to a rectangular boundary - especially in a design environment where the goal is to design page layout content.

Thanks for the help!

Inspiring
November 10, 2009

Hello,

I have to deal with the same problem and my current solution is the following:

  1. Compose the entire text even though part of it may not be visible:
    textFlow.flowComposer.composeToPosition();

  2. Determine what the required height is so the entire text fits:
    var contentHeight : Number = controller.getContentBounds().height;

  3. Adjust the corresponding container so the entire text fits:
    if (controller.compositionHeight < contentHeight)
    {
        controller.setCompositionSize(controller.compositionWidth, contentHeight);
        container.height = Math.ceil(contentHeight);
        textFlow.flowComposer.composeToPosition();
    }

I haven't noticed problems with this approach however I haven't tested yet with more sophisticated text flows.

Feedback to the proposed approach is very welcome.

Smirnoff