Универсальный контроллер GUI интерфейса. (Js)

[Левш@]

С этим кодом ничего, никуда не расползаеться, все четко стоит на местах под любым разрешением экрана, писал под свой проект.
Внимание! написано не под реалтайм, выравнивание происходит только 1 раз при старте. (можете переделать, кому нужно).

Синтаксис:

Синтаксис: [ Показать ]

Используется javascript

var posX = 0.0;
var posY = 0.0;
var shirina = 0.0;
var vysota = 0.0;
var scrinWidth = 0.0;
var scrinHeight = 0.0;
var scrinBalansWidth = 0.0;
var scrinBalansHeight = 0.0;

function Start ()  {
        posX = guiTexture.pixelInset.x;
        posY = guiTexture.pixelInset.y;
        shirina = guiTexture.pixelInset.width;
        vysota = guiTexture.pixelInset.height;
            scrinWidth = Screen.width;
        scrinHeight = Screen.height;
        scrinBalansWidth = 1452 / scrinWidth;
        scrinBalansHeight = 910 / scrinHeight;
        Balans ();
}

function Balans () {
        guiTexture.pixelInset.x = posX / scrinBalansWidth;
        guiTexture.pixelInset.y = posY / scrinBalansHeight;
        guiTexture.pixelInset.width = shirina / scrinBalansWidth;
        guiTexture.pixelInset.height = vysota / scrinBalansHeight;
}

Обьясняю суть кода:
Обычно все работают в редакторе в режиме FreeAspect (но это не важно, применимо под любое разрешение), устанавливаете все параметры размеров и позиций обьектов GUI как обычно в инспекторе, в свойствах.
Затем вешаете данный скрипт на каждый GUI обьект интерфейса. (ВАЖНО! - в делители переменных scrinBalansWidth и scrinBalansHeight пропишите реальные значения разрешения в котором настраивался GUI).
Дальше скрипт будет сам устанавливать все позиции и размеры относительно ScrinResolution, четко сохраняя все обьекты на своих местах в любой точке экрана.
Скрипт сначала записывает в свои переменные ваши настройки, затем пересчитывает все под текущее разрешение экрана и возвращает назад уже уточненые, сохраняя все соотношения и применяя новые размеры и позиции обьектов.

640 х 480


1920 х 1080


Вот, добавил для GUIText:

Синтаксис:

Синтаксис: [ Показать ]

Используется javascript

private var pos_X = 0.0;
private var pos_Y = 0.0;
private var textSize = 0;
private var scrinWidth = 0.0;
private var scrinHeight = 0.0;
private var BalansWidth = 0.0;
private var BalansHeight = 0.0;

function Start ()  {
                pos_X = guiText.pixelOffset.x;
                pos_Y = guiText.pixelOffset.y;
                textSize = guiText.fontSize;
                scrinWidth = Screen.width;
                scrinHeight = Screen.height;
                BalansWidth = 800 / scrinWidth;
                BalansHeight = 600 / scrinHeight;
                guiText.pixelOffset.x = pos_X / BalansWidth;
                guiText.pixelOffset.y = pos_Y / BalansHeight;
                guiText.fontSize = textSize / BalansHeight;
}

[Deatrocker]

Спасибо!!! это хорошее решение, да вот только есть еще один косяк =) интерфейс как его ненастраивай уходит гулять при реальном запуске =) Но это просто уже тонкости настройки =) Кстати разве нельзя сделать внутри игровое меню с настройками разрешения, и например по нажатию на другое разрешение происходит пересчет? =)

[Левш@]

Кстати разве нельзя сделать внутри игровое меню с настройками разрешения, и например по нажатию на другое разрешение происходит пересчет? =)

Можно, тот же участок кода перевести в Update.
Или так, контролировать изменения и пересчитывать:

Синтаксис:

Синтаксис: [ Показать ]

Используется javascript

function OnGUI ()  {
        if (scrinWidth != Screen.width || scrinHeight != Screen.height)
                GuiCorector ();
}
function GuiCorector ()  {
                pos_X = guiText.pixelOffset.x;
                pos_Y = guiText.pixelOffset.y;
                textSize = guiText.fontSize;
                BalansWidth = scrinWidth / Screen.width;
                BalansHeight = scrinHeight / Screen.height;
                guiText.pixelOffset.x = pos_X / BalansWidth;
                guiText.pixelOffset.y = pos_Y / BalansHeight;
                guiText.fontSize = textSize / BalansHeight;
                scrinWidth = Screen.width;
                scrinHeight = Screen.height;
}

Кстати, добавил в шапку код для GUIText.

[narutokaubi98]

помогите плз,неполучается...скайп Dem0ndevil

[Левш@]

Что именно не получаеться?

интерфейс как его ненастраивай уходит гулять при реальном запуске =)

Посмотрите на скрины вверху темы, где он гуляет? Абсолютно все на местах, пиксель в пиксель...

[narutokaubi98]

у меня она просто меньше стоновитя задоного

[faceOFF]

Автору СПАСИБО большое!!!

интерфейс как его ненастраивай уходит гулять при реальном запуске =)

у меня она просто меньше стоновитя задоного

Тоже не сразу вкурил, тк сначала пытался выставлять разрешение в var scrinBalansWidth = 0.0; var scrinBalansHeight = 0.0;
Его нужно менять в:

function Start () {
posX = guiTexture.pixelInset.x;
posY = guiTexture.pixelInset.y;
shirina = guiTexture.pixelInset.width;
vysota = guiTexture.pixelInset.height;
scrinWidth = Screen.width;
scrinHeight = Screen.height;
scrinBalansWidth = 1452 / scrinWidth;
scrinBalansHeight = 910 / scrinHeight;
Balans ();
}

В итоге Если у меня в окне Game выставленно NexusOne Tall (480x800) то у меня получается:

Синтаксис:

Синтаксис: [ Показать ]

Используется javascript

function Start ()  {
        posX = guiTexture.pixelInset.x;
        posY = guiTexture.pixelInset.y;
        shirina = guiTexture.pixelInset.width;
        vysota = guiTexture.pixelInset.height;
        scrinWidth = Screen.width;
        scrinHeight = Screen.height;
        scrinBalansWidth = 480 / scrinWidth;
        scrinBalansHeight = 800 / scrinHeight;
        Balans ();
}

Всё работает как часы!!!
Ещё раз спасибо!!!

[faceOFF]

GUILayout.Label возможно заресайзить подобным образом?

[pod4444]

GUILayout.Label возможно заресайзить подобным образом?

можно

[Левш@]

Тоже не сразу вкурил, тк сначала пытался выставлять разрешение в var scrinBalansWidth = 0.0; var scrinBalansHeight = 0.0;

Ну так писалось же:

(ВАЖНО! - в делители переменных scrinBalansWidth и scrinBalansHeight пропишите реальные значения разрешения в котором настраивался GUI).

И еще если нужно сохранять форму квадратных или круглых обьктов, то вводиться тег "QwadGui",присваиваеться квадратным (или круглым) обьектам и тогда делаем так:

Синтаксис:

Синтаксис: [ Показать ]

Используется javascript

if (guiTexture.gameObject.tag == "QwadGui") {
        guiTexture.pixelInset.x += (guiTexture.pixelInset.width - guiTexture.pixelInset.height) / 2;
        guiTexture.pixelInset.width = guiTexture.pixelInset.height;
}
 

Полный код:

Синтаксис:

Синтаксис: [ Показать ]

Используется javascript

private var posX = 0.0;
private var posY = 0.0;
private var shirina = 0.0;
private var vysota = 0.0;
private var scrinWidth = 0.0;
private var scrinHeight = 0.0;
private var BalansWidth = 0.0;
private var BalansHeight = 0.0;

function Start () {
                posX = guiTexture.pixelInset.x;
                posY = guiTexture.pixelInset.y;
                shirina = guiTexture.pixelInset.width;
                vysota = guiTexture.pixelInset.height;
                scrinWidth = Screen.width;
                scrinHeight = Screen.height;
                BalansWidth = 800 / scrinWidth;
                BalansHeight = 600 / scrinHeight;
                guiTexture.pixelInset.x = posX / BalansWidth;
                guiTexture.pixelInset.y = posY / BalansHeight;
                guiTexture.pixelInset.width = shirina / BalansWidth;
                guiTexture.pixelInset.height = vysota / BalansHeight;
                Interface.orderInterface = 1;
                GuiCorector();
}
function OnGUI ()  {
        if (scrinWidth != Screen.width || scrinHeight != Screen.height)
                GuiCorector ();
}
function GuiCorector ()  {
                posX = guiTexture.pixelInset.x;
                posY = guiTexture.pixelInset.y;
                shirina = guiTexture.pixelInset.width;
                vysota = guiTexture.pixelInset.height;
                BalansWidth = scrinWidth / Screen.width;
                BalansHeight = scrinHeight / Screen.height;
                guiTexture.pixelInset.x = posX / BalansWidth;
                guiTexture.pixelInset.y = posY / BalansHeight;
                guiTexture.pixelInset.width = shirina / BalansWidth;
                guiTexture.pixelInset.height = vysota / BalansHeight;
                scrinWidth = Screen.width;
                scrinHeight = Screen.height;
        if (guiTexture.gameObject.tag == "QwadGui") {
                guiTexture.pixelInset.x += (guiTexture.pixelInset.width - guiTexture.pixelInset.height) / 2;
                guiTexture.pixelInset.width = guiTexture.pixelInset.height;
        }
        if (guiTexture.gameObject.tag == "RadarGui")
                guiTexture.pixelInset.width = guiTexture.pixelInset.height;
}
 

[Ingener]

Можно ли какую-нибудь показательную демку?

[Левш@]

показательную демку?

Вообщето даренному коню в зубы не смотрят.
Ну да ладно, сбилдю что нибудь потом...

[anti0]

Скажите пожалуйста этот скрипт нужно кидать на сам guitexture?Если так то как было написано narutokaubi98 - объект только становится меньше.

[Левш@]

скрипт нужно кидать на сам guitexture

да.

как было написано narutokaubi98 - объект только становится меньше

В кривых руках - возможно...
В шапке темы есть скрины и разрешения из которых снимались указаны.

Причина судя по всему в невнимательности:
ВАЖНО! - в делители переменных scrinBalansWidth и scrinBalansHeight пропишите реальные значения разрешения в котором настраивался GUI

[lonleystranger]

Хотел спросить, а этот скрипт выгоднее, чем считать каждую координату в процентном отношении к экрану? Ведь если считать координаты в процентном отношении, то не только объекты будут на своих местах, а и размер объектов будет соответсвующий, и на высоком разрешении меню не будут выглядеть миниатюрными... Да и делается процентное отношение проще. Просто хочу спросить мнение старожилов форума...