TextMesh Pro - Advanced Text Rendering for Unity - Beta now available in Asset Store

Video Update #2 on the new TextContainer showing the various behaviors which you can expect from the TextContainer, text auto-sizing and other properties.

I would love to get some feedback on these behaviors as I am trying to make sure they are as intuitive as possible.

 

Stephan asked if I would post a grab of MegaBook using TextMesh Pro for adding content to the book system so below is an image which shows multiple text objects being used on each page along with other objects to build the content. I am not really doing justice to the amazing rendering options in Text Mesh but eventually I will get around to doing a proper example where Text Mesh can show of its skills And if you are wondering exactly what MegaBook is there is a little video below, things have moved on a bit since the video was made with support for hard front and back covers, dynamic text and meshes per page and attaching objects.

 

Messed up the text in the previous example, this image uses SDF font so nicer smaller text

 

Someone asked a question about having text object be affected by forces (ie. Rigidbody) so using the Surface Shader Demo scene that is included with TextMesh Pro, I slapped a Rigibody + Collider on the Text object and voila.



P.S. Animated .gifs aren't the best quality but still cool with the shadow on the ground and all

 

Improved Line Spacing Tracking
I have revised how line spacing is handled when the <size=+x.xx> is used. This revised behavior is consistent with how MS Word or other text layout tools handle line spacing with character of different sizes.

Text input used to generate the text.


The resulting text object

 

Preview #2 - TextMesh Pro UGUI & Unity 4.6
Here is another preview of the new TextMesh Pro UGUI component which will be available when Unity 4.6 is released. In this video, you can see the improved text auto-sizing feature along with some of the masking capabilities.

This new component will be available as an alternative to the new Text component that is part of Unity 4.6.

 

Size Tag & Line Spacing + TextMesh Pro UGUI component for Unity 4.6
Demonstration of the revised implementation of the <size> tag along with text auto-sizing running in Unity 4.6 and rendering to the Canvas Renderer.

A new size tag variant was added which is <size=%100> which allows that sized characters / words to remain sized proportionally to the baseline font size.

 

New TextContainer Component, Margins and Masking
As I mentioned before, the new TextContainer Component which will be in the new release of Text Mesh Pro will make several new features possible since the text will now exist in a defined region as opposed to being just a point in space.

One of those features will be Masking (Soft & Hard). Masking of the text will occur whenever the text is outside the margin area or outside the Text Container.


Animated GIF showing the new TextContainer Component, Margins and Masking.

 

Just a follow up to previous post. In this example, the Margin and Character Spacing is controlled via Unity's Animation Editor.

 

Text Auto-Sizing, Word Wrapping & Forced Line Feed
This short video is in response to a user who was curious about how all these features would interact with each other. This is not my most entertaining video or visually stimulating but nonetheless it answers the user's question

 

Quick update: I am currently working on a text input component which will enable taking user input at run-time. I am curious about how many of you might be interested or needing this feature?

 

I need it a lot! With this feature I will be able fully remove all other text components.

 

Here is an update video of the Text Input Component in case you haven't seen this one.

P.S. I am also looking into the improved word-wrapping (line breaking part of it) for the East Asian languages as you requested as well as a few others.

 

Thanks! Your support is the best one! =)

 

How great Assets It is!!!
I revere YOU!!!

 

Thanks guys!

 

Improved Word Wrapping & Line Breaking
I have had several users requesting improved word wrapping & line breaking to handle the specific needs of Asian languages. Here is a video showing the first implementation of this improved system. I would love to get feedback on this.

P.S. A lot of these changes are inter-related and made possible by the new Text Container which will be introduced in the next release of Text Mesh Pro or the new RectTransform which is part of Unity 4.6.

 

New! Superscript & Subscript - Size + Offset Control
I have modified the TextMeshPro Font Assets to now include fields for Superscript & Subscript Offset position as well as Size (0.25 ~ 1.0) or 25% to 100% of Font Size. This now gives you control over the positioning and size of Subscript & Superscript.


Example showing adjusted offset for Subscript & Superscript.




By default: The Subscript position is the same as the underline position defined in the font TTF. The size is 0.5 or 50% of the base font size.

 

Quick Update: Text insertion and deletion is done. Mouse and cursor navigation is done. Working on text selection (mouse or shift key + cursor) which leads to copy / cut / paste of text.

 

I added a new property TextMeshPro.paragraphSpacing; which adds / reduces the spacing that line feed (AscII 10) adds. This works in conjunction with line spacing which adds / reduces spacing between lines including those with line feed.

 

So I've just been working on a (manual) pipeline to make further use of this asset- and thought people here might be interested. As you know this currently only works with fonts (as far as I know?) but sometimes it would be useful to be able to use it for other elements that may not be available in a font. Pixel perfect vectors (even if in a single colour) have their uses...

After trying a number of different options, hands down the easiest is to use https://icomoon.io/app/ - an excellent online fontmaker app, that's geared towards non alphabetic glyphs/icons. Import your SVGs from illustrator / etc, assign them to characters and download the TTF font.

I have round level buttons in my game that have the usual 1/2/3 star thing happening.



I could of course, for atlas efficiency, have just had a filled/unfilled star and the curve, but this was easier for layout for now and a nice proof of concept.

Love this asset!

 

If you add shapes into the character slots, you can then generate SDF Font Assets from those which is pretty cool.

I was also thinking about (once I am done with version 1.0 of TextMesh Pro) a SDF shape tools for UI type stuff like buttons and all.

Thanks

Please help spread the word about TextMesh Pro in other threads and forums (where appropriate of course)

 

Hi Stephan!
I have a question.

Is it possible to set limits of the text size in your plug- in ? And in case the text doesn't fit in the proportions set will it be calibrated?

 

2048 is now out since few weeks. Check it out we are using Text Mesh Pro for the main menu button!

It's available on iOS, GooglePlay, Amazon and Facebook.

https://bevelarts.com/game/2048-crush/

Here's a screenshot where we are using it the most:

 

Text auto-sizing is a feature that will be part of the next release which includes the Text Container.

Take a look at the video below for instance or visit the TextMesh Pro User Forum for more information.

 

Thanks for Your answer!
Yes. It that we need!
When we can wait release version with this feature?

 

This next release is pretty much feature complete now. I am going to be testing it over the next few days and if all goes well I'll be submitting it to the Unity Asset Store.

 

Unite 2014
Just wanted to let you all know that I just committed to be a Bronze Sponsor at Unite 2014 in Seattle and will be showing TextMesh Pro in the exhibit area.

If your going to Unite please drop by and it will be my pleasure to give you a personal demo and answer any of your questions in person.

Now, If you already own TextMesh Pro then please stop by as I would love to personally thank you for using TextMesh Pro and being one of my customers

 

This looks promising. I was looking for something like this, and have a few questions:

1. Is it possible to raycast the letters/words? I need to be able to click on/select words in 3d scentences. It seems the default textmesh doesn't allow this, does yours?
2. Is it possible to temporary hide certain letters at runtime? Leaving a blank space where it used to be?
   
3. Is there a free version so I can try some functionality to see if it's what I need? I mostly want to test the clicking of words I mentioned, don't really need all the fancy effect (though they are of course very cool )
4. If buying to full version, do you get the source code?

Thanks a lot!

 

Thanks

The TextMeshPro.textInfo data structure currently holds information about characters, lines and the mesh. I am using this information in the new Text Input component to select characters for editing at run-time in the Gameview window. See preview of this component a few posts above.

Currently, I do not track words but that is something that I will be adding to the TextMeshPro.textInfo in conjunction with the Text Input component which will enable users to select characters, words or lines.

This new component is scheduled for release after the forthcoming 0.1.45 version which I am hoping to release this week.

Until this component is released, since the TextMeshPro.textInfo class holds information about each character, you could always implement your own character / word selection process using colliders or simply track mouse pos vs. character rect.

Yes. I think the easiest way would be to use the color tag which supports alpha. Just set alpha to zero for the letters you wish to hide.

Not at this time although once I release the Text Input component, I could always make a web demo of that

Source code is included for everything except the Native C++ plugin which is used to create the font assets.

 

Firstly, thanks for the super fast reply.

So I could add a single collider to the entire text, by that find where I clicked in the text. Then check all the character rects to find in which one I clicked and by that I know the word. That should do, as I need to be able to click any word in any sentence. Would be a lot of work to add colliders for each word manually

Perfect

Awesome!

I think you just got yourself another sale

 

The TextMeshPro.textInfo has all the info to track the location of each character, what line they are on, etc... Like I said the notion of word isn't in there yet but it will be added as I need it for the Text Input Component.

You could definitely add a collider and track where you clicked inside of it and determine what character is closest. Instead of colliders + raycast for the Text Input component, I am using a point to plane intersection against the characters or words or whatever I need.

Thanks and feel free to let me know if you need any further assistance.

 

Looks sweet!

Now everyone needs to thank you for getting me to add the Inner Underlay

P.S. So P.K. Suban and that phat contract. What's your take?

 

Hi there,

I'm having an interesting issue with TextMeshPro related to anchor position. I have a banner with text on it that is off-screen - the text anchor is centred, I animate the banner onto screen, but the text only seems to appear when the central anchor arrives on screen..? Oddly, subsequent triggers of the same banner from an off-screen position back to on-screen seems to work fine- it's literally only the first time. It's almost as if it's disabled off-screen but the way it's detecting when it should be enabled isn't working quite as intended..? This is also a scene with multiple cameras, so not sure if that's also a factor.



when I set the anchor to left (instead of centre) and moved the text field to roughly the same position, it worked fine (but won't really work for what I want as the captions vary in length)


Thanks!
Mike

 

What is happening is that I am using OnWillRenderObject() callback to update the TextMesh Pro object. The advantage of OnWillRenderObject() is that is doesn't render objects that are not visible to the camera. The downside is that is doesn't render objects that are not visible. I have been asking Unity for a better callback like OnRenderObject() but not luck so far.

So the reason this is happening is that until the object (transform) or Bounds are visible, the callback doesn't occur. Until the mesh is generated once, the bounds are zero and thus it only gets called when the transform is visible to the camera.

Having said that, you can replace OnWillRenderObject() by LateUpdate() in the TMPro_Private.cs file and you will be fine. You will have to also make the change in the ForceMeshUpdate() function in the TextMeshPro.cs file at around line 518.

The only draw back to using LateUpdate() is that if you update text object in late update somewhere else then you need to make sure those get called before TextMesh Pro LateUpdate() does. Other than that there isn't any real draw back.

Let me know if does the trick for you

 

That makes perfect sense and will be fine. I tend to avoid using late update mostly anyway.

Thanks!

I have one other slightly weird things happening- I have a glyph that i warped in illustrator that appears warped in fontbook but appears straight when I render the sprite sheet. Not sure why.

Also one suggestion - could we hide the material colour and default internally to white, since I found that accidentally setting this to black broke the face color property and also sdf rendering- quite obvious when I thought about it but might save you some weird support posts

 

Firstly, the LateUpdate() tweak works for me thanks.

Here are some characters typed in Illustrator, using the custom font "icomoon" which I created using icomoon.io


And this is the result with the same font rendered out into a spritesheet


I've tried up to 2048x2048 (in case it was a resolution issue?) but no joy.

 

You are referring to the top left line that appears wobbly?

Is that shape from one of the sets or something you imported and added via their tool?

I just added a bunch of their shapes and created a Font Asset using the SDF 16 Mode and everything looks fine.

 

As I mentioned earlier, I'll be attending Unite in Seattle next week. I will be in the exhibit area with the other sponsors demoing and answering questions on TextMesh Pro. Please drop by if you will be at Unite.

Here is an image of the banner (almost final version) to promote TextMesh Pro.

 

Unite 14
Just getting some demo content ready for Unite next week in Seattle.

Here is a revised version of the "Amazing Quality" text used in the sign for the show.



Now here is a close up of the text to fully appreciate the quality.


This is using the TMPro - Distance Field Surface Shader which 3 lights (Orange / Blue Point light + Directional) + Textures on the Face and Outline.

 

What did the text looked like prior to changing some of the TextMesh Pro material properties?



This text (title) is just plain Impact font. I adjusted character spacing and tweaked the kerning a bit. You can still see the orange and blue point lights affecting the text but otherwise, this is just plain text. It is amazing how much of a difference adding a few textures, bevel and glow can make.

Now just for fun, let's take a look at how this text using the same Impact font looks like using Unity's Text Mesh.



As you can see, Bitmap Text Rendering simply doesn't stand a chance against Signed Distance Field. When you factor in the improved text formatting options of TextMesh Pro and all the real-time visual tweaks we can do to the text and real-time lighting, comparing Text Mesh to TextMesh Pro is simply unfair.

Too often, I am tempted to create crazy looking text using all the bells and whistles in TextMesh Pro but I tend to forget how much better just plain text in TextMesh Pro looks over the other Unity text options.

 

Hey, I do love this asset and I'm very tempted to buy it but one thing is holding me back which I'm unsure if Text mesh pro is capable of.
I have been using Photoshop to create my text and its not something I want to keep doing when adding new text which is why this caught my interest, did some research but I couldn't see if its possible to bevel the face of the text like you have shown with the outline. Wanted to see if this was indeed possible or if its in the works. If that does become possible then I will buy this asset without a doubt!

here is an example of what I use and want to check if it can be created almost the same in this asset.

P.S sorry only just noticed i posted this in the WIP thread and not the other, honest mistake!

 

Can you post a close up of one of the letters so I can see the effect you are looking for in better details?

Posting here is totally fine and thank you for taking the time inquire about this

P.S. I am at Unite this week in Seattle so my response time is a bit slower than usual but once I can see a close up of your image and can break away from the demos, I'll let you know.

 

Hey Stephan,

Here is the requested close up, i went a bit further and cut out some of the extra details so you can get a better idea. quality is a little pixelated up close since they weren't converted to vector images ( another thing I love about TMPro is clear quality regardless of resolution/size )


Top Left : outline with bevelled face and gradient overlay
Top Middle: outline and gradient overlay, no bevel
Top Right: gradient overlay, no bevel and outline
Bottom Left: Complete image ( including hexagon pattern overlay )
Bottom Middle: No outline, gradient overlay and bevel

So I know I can achieve most effects except I don't know about the Bevel ( bottom middle)
Hope that image give you better insight

Cheers for the support much appreciated

 

Here are two images with Bevel on the face. Since I am at Unite in Seattle, I have limited access to content (textures)





And here is the last one which features an inner & outer bevel. There is a trick to this last one but I'll let everyone guess as to how this is done.

 

excellent! OK now I'm sold on it, thanks again really appreciate it!

 

You are welcome. Should you need any assistance, feel free to ask.

Please be sure to register / visit the TextMesh pro user forum where you'll find lots of videos and information.

 

Gradients using Vertex Colors
At the request of a few users, I added support for doing gradients using vertex colors. Since a Texture can be applied to the face and outline of the characters, these two things can now be combined to create some pretty weird gradients / patterns


Gradient using Vertex Colors


Editor Panel for Vertex Color Gradient

 

Here is an example of combining a texture on the face of the font and vertex color gradient