Size Text to Container

04.27.2010

The new Text Layout Framework for Flash Player is a huge improvement over the historic TextField. Even so, it’s still not easy to have text auto-size to fit its container(s). In the demo app below I’ve implemented one solution that makes the text as large as possible without being cropped. Go head, type something in the box. Right-click the app to get to the source.

Get Adobe Flash player

The basic methodology is very similar to the Guess the Number game where you whittle down the options until you get to the one you’re after. With a few smart guesses, this can be decently efficient (~20ms). If you can come up with a more efficient or elegant way to accomplish the same task, post a comment below!

Fork Project

Tags: , , , , ,

Comments

04.29.2010 / Maurice said:

Thank you sir!

08.20.2010 / Roy Sharon said:

Very nice!

The only problem is that it does not take into account the height of the text, so if it is a one-liner the font size gets too big to fit into the display… I would love to see a fix if you’re still into it.

Thanks!

10.23.2010 / AaronHardy.com » Studio J Online Scrapbooking said:

[...] The new Text Layout Framework was used in providing text editing functionality on user spreads. This got a little tricky when loading fonts at runtime. It got even trickier when consolidating the undo history for multiple text flows into the spread’s overall undo/redo system. Then we integrated custom support for sizing text to a container. [...]

03.02.2011 / Ignatius Ahamiojie said:

Thanks you very much for this. May God bless you and give you more inspiration. You just saved a life with this. You have no idea!

09.05.2011 / Darryl said:

This is a very useful tool, and very elegant. Have you had any success getting this to play nicely with an UndoManager? The problem I am facing is as follows:
(1) I do some sort of useful edit in a TextFlow, which triggers a FlowOperationEvent.
(2) In the handler for the FlowOperationEvents I call your code to resize the font (generally works pretty well)
(3) Then I attempt to undo my useful edit by using CTRL+z, which calls the UndoManager to do an undo(). Unfortunately the undo stack has now got the automatically generated ApplyFormatOperation on the top of the stack, so doesn’t do the undoing! What I really need is to skip all the ApplyFormatOperations that change the font size and go straight to the last useful edit.
Any ideas?
Thanks!

09.05.2011 / Aaron Hardy said:

Thanks Darryl. I did implement what you’re talking about in one of my projects. You can find it at http://create.studioj.com and log in anonymously (bottom-left). The downer is I don’t remember how I did it and left the code at my previous job. I do remember TLF being a pain in the butt though with private variables and functions all over the place. Sorry, I’m not going to be much help on this one.

09.07.2011 / Darryl said:

Thanks for the pointer Aaron – I see that you didn’t actually get ctrl+z undo working, but had a separate undo operation from the tool bar. Anyway, it does suggest this is possible … shall apply head to nearest wall until I figure it out!

Leave a Comment

Your email address is required but will not be published.




Comment