Unity UI квадрат, который заполняет ширину ИЛИ высоту

Я пытаюсь создать доску с такими требованиями:

• Это должно быть квадратным.
• Он ДОЛЖЕН соответствовать имеющейся ширине ИЛИ высоте.
• Это должно быть сосредоточено на холсте.
• Это МОЖЕТ быть обернуто в столько дополнительных промежуточных полотен, сколько необходимо.

Я играю с якорями, но я не нахожу никакой комбинации для этого. Единственное решение, которое я могу придумать, - это скрипт какого-то «OnResize» контейнера и программно установить размер платы.

Это оригинальный макет. (1) это BoardCanvas. (2) это доска.

Я хочу, чтобы, если экран становился выше, квадрат увеличивался, но все еще был квадратным:

Или уменьшает:

Но, хотя эти предыдущие примеры привязываются к верхнему и нижнему краям, я также хочу, чтобы, если вертикальное пространство становилось выше доступной ширины, квадрат ограничивал свой размер в зависимости от левой и правой границ:

Q1: есть ли способ сделать это с помощью якорей / стержней? Для меня нормально создавать промежуточные холсты между BoardCanvas и самой Board, если это работает.

Q2: если так, где я должен расположить якоря? Нужны ли промежуточные объекты?

Q3: если нет, сценарий является решением? Есть ли на холсте OnResize для обработки? Я не вижу ни одного события изменения размера в списке, но, возможно, я не знаю, где его искать. Я чувствую, что тестирование на каждом кадре кажется излишним, а управляемое событиями - лучше.

Спасибо!

Наконец, я нашел способ сделать это (проверено в v5.0.0), таким образом:

• Не требуется код или условные выражения для проверки ориентации.
• Не взламывает весы и не требует эталонного разрешения.

В видеоуроках по пользовательскому интерфейсу пропущена большая часть, хотя она хорошо документирована в текстовой документации: система «автоматических макетов».

Авто-макеты - это механизмы, сделанные из «макетов» и «контроллеров макетов». Контроллеры макета - это компоненты, которые можно прикрепить к игровому объекту пользовательского интерфейса. Контроллеры могут Rect Transformразумно изменять размеры .

Некоторые контроллеры могут изменять размер объекта, к которому применяется компонент, в то время как другие контроллеры могут изменять размер дочерних объектов этого объекта.

Там несколько встроенных контроллеров. Одним из них является Aspect Ratio Fitter.

Сначала я выбираю Boardпанель и прикрепляю новый Aspect Ratio Fitterкомпонент:

Aspect Ratio Fitter, Кажется, направлена на «поддержание» хотел соотношение сторон объекта. Для этого можно либо установить «обтекание» объекта вокруг дочернего объекта (при сохранении соотношения сторон), либо установить расширение и заполнение его контейнера (при сохранении соотношения сторон).

Затем я выбираю Fit In Parentопцию и указываю, что хочу получить идеальный квадрат, устанавливая желаемое соотношение сторон 1:

Это дает очень похожий макет, чем тот, который я хотел, но мне не нужно было указывать плате его размеры. Но все же, он знает, что он должен быть квадратным, как изображено:

Если я уменьшу по вертикали или увеличу, квадрат следует за родителем, сохраняя соотношение сторон:

Как ни странно, когда изменение происходит из-за уменьшения ширины, нет никакого сценария, который нужно присоединить, и никакого свойства, которое нужно изменить, так как «Fitter Ratio Fitter» делает это для нас автоматически:

Наконец, так как я хотел немного отступить, я просто поместил прямоугольное преобразование контейнера, которое действует как разделитель, и переместил его Boardиз BoardCanvasв в MarginCanvas:

Это возможно, но, возможно, с помощью небольшой или двух строчек кода для определения, является ли экран горизонтальным или портретным, и для изменения пары значений.

На холсте вам нужно сделать «Режим шкалы пользовательского интерфейса» для «Масштабирование с размером экрана», а «Режим соответствия экрана» - «Соответствие ширине или высоте»:

Предполагая, что используется эталонное разрешение по умолчанию 800x600, и предполагая, что область просмотра экрана является альбомной (например Screen.width, больше, чем Screen.height), ползунок соответствия должен быть установлен полностью в направлении Высота как 1.

Затем вы захотите получить изображение на холсте, используя среднюю / центральную привязку. Вы также хотите, чтобы ширина и высота изображения соответствовали значению Y вашего эталонного разрешения скейлера холста.

Затем вы можете изменить размер области просмотра камеры и увидеть, что изображение сохраняет свою форму, растягивая его высоту, чтобы соответствовать высоте области просмотра:

Если экран портретный - и именно здесь вам, вероятно, понадобится код для проверки и / или изменения в соответствии с требованиями - вам нужно установить значение соответствия масштабирования 0и изменить высоту и ширину изображения в соответствии с эталонным разрешением. Значение X (на рисунках ниже ширина и высота изображения оба 800)

Если вы пытаетесь вставить изображение меньшего размера внутри, вы можете «масштаб» изображение, регулируя его ширину и высоту от X в разрешении ссылок или значение Y (в зависимости от ландшафта или портрета). Так, например, я сделал синий квадрат, который использует половину значения X Reference Resolutions X (поскольку область просмотра - портретная), и он хорошо масштабируется и сжимается:

И, кроме того, если вам нужна шахматная доска или что-то еще, положение X и Y каждого изображения, а также Высота и Ширина могут основываться на проценте от Разрешения Canvas Scaler, чтобы делать все, что вам угодно: