• 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 Arganoid · Jan 28, 2016 at 01:29 PM · guilayoutwordwrapguilayout.button

Detecting and dealing with bad word wrap (IMGUI)

I have a screen in my game with three buttons arranged along the bottom of the screen, using GUILayout. There is sufficient vertical space for the text to wrap onto multiple lines, but sometimes a piece of text contains a word that is wider than the button, so I get a line break within a word, which obviously looks bad.

My initial approach to fixing this has been to fix the width of each button to Screen.width / 3f, and then use CalcHeight to compare the height of the text on a single line to the height of the text when restricted to Screen.width / 3f. I then compare this to the word count of the text – if, for example, a piece of text with two words is going to wrap onto three lines, I reduce the font size and try again – see below:

 GUIContent content = new GUIContent(it.txt);
 int wordCount = it.txt.Count(ch => ch == ' ') + 1;
 float height1Line = buttonStyle.CalcHeight(content, 1e5f);
 float height, numLines;
 do
 {
     height = buttonStyle.CalcHeight(content, (float)Screen.width / 3f);
     numLines = height / height1Line;
     buttonStyle.fontSize--;
 }
 while (numLines > wordCount && buttonStyle.fontSize > 10);

There are two problems with this, as far as I can tell. First, fixing the button width at a third of the screen width means the third button ends up going slightly off the right-hand edge, because GUILayout puts a small gap between each button. Second, I still sometimes get line breaks in the middle of a word – I'm wondering whether GUILayout has a padding area between the edges of the button and the text area, so that the text doesn't go right up to the end of the button.

The first problem could be fixed by switching from GUILayout to GUI, but it's not clear how I should deal with the second problem, beyond just guessing how much padding there might be. Is there a better way? Does the new GUI have any tools to deal with this kind of problem?

Edit: I've solved problem 1 using GUIStyle.margin

Comment
Add comment
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

1 Reply

· Add your reply
  • Sort: 
avatar image
0

Answer by Arganoid · Mar 17, 2016 at 08:16 PM

Solution: use data in style.border and style.padding, and fix code above so that height1Line is recalculated each time the font size is reduced.

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.

Welcome to Unity Answers

The best place to ask and answer questions about development with Unity.

To help users navigate the site we have posted a site navigation guide.

If you are a new user to Unity Answers, check out our FAQ for more information.

Make sure to check out our Knowledge Base for commonly asked Unity questions.

If you are a moderator, see our Moderator Guidelines page.

We are making improvements to UA, see the list of changes.



Follow this Question

Answers Answers and Comments

3 People are following this question.

avatar image avatar image avatar image

Related Questions

[SOLVED]GUIStyle Word Wrap Check 1 Answer

GUILayout.Button image 0 Answers

How to add GUIStyle to GUILayout Button 1 Answer

GUILayout.Label - WordWrap and FontSize issue. 2 Answers

How can I create nested buttons ? 2 Answers

  • Anonymous
  • Sign in
  • Create
  • Ask a question
  • Spaces
  • Default
  • Help Room
  • META
  • Moderators
  • Explore
  • Topics
  • Questions
  • Users
  • Badges