Unity Version: 5.6.5f1 Personal
TextMesh Pro Version: 1.0.56.0b3
I have a TextMesh Pro UI Text object whose area intersects the area of a UI Image. The text is dynamic, but the image will never change. Is there a way to make the TextMesh Pro UI Text flow around the image similar to how text would wrap to one side in HTML/CSS?
The image below shows two copies of the object in Unity. One object, denoted by a red space where the image is located, is what I'm currently getting. The text enters the space of the image. The other object, denoted by a blue space where the image is located, shows the desired outcome where text is wrapping properly.
Current vs. Desired Outcome:
Research so far:
How do I put an image inside text? - The Image that I'm using is a UI Image, not a text asset. The Image will only act as though it is inline with the text.
How do you wrap text around a rectangle?, Fluid layout for Unity UI - These are what I'm looking for. However, no suggestions have been posted in them.
I've explored the idea of using multiple TextMesh Pro UI Text Objects, with each one acting as a fragment of the complete text area. However, this isn't the same as wrapping the text around the Image. For dynamic text, if I pull content from one text area and push it into the next area, this will conflict with the Auto-Sizing functionality and cause unequal font sizes.
Another possibility is that I could insert characters one at a time, check to see if adding another character would result in a collision with the image, and add System.Environment.Newline to prevent this. However, I worry about the potential performance issues from dealing with large amounts of text.
TextMesh Pro Documentation - The TextMesh Pro Documentation has some tools for finding word wrap points, but I haven't figured out how to implement a means of comparing this to an anchor position of another object.
This can be accomplished with TextMeshPro's "Linked" overflow mode. See attached picture for an example. Essentially, you'll need to make two TMP objects and adjust the layout for each of them appropriately. Then:
1) change the overflow mode of the first one to "Linked" using the dropdown in the inspector.
2) place the second TMP object as the reference in the field that appears.
Related
My team has made an application in Unity3D with MRTK for the Hololens 2. Our main menu inside the application does not use a Canvas, but includes Quads to display pictures and Text Mesh Pro's 3D text fields. I have found that, while this menu is open, several elements like the top-left corner picture and part of the text fields are jittery when you hold your head steady. When you nod your head, the affected parts of the text seem to lag behind so that they end up lower or higher than the text that remains steady.
The cutoff point between stable and unstable text is always the same. There is a central area that is stable. Text that is too high, or too far to the left or right in unstable. The division is in the middle of the letters (For example, the top-most part of the capital letter S is unstable, while the smaller letter m is stable.) It does not matter if the viewport is centered on the center or the side of the menu. Other objects in the menu, such as buttons, that are further outside the center, are still stable.
I'm aware that there can be problems with hologram stability, but I do not understand why only part of the same textfield are affected. I can't include screenshots or videos because the effect doesn't show up in screencaptures of the Hololens.
Does anyone know what could be causing part of an object to be unstable in the Hololens, and what might be done about it?
Edit: I made an edited screenshot to try and recreate the visual effect seen in the Hololens:
It seems to be related to depth reprojection. Text doesn't write to the depth buffer by default, which can lead to instability. MRTK have some tips, including specifically for TMPro:Depth buffer sharing in Unity
The post is a bit long but I tried to explain everything that is connected to the issue.
This screenshot is of the parent ui texts canvas.
This is a screenshot of the description ui text the text in the game looks very big the fonts are very big and stretched.
This is a screenshot of the scene text Image settings :
And the scene ui text settings :
This is a screenshot of the scene ui text when running the game from the exe build file :
And last the description ui text in game when running the build exe file :
How can I make some ui text that will be display the text the same in all the cases something that will be readable nice not too small and not too big ?
In the scene text the text is smaller because I wanted the text to be a bit under the player mouth. In the description text is a bit bigger but then everything get messed.
I think I want the text to be shown like in the scene ui text in all the places. I think the size is fine. but not sure how to do it.
There's a couple of things here that should get your text working nicely across the board.
Firstly, at your root Canvas object, you'll usually have a Canvas Scaler there. The default of "Constant Pixel Size" is often exactly what you don't want. I normally have it set to "Scale With Screen Size", and then set the resolution to 1920x1080. I do that because 1920x1080 (16:9) is the standard Full HD screen size, so you can bet that most of your screen layout is going to look the same across most displays.
The second suggestion would be to use TextMeshPro. If you haven't already got it installed through your Package Manager, then you can find it there. Here's the docs for that. It's FAR superior to the standard Text element and you'll notice less issues trying to get your text looking correct. It's usually just a matter of adding the TMPro_Text UI component to the same object your Text component was originally on (removing the original Text component of course).
I would also leave all scaling for all of your UI items set to (1, 1, 1) where you can and let and scaling be done by the Canvas Scaler. The text elements can certainly be left at (1, 1, 1) and just change the font size.
Once you get these three things sorted, your text should be the same across all of your pages, and devices.
This due to Scaling Rect Transform Component
to solve this don't scale up or scale down UI Elements {Image ,Text, ... just keep Scale 1,1,1 }
First I recommend You to see This to understand this Component
https://www.youtube.com/watch?v=FeheZqu85WI&t=6s
Now to Solve your problem
Set Scale of Description Image (1,1,1)
Set Scale of Description Text (1,1,1)
Do 1,2 with Scene Image, Scene Text
Change Width , Height of{Description Text, Scene Text} with small values 900*400
When using textmesh to add a label to my prefab gameObject in Unity, the text appears really squashed and not filling the space properly and I can't seem to figure out how to make it appear normal. I had the same issue using plain text.
Even if i make the canvas way bigger than I want it just to test, the text is all squashed and distorted
I am using a canvas and my scaling is quite small
Update:
Try to add a CanvasScaler component to your container Canvas gameObject (add it only if it is not there yet).
https://docs.unity3d.com/Manual/script-CanvasScaler.html
It has some properties but the most important is the Reference Pixels Per Unit set it to a higher, or a much higher number.
If your container Canvas has its Render Mode in Screen Space - Overlay, then your text will look little "stretched" - as your picture shows it. If you modify the scale mode to anything else, then this will be alright.
So the problem is that I want create such an idea. There are a table and a sheet of paper (just a Plane). I want to place some text on this sheet of paper. I read about Text Mesh and I thought that I would use it but I had a problem about it. I need to limit my text on this sheet of paper but I haven't found any borders I can place there. How can I set borders to Text Mesh? Or are there any decision I can use to handle this situation?
TextMesh does not have borders
Instead, you are probably interested in a World Space Canvas and using UI text instead. Unity has a great tutorial in the manual for setting up a world space canvas, which pretty much amounts to "set the Canvas to world space, decide on a resolution, decide on a in-game size, and position it."
For text, you actually have two options: UI Text and Text Mesh Pro. TMP used to be an asset on the asset store, but Unity has integrated it into a semi-standard package now (just create a TMP object and you'll be prompted to do the importing). TMP has several additional features and options that standard UI Text does not have, including in-line sprites, margins, text alignment, better rich-text, and so on. It might be overkill, but it is available.
I'm using the workaround described here to vertically align text in a multiline UILabel to the top. Unfortunately that solves only half of the problem because I also want to collapse the remaining space and move other labels below the label to move up and consume the space.
Is there anyone way to achieve this without having to resort to calculating the Frame's of the other views yourself and thus taking over the layouting?
Here's a screenshot of my problem. To make it easier I've colored the background of the relevant labels. The Blue label is supposed to move up and consume the unused space of the red label. The Red Label is configured for 3 Lines and Font-Autoshrink is off.
You must re-calculate your label frames and then rearrange your labels in the view.
Or you can try to use CoreText to make more complex layouts without the need to cope with these frames rearrangement. On GitHub there is a nice work BSD-licensed, called NSAttributedString+HTML: https://github.com/Cocoanetics/NSAttributedString-Additions-for-HTML which tries to port in the iOS the same methods already available in OSX. It is based on CoreText and with this class you can write your page as html and render it on screen without using UIWebView (and without its limitations). Based on your screenshot, it would be easy to achieve the wished result with simple html.