Как правильно задавать размеры?

Question

[Zimaell]

У меня есть несколько префабов которые сделаны из картинок 150x150 пикселей, камере я задал такое значения - Portrait 9:16.
Далее я через цикл вывел префабы сеткой 10 на 17, так как они были больше клеток то я их размеры уменьшил до 0.7, в тесте выглядело нормально. Далее я скомпилировал на телефон, вывод следующий - префабы на 10-15% растянуты по высоте, а так же не влазят все на экран, примерно по пол префаба слева и справа не влазят, при тесте наоборот было по бокам по пол префаба свободного места...

Вопросы следующие:
1. Как Получать одинаковый результат в тесте и на телефоне?
2. Как мне делать и располагать префабы так чтобы они на любом телефоне были относительно одинакового размера?

Answer 1

[Dmitriy Grape]

Надо Canvas’у поставить Render Mode — Screen Space Camera и в нужное поле перетащить нашу камеру, а в компоненте canvas scaler поставить scale mode на «scale with screen size».

Движок сам будет пропорционально масштабировать ваш интерфейс на всех устройствах.

PS. Первый пункт чисто для удобства.

Comments

[Zimaell]

Сделал как вы говорите, но результат тот же, вот скрины как в тесте и на телефоне

[Zimaell]

великоват скрин с телефона получился, но я думаю суть понятна что к чему...

[Dmitriy Grape]

Zimaell, кстати, Portrait 9:16 — это вы не камере задали, это имитация размеров экрана в окне Game, а размер камеры зависит от размеров экрана. Попробуйте найти в интернете размер экрана, ну, например, iPhone 8 в пикселях и задайте это значение окну Game и посмотрите на результат, он скорее всего будет таким же как и на скриншоте.

Короче, у вас есть телефон? Вот вам совет: найдите его размер экрана в интернете, забейте в движок и разрабатывайте относительно него, далее за вас всё сделает Scale With Screen Size. Я всегда делаю так, когда разрабатываю что-то под мобилу.

И да, на 50 процентов проблема решена, префабы ведь больше не растянуты по высоте? :)

[Zimaell]

Rag’n’ Code Man, но размеры то у всех устройств разные, вот я установил такое вот значение, установил значения как на моем телефоне и результат тот же, а мне то нужно чтобы было как в тесте...

[Dmitriy Grape]

Попробуйте создать панель (UI->Panel) и рендерить все элементы в неё, а не напрямую в Canvas, панель используют для группировки элементов. Может тогда получится ограничить их перемещение в пространстве?

[Zimaell]

Rag’n’ Code Man, создал панель в канвасе, панель по размеру экрана, скрипт который выводит префабы теперь закинул в панель (предварительно удалив из канваса), результат тот же, в тесте норм на телефоне залазит...

[Dmitriy Grape]

Возможно в Unity есть какой-то предел пропорционального уменьшения, после которого он перестаёт работать, а у вас на сцене так много объектов в сетке, сто коэффициент масштабирования слишком большой, просто ради интереса попробуйте убрать, допустим, одну-две колонны элементов. Если всё будет выглядеть как надо, значит я прав.

[Zimaell]

Rag’n’ Code Man, да нет, конечно если поубирать по бокам по одной колонке то на телефоне оно помещается и по бокам немного места, а в тесте по бокам гуляй поле, это не то...

[Qugurun]

Zimaell, я тут заметил вот что, созданные объекты лежат не в Canvas, им родителя при создании нужно было указать Canvas, тогда то что говорил Rag’n’ Code Man сработало бы. Хотя я надеюсь что вы этот вопрос к данному времени победили и моё решение с скриптом на камеру вам подошёл.

Answer 2

[Qugurun]

Попробуйте накинуть скрипт на камеру:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class CameraController : MonoBehaviour
{
  public int Mobile = 640;
  public int Tablet = 852;

  void Start()
  {
    if (Camera.main.pixelHeight > Camera.main.pixelWidth){
      //PORTRAIT
      float ratio =  (float) Camera.main.pixelHeight/Camera.main.pixelWidth;
      if (ratio >= 1.5f)
      {
        Camera.main.orthographicSize = (float) (Mobile*ratio)/200f;
      }
      else
      {
        Camera.main.orthographicSize = (float) (Tablet*ratio)/200f;
      }
    }
    else
    {
      //LANDSCAPE
      float ratio =  (float) Camera.main.pixelWidth/Camera.main.pixelHeight;
      if (ratio >= 1.5f)
      {
        Camera.main.orthographicSize = (float) Mobile/200f;
      }
      else
      {
        Camera.main.orthographicSize = (float) Tablet/200f;
      }
    }
  }

}

Задайте только размер в настройках по нужной ширине для mobile и tablet, под какой размер делался макет.

Comments

[Zimaell]

но ведь размер не должен быть фиксированным, смартфоны то разных размеров, должна быть гибкость...

[Qugurun]

Zimaell, всё верно, скрипт подгоняет размер камеры под каждое устройство, чтобы было всё как надо.
Хотя это не единственное решение вашей задачи.