Как я делал CandyCrash на Unity3D( Часть 1)


Я понимаю что все таки Render ru больше сайт о графике но я думаю кому то моя статья будет полезной. Оригинал я написал на своем сайте  тут блог по ходу ограничен каким то количеством символов поэтому я разделю его на несколько частей.


01) Ресурсы игры

    Что же такое ресурсы игры это по сути набор деталей игры из которых строиться игра. В некоторых играх этих рессурсов могут быть десятки тысяч а в некоторых как наша не более 10 штук.  Итак что нам понадобиться.

1) Нам нужны изображения фигур которые в дальнейшем мы будем  уничтожать. Для этого воспользовавшись каким ни будь простым редактором например PaintNet создадим картинки для уничтожения.

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

Таблица с моими изображениями которые будем дальше использовать как части уровня:

 6.png

 7.png

blank.png

  5.png

 1.png

 2.png

 3.png

  4.png

    У нас будут разноцветные квадраты в качестве кубиков и один полностью прозрачный квадрат для показа пустых мест.

   Собственно на этом этапе мы скачиваем все картинки либо рисуем свои и запускаем Unity3D у меня она 5 версии, с персональной лицензией. Но уверен что мой пример заработает даже на 1 версии этого прекрасного конструктора.

    Итак запускаем и создаем новый проект:

   В открывающимся окне вводим имя проекта в моем случае cibergod.ru далее путь где будут храниться все файлы проекта. И в низу есть выбор 2D или 3D я полагаю что наша игра будет происходить в 2D режиме поэтому выбрал именно этот вариант.

    Далее просто выбираем кнопку Create Project создать проект и идем пить чай пока Unity3D все подготовит для нас. После запуска проекта нужно перенести из папки с нашими картинками в проект картинки для этого выделяем их мышкой и тащим в папку.

    Unity3D сама сохранит и распознает файлы и далее нам останется просто ими пользоваться.

   

    Все ресурсы у нас есть теперь будем создавать объекты внутри редактора которые нам помогут в дальнейшей работе.

02) Создаем игровой блок

   Итак основой игрового процесса являются разноцветные блоки или точнее разноцветный блок да да он один за все отдувается.

    Для создания игрового блока в окне в который мы перетащили наши картинки нажмем кнопку создать и выберем тип создаваемого объекта Prefab.

    У нас в ресурсах игры появиться непонятный элемент из которого мы сделаем нам блок для игры. После создания Unity3D попросить назначить ему имя скажем пусть будет называться Box.

    Далее над хранилищем ресурсов (assert store есть) расположено окошко Hierarhy в нем расположены все объекты участвующие в игре сейчас там кроме Main camera (главной камеры ) нет ничего.  Выделяем мышью картинку с названием Blank пустой объект и переносим ее в это окошко.

    Особенность игрового объекта Prefab в том что он может хранить любой настроенных игровой элемент но настраивать его приходиться непосредственно на сцене игры. Для этого мы и перенесли нашу картинку на сцену. А теперь берем нашу картинку со сцены и переносим в Prefab и он становиться не пустым а начинает обладать свойствами которыми обладала картинка.

Итак до добавления картинки в prefab у него ничего не было:

   Перетаскиваем на него картинку со сцены и он начинает хранить параметры этой картинки.


    Теперь свойства Prefab не пусты и мы сможем их изменять во время работы нашей игры подбирая нужное изображение в нужный момент времени.

    Далее нужно выполнить очень важный шаг все объекты игрового мира Unity3D могут реагировать на нажатие мышкой но только в том случае если у них есть так называемый collider именно он реагирует на столкновение с чем угодно буль то мышка или соседний игровой объект. 

   Поэтому добавим такой коллайдер в наш prefab. жмем на кнопку add component >> Phisics >> Box Collider


   

    Теперь наш игровой элемент будет реагировать на нажатие клавиши мыши над ним.

    Итак зачем же мы делали этот замечательный Prefab а для того чтобы сделать универсальный кубик который бы умел менять свой цвет в зависимости от номера картинки которую мы хотим выбрать. 

03) Смена цвета блока

    Итак у нас есть один блок и 8 картинок которые по каким нибудь причинам будут заменяться друг на друга. Для того чтобы писать логику поведения игрового объекта в Unity3D используются скрипты на языке программирования. Для моего примера возьмем язык C#.

    Начнем в Assert Store ( хранилище ресурсов ) нажмем правую кнопку мыши и выберем из меню создать C# скрипт.

    Unity3D попросит назвать этот скрипт. Назовем его Change по английски изменить. Как бы понятное название.

    Далее выделим наш prefab Box добавим этот скрипт как компонент для этого жмем на кнопку 

add componenet >>  Scripts >> Change

    Таким образом мы связали код который будет  описан в этом файле с элементом Box. И при игре Unity3D будет выполнять различные команды описанные нами для этого элемента.  Далее откроем код и будем его править. Для этого нажимаем двойным щелчком мыши по файлу Change он откроется в редакторе MonoDevelop либо какой настроен у Вас. Либо нажимаем правую клавишу мыши и выбираем пункт Open

    Ура вот и сам код который для нас подготовила Unity3D автоматически

Стартовый код

using UnityEngine;

using System.Collections;

public class Change : MonoBehaviour {

// Функция срабатывает 1 раз при создании объекта

void Start () {

}

// Функция срабатывает каждый раз при обновлении экрана

void Update () {

}

}

    Наши картинки они двухмерные и в параметрах когда Unity3D из вносила в реестр ресурсов она им выставила тип 

    Итак в теле нашего кода мы объявим динамический ( безразмерный ) массив в котором разместим все нужные нам для игры картинки. Для этого пишем следующий код.

Объявим список картинок

public Sprite[] ImgList;

    Теперь наш текст будет выглядеть следующим образом:

Объявляем массив картинок

using UnityEngine;

using System.Collections;

public class Change : MonoBehaviour {

//Объявим список картинок

public Sprite[] ImgList;

// Функция срабатывает  1 раз при создании объекта

void Start () {

}

// Функция срабатывает  каждый раз при обновлении экрана

void Update () {

}

}

    Сохраняем код и переходим обратно в окно Unity3D далее выделяем наш prefab который мы создали и видим что у скрипта появилось какое то значение. 

    Когда мы объявили массив картинок мы перед типом данных указали специальное слово Public которое заставляет опубликовать значения данной переменной для всеобщего обозрения. И теперь мы не только можем настроить параметры через редактор но и получать доступ к этим значениям из других игровых объектов но об этом позже.

    А сейчас в параметре Size указываем размер массива картинок как мы помним их у нас 8 штук. 

    Unity3D автоматически создаст 8 элементов массива картинок. Далее чтобы окно не менялось при выделении других элементов в верхней его части нажмем кнопку замка и он примет форму закрытого замочка.

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

    Критично только нулевая ячейка так как она будет отображать пустое поле а остальные можно расставлять как угодно. 

    Отлично теперь в наш код добавим номер который будет обозначать какую картинку показывать в данный момент. Для этого возвращаемся обратно в скрипт Change и вписываем следующую строку. И снимаем замочек обратно чтобы разморозить окно.

Добавляем номер картинки

using UnityEngine;

using System.Collections;

public class Change : MonoBehaviour {

//Объявим список картинок

public Sprite[] ImgList;

//номер выбранного элемента массива

public int IndexImg=0;

// Функция срабатывает  1 раз при создании объекта

void Start () {

}

// Функция срабатывает  каждый раз при обновлении экрана

void Update () {

}

}

    Теперь нужно добавить код который будет менять картинку в зависимости от номера. Для этого нужно понять одно в Unity3D у каждого игрового объекта есть набор стандартных значений таких как позиция (Transform) в мире или имя объекта (name) или имя группы объекта (tag) но некоторые элементы такие как наши картинки или коды скриптов нужно получать через специальную команду которая может вернуть весь запрошенный элемент и далее позволит с ним что то сделать.

    Итак наша картинка для Prefab является не стандартным компонентом поэтому будем ее получать следующим образом. Смотрим на название компонента как он называется в свойствах (Sprite Renderer) и пишем его без пробелов  SpriteRenderer. Далее пишем название переменной в которую поместим этот компонент и пишем команду GetComponent(); она позволит нам получить данные.

Объявляем переменную для доступа к картинке

using UnityEngine;

using System.Collections;

public class Change : MonoBehaviour {

//Объявим список картинок

public Sprite[] ImgList;

//Объявляем переменную для доступа к картинке

SpriteRenderer Sprite;

//номер выбранного элемента массива

public int IndexImg=0;

// Функция срабатывает  1 раз при создании объекта

void Start () {

}

// Функция срабатывает  каждый раз при обновлении экрана

void Update () {

}

}

    Далее при создании нашего элемента в игре будем получать доступ к компоненту Sprite Renderer. Раньше это делать не имеет смысла. Для этого модифицируем функцию Start()

void Start()

// Функция срабатывает  1 раз при создании объекта

void Start () {

//получаем доступ к компоненту

Sprite = GetComponent ();

}

   Ура у нас теперь есть переменная через которую мы можем задать картинку взятую из массива. Для этого в функции Update напишем следующий код.

Модифицируем функцию Update

// Функция срабатывает  каждый раз при обновлении экрана

void Update () {

/*при обновлении экрана задаем картинку по номеру из списка*/

Sprite.sprite = ImgList [IndexImg];

}

   Итак чего мы этим добились. Для того чтобы увидеть результат разместим наш Prefab в точке (0 0  0) как раз перед камерой. 

 

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

    Когда у нас параметр IndexImg равен 0 то мы ничего не видим потому что наша картинка полностью прозрачна. Далее мы можем прямо в режиме реально времени выбрать в окне Hierarchy наш Box мы увидим его параметры и значение IndexImg  если поставить его на 1 то наша сцена уже преобразиться вот так:

    Итак благодаря 1 параметру в котором мы можем менять значение от нуля до восьми мы меняем цвет нашего блока. Все это конечно хорошо но в игре цвет блока должен меняться случайным образом и это сейчас мы добавим. Итак теперь заходим снова в наш код Change и в функции Start добавим вызов функции которая будет генерировать случайное число от 1 до 8 таким образом при старте уровня каждый раз элемент будет окрашиваться в случайный цвет.

Создаем случайности

// Функция срабатывает  1 раз при создании объекта

void Start () {

/*получаем случайное число от 0 до 8*/

IndexImg = Random.Range (1, 8);

//получаем доступ к компоненту

Sprite = GetComponent ();

}

   А для проверки рядом с нашим квадратиком набросаем еще несколько штук и посмотрим как работает. Как видим при запуске каждой фигуре назначен случайный цвет. Как раз то что нужно для создания карты.

Следующая часть 

298 0 850 2
2
2015-06-24
Добрый день! Ограничений в блоге по количеству текста не должно быть. Можете добавить материал, а если столкнётесь с проблемой, то сообщите на support@render.ru
2015-12-01
Повторил урок и обнаружил косяк, собрал по моему более 10 блоков и они не удаляются
RENDER.RU