Wayback Machinekoobas.hobune.stream
May JUN Jul
Previous capture 12 Next capture
2021 2022 2023
1 capture
12 Jun 22 - 12 Jun 22
sparklines
Close Help
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
  • Asset Store
  • Get Unity

UNITY ACCOUNT

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account
  • Blog
  • Forums
  • Answers
  • Evangelists
  • User Groups
  • Beta Program
  • Advisory Panel

Navigation

  • Home
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
    • Blog
    • Forums
    • Answers
    • Evangelists
    • User Groups
    • Beta Program
    • Advisory Panel

Unity account

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account

Language

  • Chinese
  • Spanish
  • Japanese
  • Korean
  • Portuguese
  • Ask a question
  • Spaces
    • Default
    • Help Room
    • META
    • Moderators
    • Topics
    • Questions
    • Users
    • Badges
  • Home /
avatar image
0
Question by Tomer-Barkan · Mar 21, 2016 at 07:29 AM · uitextsizewrap

UI Text: Wrap and Expand to keep aspect ratio

As I see it there are two options to display text within a background image:

  1. Resize the background image to fit the text size (Content size fitter on the text)

  2. Keep the background image constant size, and have the text wrap to fit the width

I'm trying to combine the two - expand the background as much as necessary to fit the entire text, but also wrap the text so that the aspect ratio of the background image remains constant.

Any tools that do this, or any ideas on how to do it?

Edit: Here's an example of larger text and shorter text.

alt text

I'd like the algorithm to be able to match the background and text sizes to both these cases, without having to manully insert "\n" in the text or manually sizing the rect. The point is to wrap the text, and automatically resize the component so that the text fills it as much as possible, leaving no empty space above/below.

hoversizes.png (161.8 kB)
Comment
Add comment · Show 2
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image digzou · Mar 21, 2016 at 08:15 AM 0
Share

How about this : 1. keep the text as a child of the background image. 2. Set the text's anchors to X:0,1 Y:0,1 [Fully stretched within the image] 3. enable the best fit property of Text . 4. Horizontal overflow to "Wrap". 5. Vertical overflow to "Truncate".

avatar image Tomer-Barkan digzou · Mar 21, 2016 at 08:36 AM 0
Share

The thing is the amount of text may vary greatly, so I need the background image to change it's size depending on the amount of text. I don't want a huge background image for 3 words, and a tiny background image for 50 words won't work either cause the text will be tiny.

This is meant for tooltips.

2 Replies

· Add your reply
  • Sort: 
avatar image
0

Answer by pfreese · Apr 01, 2016 at 05:42 PM

Take a look at http://docs.unity3d.com/ScriptReference/TextGenerator.html.

You'll need to iteratively generate text to determine the proper size for layout. If you have particular aspect ratio (such as phi) you might start small and add vertical height a line at a time (query the font for the line height), calculating the width along the way until the bounds are large enough to contain the text without truncation.

Comment
Add comment · Share
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image
0

Answer by Sun-Pengfei · Mar 02, 2017 at 06:48 AM

  TextGenerator textGen = new TextGenerator();
  TextGenerationSettings generationSettings = textCompo.GetGenerationSettings(textCompo.rectTransform.rect.size);
  float width = textGen.GetPreferredWidth(text, generationSettings);
  if (width > preferedWidthMax)
  {
      layoutElement.preferredWidth = preferedWidthMax;
  }

This is the most elegant way I've found to this problem. Note that the text's parent has a content size fitter and a layout group components, and the text itself has a layout element.

Check the other related question:

https://forum.unity3d.com/threads/wrapping-child-text-with-content-size-fitter.315630/

http://answers.unity3d.com/questions/921726/how-to-get-the-size-of-a-unityengineuitext-for-whi.html

Comment
Add comment · Share
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users

Your answer

Hint: You can notify a user about this post by typing @username

Up to 2 attachments (including images) can be used with a maximum of 524.3 kB each and 1.0 MB total.

Follow this Question

Answers Answers and Comments

56 People are following this question.

avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image

Related Questions

How do I calculate a text size with the Best Fit option using a TextGenerator 2 Answers

UI Relative to screen size 1 Answer

How do I calculate how big text is in a world space canvas UI Text? 2 Answers

How to make parent UI element change size to fit children? 0 Answers

How to calculate a TextMesh width without rendering it ? 2 Answers


Enterprise
Social Q&A

Social
Subscribe on YouTube social-youtube Follow on LinkedIn social-linkedin Follow on Twitter social-twitter Follow on Facebook social-facebook Follow on Instagram social-instagram

Footer

  • Purchase
    • Products
    • Subscription
    • Asset Store
    • Unity Gear
    • Resellers
  • Education
    • Students
    • Educators
    • Certification
    • Learn
    • Center of Excellence
  • Download
    • Unity
    • Beta Program
  • Unity Labs
    • Labs
    • Publications
  • Resources
    • Learn platform
    • Community
    • Documentation
    • Unity QA
    • FAQ
    • Services Status
    • Connect
  • About Unity
    • About Us
    • Blog
    • Events
    • Careers
    • Contact
    • Press
    • Partners
    • Affiliates
    • Security
Copyright © 2020 Unity Technologies
  • Legal
  • Privacy Policy
  • Cookies
  • Do Not Sell My Personal Information
  • Cookies Settings
"Unity", Unity logos, and other Unity trademarks are trademarks or registered trademarks of Unity Technologies or its affiliates in the U.S. and elsewhere (more info here). Other names or brands are trademarks of their respective owners.
  • Anonymous
  • Sign in
  • Create
  • Ask a question
  • Spaces
  • Default
  • Help Room
  • META
  • Moderators
  • Explore
  • Topics
  • Questions
  • Users
  • Badges