Is it possible to wrap text around an image?

So I have a rectangular area that I would like to put text in, but each corner of the rectangle has an image where I would like text to flow around it. So basically I am looking for a way for the text to get narrower at the top/bottom than it is in the middle. Is something like this possible?

 

Support for text flowing around images / shapes is not currently available. This is something that I have been wanting to support for a while but simply haven't had time to implement.

In the meantime, you should be able to use the Linked text mode to achieve the results you seek. See example "16 - Linked text overflow mode example" included in the TMP Examples and Extras.

For the use case you describe, you would use 3 text objects that are linked using Overflow Linked mode. The source text would be set on the first top text object and would flow into the other two text objects as seen in the image below.

 

Thanks for the reply! I had tried doing that, but it doesn't seem to work well with centering text and auto sizing. It seems to only center within the first text object and will auto size within there, and only once it can no longer do that would it flow over to the others.

What I would like to have happen is that it stays centered in the middle text object when it is not overflowing and auto sizes to be an appropriate size between the 3 areas of text.

 

Auto size will definitely be an issue as it only considers the first text object / bounds.

In terms of text alignment, you have to set it on each linked text objects but otherwise it should work as expected.

 

Any suggestions on how to go about handling auto sizing for it? It's an important case for us as its a VR game, so we need the text to typically be as large as possible, but with the ability to get smaller for longer pieces of text.

 

Until I can get around to making Auto Size work with Linked text mode, you might be able to implement your own solution which is to manually set the text size on all linked text objects to the max point size and then checking if the "isTextTruncated" property. If it is use a binary search to test a new smaller point size and keep going until you find the optimum point size.

This is essentially how auto size works for a single text object.

 

Okay thanks!

 

So I setup 3 vertical text boxes with vertical center alignment


It's not working as I expect though. I would like it to be in the center one as that would be the overall center, but its in the top one until it overflows. Am I missing something?

 

Oh! Centered vertically ... That is definitely not working as expected. I need to think about this one.

 

@Stephan_B


In some cases, depending on the auto scaled font size, there ends up with a gap between the linked text objects. Any ideas how I could work around this? I'm starting to think that I really need a way for it to auto flow around the two bottom corners as the linked objects doesn't fully fit my needs. Is there a way I could wind up doing that? If so, could you point me in the direction of how to accomplish that?

 

Any update on making text flow properly using middle vertical alignment? I'm having the same issue where I need text to flow around an image but would like it centered vertically. There is currently no way to get a consistent line spacing between the 2 linked textboxes.

 

Is it possible to use a linked text overflow mode in UI Elements or may be there is another way to wrap text around shapes in UI Elements?