0
\$\begingroup\$

This is a menu that appears if I press Enter on the RE4 inventory if an item is selected. I have drawn a thin red rectangle around it:

enter image description here

And here is a video that shows some of the menu's effects.

I am familiar with a simple text canvas. I understand that I need to make each line a separate "Text" object so that I can scroll up and down through them.

Here is what I have so far:

enter image description here

The problem that I'm facing now is that the Canvas will be scaled at runtime. I don't work with fixed values. This is a problem since I don't see how I could easily make it so that each TextLine object fills 33,3% of the canvas.

Am I right to assume that I can only solve this by making a scripts that holds a reference to each TextLine object and which then calculates their position when the scale of Canvas is known?

Or is there any easier solution?

Thank you!

\$\endgroup\$
1
\$\begingroup\$

This looks like a straightforward application of the anchor properties in the UI layout system:

Animation showing configuration of three lines in Unity editor

All three lines should have their Min X and 0 and Max X at 1, so the anchors span the full width of the container.

Then you vary the Min & Max Y of each item. The bottom line runs from 0 to 0.3333, the middle line from 0.3333 to 0.66666, and the top line from 0.6666 to 1.

Set the Left Top Right Bottom parameters to zero, so the corners of the text area snap exactly to the anchor points, and you're done.

Since the anchors are specified as fractions of the parent's size, anything you do to change the size of the parent will automatically adjust the layout of the text to preserve these ratios.

Animation showing changing the size & aspect ratio of the container

Of course, if you don't want to fiddle with these percentages every time you add or remove an item from your list, you can also just nest them inside a parent with a Vertical Layout Group that will handle positioning & sizing them for you:

Inspector configuration of Vertical Layout Group

\$\endgroup\$
2
  • \$\begingroup\$ Thank you so much! When I change Anchor's "Min Y", it automatically sets a new (non-zero) value on the RectTransform's "Bottom" property. I have set manually set it back to 0. Is that something that you're fighting with, too, or did I do anything different than you did? \$\endgroup\$ – tmighty Jul 9 '19 at 23:21
  • 1
    \$\begingroup\$ Please don't neglect to read the documentation for the tools you're using, where you'll find gems like: "Note that changing the values in the anchor or pivot fields will normally counter-adjust the positioning values in order to make the rectangle stay in place. In cases where this is not desired, enable Raw edit mode by clicking the R button in the Inspector. This causes the anchor and pivot value to be able to be changed without any other values changing as a result." \$\endgroup\$ – DMGregory Jul 9 '19 at 23:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.