Digital Leadership & Soft Skills

GUI в Unity 4

Опубликовано by Pavel Nakonechnyy on в GameDev.

С этой статьи я пожалуй начну разбирать возможности Unity3D в плане GUI, с начало я просто хотел разобрать все элементы, такие как Button, Label и тому подобное, но подумал что не которым будут интересны основы организации стандартного GUI в Unity3D. Так же предупрежу что все примеру будут представлены на C# и статья рассчитана на людей, знакомых с программированием.

Вводный рассказ в GUI и компоненты для работы с ним.

Методы для работы находятся в классе GUI и GUILayout, методы из этих классов нужно вызывать, только в функции OnGUI и всех вызываемых из неё. GUILayout более автоматизирован, о нём будет рассказано в следующем цикле, если он вообще будет. В Unity3D так же, пред усмотрены компоненты помогающие гибко настраивать отображения GUI, GUISkin и GUIStyle. GUISkin используется для глобального изменения отображения, а GUIStyle для более локального, а каждом из компонентов будет рассказано в рамках цикла статей о GUI. Ещё есть GUIContent объект, вмещающий в себя, текст, картинку, и подсказку.

Простой пример.

Чтобы вы поняли, что всё стало чуточку понятней, приведу простой пример. Я буду считать что вы уже умеете создавать скрипты, навешивать их на объекты, и назначать значения переменным.

using UnityEngine;
 
using System.Collections;
 
using System;
 
public class GUIExample : MonoBehaviour {
 
void OnGUI()
 
{
 
GUI.Label(new Rect(30, 50, 100, 30), "Hello world");
 
}
 
}

В левом верхнем углу будет выведена надпись белого цвета «Hello world». Но белый это скучно, давайте добавим прям перед вызовом «GUI.Label» вот такую вот строчку «GUI.color = Color.yellow;». В итоге наша функция OnGUI должна выглядеть вот так:

void OnGUI()
 
{
 
GUI.color = Color.yellow;
 
GUI.Label(new Rect(30, 50, 100, 30), "Hello world");
 
}

Думаю многие догадались, что мы сделали (глобально изменили цвет, всего что выводим). Для этих целей, можно также использовать GUIStyle и GUISkin.

Немного о Rect.

Думаю прежде чем переходить, к более подробному разбору возможностей объекта GUI, стоит рассказать с помощью чего задаётся позиция рисования различных GUI элементов. Rect представляет из себя объект, хранящий в себе различную информацию о позиции и размере прямоугольника. В конструкторе он принимает, позицию и размер по X и Y оси. Объекту Rect можно задать центр, очень полезная возможность, для задания центра, нужно в поля center передать объект Vector с позицией по X и Y. В примере выше, мы создавали объект Rect прямо при отрисовке. Также в объекте Rect перегружены операторы == и !=.

public Rect(
    double x,
    double y,
    double width,
    double height
)

Вывод контента.

GUI.Label – представляет из себя элемент для вывода различного контента. Через Label можно вывести текст, изображения и GUIContent. Для того, чтобы вывести изображения через Label, нужно втором аргументе вместо текста передать Texture2D.

using UnityEngine;
 
using System.Collections;
 
using System;
 
public class GUIExample : MonoBehaviour {
 
public Texture2D tex;
 
void OnGUI()
 
{
 
GUI.Label(new Rect(30, 50, 100, 30), tex);
 
}
 
}

Будет выведена текстура, если её назначить в редакторе, иначе будет NullReferenceExeption.

GUI.DrawTexture – отличается от Label только тем что можно выводить только изображения, однако, если копнуть глубже, то можно узнать, что через DrawTexture можно управлять некоторыми свойствами отображения текстуры. Первый и второй аргумент это позиция и изображения, а вот на 3,4 и 5 нужно остановится. ScaleMode определяет маштабирование изображения при выводе. Мы можем выбрать три варианта:

ScretchToFill – изображение будет растянуто под все поле.

ScaleAndCrop – изображение будет масштабировано с сохранением пропорций, то есть если попытаться вывести квадратное изображения по прямоугольному объекту, изображения будет растянуто в ровный квадрат, лишнее будет обрезано.

ScaleToFit – масштабирование с сохранением пропорций, до тех пор пока изображения вмещается в объект. Ничего обрезано не будет.

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

using UnityEngine;
 
using System.Collections;
 
using System;
 
public class GUIExample : MonoBehaviour {
 
public Texture2D tex;
 
void OnGUI()
 
{
 
GUI.DrawTexture(new Rect(10, 10, 60, 60), tex, ScaleMode.ScaleToFit, true, 0);
 
}
 
}

Взаимодействие с пользователем.

GUI.Button –Как не трудно догадаться по названию, кнопка. Абсолютно идентична Label, ну кроме стандартного оформления, того что возвращает параметр типа bool и что это кнопка. Вот возвращаемый параметр и позволяет взаимодействовать программисту с этим элементом как с кнопкой, если на кнопку нажали вернётся true если нет false. Надеюсь что

многие догадались как использовать Button если же нет, то вот пояснения.

Если заключить вызов метода в оператор if то он выполнится если на кнопку нажмут. И конечно же без примера тут не как не обойтись.

using UnityEngine;
 
using System.Collections;
 
using System;
 
public class GUIExample : MonoBehaviour {
 
public Texture2D tex;
 
void OnGUI()
 
{
 
if(GUI.Button(new Rect(10, 10, 50, 50), "Push!"))
 
{
 
print("Good job");
}
 
}
 
}

В верхнем левом углу будет выведена кнопка, при нажатии на которую в консоль (debug log) будет выведено «Good job».

GUI.TextField – с помощью этого элемента, можно организовать строку ввода текста, указать ее позицию, текст который будет выводится, и максимальную длину строки которую можно ввести (необязательно). Возвращает строку которая была введена. Ещё есть маленькая хитрость:

using UnityEngine;
 
using System.Collections;
 
using System;
 
public class GUIExample : MonoBehaviour {
 
public string stringToEdit = "Input String";
 
void OnGUI()
 
{
 
stringToEdit = GUI.TextField(new Rect(10, 10, 200, 20), stringToEdit, 25);
 
}
 
}

Она заключается в том, что мы передаём во втором аргументе то, что ввёл пользователь. Тогда получается, что пользователь видит текст, который вводит.

GUI.PasswordField — полностью аналогичен TextField, вот только символы которые выводятся можно замаскировать.

using UnityEngine;
 
using System.Collections;
 
using System;
 
public class GUIExample : MonoBehaviour {
 
public string stringToEdit = "Input String";
 
void OnGUI()
 
{
 
stringToEdit = GUI.PasswordField(new Rect(10, 10, 200, 20), stringToEdit,
 
'*',25);
 
}
 
}

Символ маскировки передаётся в третьем аргументе а максимальная длина в четвёртом.

Заключения.

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

using UnityEngine;
 
using System.Collections;
 
public class GUIExample : MonoBehaviour {
 
public string FinishText = "", stringToEdit = "";
 
void Start () {
 
}
 
void OnGUI() {
 
stringToEdit = GUI.TextField(new Rect(10, 10, 200, 20), stringToEdit, 25);
 
if (GUI.Button(new Rect(10, 30, 100, 20), "Set text"))
 
{
 
FinishText = stringToEdit;
 
}
 
GUI.Label(new Rect(10, 50, 150, 20), FinishText);
 
}
 
}

Здесь выводится поле для ввода текста, и кнопка, при нажатии на которую текст выводится в Label.

610