2D игра на Unity. Подробное руководство. Часть 5

Опубликовано: 17 сентября 2014 г.
  • unity
Наш шутер, написанный на Unity, начинает уже приобретать вид полноценной игры. Особенно мне нравится идея с параллаксом, которую мы реализовали в прошлом уроке. Настало время немного повысить его визуальную составляющую с помощью частиц.

Игры с частицами в Unity

Частицы (в основном) - это простые спрайты, которые будут повторяться и отображаются в течение очень короткого промежутка времени. Подумайте о взрывах, лазерах, дыме и т.д. Эти эффекты достигаются через использование частиц – в большинстве случаев (взрыв может быть просто анимированным спрайтом). В Unity встроен мощный редактор частиц Shuriken Engine. Давайте с ним поработаем.

Префаб взрыва

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

  1. Создать систему частиц нашего взрыва (как префаб).
  2. Создать экземпляр и воспроизвести его при необходимости.

Взрыв, как правило, состоит из двух составляющих: огонь и дым.

Создаем частицы дыма в Unity

Создайте новую систему частиц ("Particle System") ("Game Object" -> "Create Other" -> "Particle System").

Советую вам работать на пустой части сцены (или в пустой сцене), чтобы вы четко могли видеть, что происходит. Если вы хотите сфокусироваться на объекте в виде "Сцена" ("Scene"), - дважды щелкните на объекте в «Иерархии», или нажмите клавишу F внутри окна "Сцена".

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

Создание новой системы частиц

Обратите внимание на новое окно (с кнопками "Пауза" и "Стоп") в виде "Сцена" зрения, или в панели Инспектор (Inspector). Да, теперь она заполнена десятками полей, относящихся к системе частиц.

Когда вы выбираете систему частиц в "Hierarchy",она начинает симулировать систему. Если вы снимите галочку, симуляция остановится. Очень полезно понаблюдать, как работает созданная вами система (а она запускается мгновенно).

Мы будем использовать этот спрайт для частиц дыма (сохраните его на жестком диске):

Спрайт облака
Если у вас есть проблемы с прозрачностью при использовании вашего ассета, убедитесь, что прозрачность установлена для черных пикселей с альфой, равной 0. Действительно, даже если пиксель не виден, он по-прежнему имеет значение. Которое используется компьютером.

Скопируйте изображение в папке "Текстуры" (Textures). Измените "Тип текстуры" (Texture Type) на "Texture" и установите галочку рядом с "Альфа-прозрачность" (Alpha Is Transparent). У вас должно быть:

Настройки облака
Мы используем свойство Unity 3D, а не 2D. Вообще-то это не имеет значения. Используя 2D инструменты, вы используете только подклассы Unity. Но полный потенциал Unity все еще остается незатронутым.

Назначьте текстуру частицы:

  1. Перетащите текстуру на систему частиц в режиме "Inspector" (или на объект частиц в "Hierarchy", который привяжет текстуру к соответствующему свойству в "Inspector").
  2. Измените шейдер "Particles" на "Alpha Blended":
Шейдер облака

Чтобы создать идеальные частицы дыма, мы должны изменить многие параметры в системе частиц на вкладке "Инспектор". Рекомендую попробовать:

Категория Параметр Значение
General Duration
(продолжительность)
1
General Max Particles
(макс. число частиц)
15
General Start Lifetime
(время рождения)
1
General Start Color
(начальный цвет)
Gray
(серый)
General Start Speed
(начальная скорость)
3
General Start Size
(начальный размер)
2
Emission Bursts
(всплески)
0 : 15
Shape
(форма)
Shape
(форма)
Sphere
(сфера)
Color Over Lifetime
(цвет в течении всей жизни)
Color
(цвет)
See below (N°1)
Size Over Lifetime
(размер в течении всей жизни)
Size
(размер)
See below (N°2)

N°1 — цвет в течении всей жизни

Настройте эффект выцветания для свойства «Альфа-прозрачность»:

Прозрачность частиц

N°2 — размер в течении всей жизни

Выберите убывающую кривую:

Редактор кривых

Вот, что у вас должно быть:

Настройки

Не стесняйтесь настраивать систему. Поиграйте с редактором, чтобы увидеть, как это работает. Это ваша игра в конце концов. :) Когда вы будете удовлетворены, снимите флажок "Цикл" (Looping).

Обратите внимание на результат:

Эффект дыма

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

Сохраните облако как префаб: создайте папку "Prefabs/Particles" и назовите его "SmokeEffect".

Частицы огня

Здесь все тоже самое:

  1. Создайте новую систему частиц, так же, как вы делали выше.
  2. Используйте материалы по умолчанию для огня ("Renderer/Material" - "Default-Particle"). Этого достаточно для наших нужд.

Мы рекомендуем использовать:

Категория Параметр Значение
General Looping false
General Duration
(Продолжительность)
1
General Max Particles
(Макс. число частиц)
10
General Start Lifetime
(Время появления)
1
General Start Speed
(Начальная скорость)
0.5
General Start Size
(начальный размер)
2
Emission Bursts
(всплески)
0 : 10
Shape Shape Box
Color Over Lifetime
(цвет в течение всей жизни)
Color
(цвет)
See below (N°1)

N°1 — цвет в течение всей жизни

Создаем красивый градиент от желтого до оранжевого, с затуханием в конце:

Градиент огня

Вы должны получить:

Эффект огня

Сохраните как префаб, дав ему имя "FireEffect". Теперь, мы будем использовать эти префабы в скрипте. Инстанцирование префабов частиц идентично инстанцированию игрока или выстрела. Тем не менее, вы должны помнить, что они должны удаляться, когда больше не нужны. Мы также скомбинируем системы огненных и дымовых частиц в скрипте, чтобы создать взрыв. Создайте скрипт "SpecialEffectsHelper":

using UnityEngine;

// Создание экземпляра частиц
public class SpecialEffectsHelper : MonoBehaviour
{
  // Синглтон
  public static SpecialEffectsHelper Instance;

  public ParticleSystem smokeEffect;
  public ParticleSystem fireEffect;

  void Awake()
  {
    // регистрация синглтона
    if (Instance != null)
    {
      Debug.LogError("Несколько экземпляров SpecialEffectsHelper!");
    }

    Instance = this;
  }

  // Создать взрыв в данной точке
  public void Explosion(Vector3 position)
  {
    // Дым над водой
    instantiate(smokeEffect, position);

    // да-даам

    // Огонь в небе
    instantiate(fireEffect, position);
  }

  // Создание экземпляра системы частиц из префаба
  private ParticleSystem instantiate(ParticleSystem prefab, Vector3 position)
  {
    ParticleSystem newParticleSystem = Instantiate(
      prefab,
      position,
      Quaternion.identity
    ) as ParticleSystem;

    // Убедитесь, что это будет уничтожено
    Destroy(
      newParticleSystem.gameObject,
      newParticleSystem.startLifetime
    );

    return newParticleSystem;
  }
}

Поскольку у нас может быть несколько частиц в сцене в одно и то же время, мы вынуждены каждый раз создавать новый префаб. Если бы мы были уверены, что в сцене не может использоваться более одной системы одновременно, мы бы создали ссылку и использовали бы ее каждый раз.

Мы создали синглтон, доступ к которому можно получить в любой момент с помощью SpecialEffectsHelper.Instance.

Синглтон – это паттерн, благодаря которому объект не инстанцируется более одного раза. Мы немного отклонились от классического варианта кода, но суть осталась неизменной.
  1. Привяжите скрипт к объекту "Scripts" в "Hierarchy".
  2. Проинспектируйте его и заполните поля соответствующими префабами.
Filling the script with prefab

Настало время вызвать наш скрипт.

Откройте "HealthScript". Мы будем отслеживать разрушение игрового объекта и в нужный момент покажем наш взрыв. Нам нужно добавить одну строку:

SpecialEffectsHelper.Instance.Explosion(transform.position);

Into the OnTriggerEnter() method of the "HealthScript":

public Damage(int damageCount)
  {
    // ...

    if (hp <= 0)
    {
      // 'Splosion!
      SpecialEffectsHelper.Instance.Explosion(transform.position);

      // Dead!
      Destroy(gameObject);
    }

    // ...
  }

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

Взрывы в действии

Не плохо, не так ли? Хотя, не исключено, что есть способ и получше. Теперь, когда вы знаете, как работают частицы, вы сможете создавать действительно зрелищные взрывы.;)

Что дальше

Мы узнали, как создать частицы, используя встроенный движок Unity. И, как вы увидели как это просто. Кроме того, частицы добавляют лоска и оживляют вашу игру. Однако, будьте осторожны! Всем нам больше нравится заниматься эффектами, чем писать скучный код для игрового счета – главное не слишком увлекаться! Беритесь за частицы в самом конце, иначе быстро потеряете интерес к остальным задачам.

Есть еще один способ сделать игру более привлекательной, помимо частиц – звуки! Именно на этом мы подробно остановимся в следующей главе.

Популярные статьи
2D игра на Unity. Подробное руководство. Часть 1
  • unity
2D игра на Unity. Подробное руководство. Часть 1
Адаптивный слайдер без Javascript на CSS3
  • слайдер
Адаптивный слайдер без Javascript на CSS3
Работа с Unity в 2D
  • unity
Работа с Unity в 2D
2D игра на Unity. Подробное руководство. Часть 3
  • unity
2D игра на Unity. Подробное руководство. Часть 3
2D игра на Unity. Подробное руководство. Часть 4
  • unity
2D игра на Unity. Подробное руководство. Часть 4
2D игра на Unity. Подробное руководство. Часть 5
  • unity
2D игра на Unity. Подробное руководство. Часть 5
2D игра на Unity. Подробное руководство. Часть 6
  • unity
2D игра на Unity. Подробное руководство. Часть 6
Учебник по новому GUI в Unity. Часть 2.
  • unity
Учебник по новому GUI в Unity. Часть 2.
Учебник по новому GUI в Unity. Часть 1.
  • unity
Учебник по новому GUI в Unity. Часть 1.

HTML LESS LESS React
Онлайн журнал для профессиональных веб-дизайнеров и программистов
БлогПлагиныГрафикаИнструменты
CanvasSPAcssjavascriptjqueryphotoshopphpunitywordpress{"fieldValue":[{"image_preview":"","image_demo":"","example":""}],"fieldSettings":{"autoincrement":1}}{"fieldValue":[{"image_preview":"https://cdn-images-1.medium.com/max/800/1*OIBUnA4NokXK14IMR5csTw.jpeg","image_demo":"https://cdn-images-1.medium.com/max/800/1*OIBUnA4NokXK14IMR5csTw.jpeg","example":""}],"fieldSettings":{"autoincrement":1}}Аудио/Видеоаккордеонанимациябазы данныхбраузерные игрыверсткагалереяграфикакартыкнопкименюпараллаксподсказкипопаппрелоадерслайдертаймерформычекбоксыэлементы интерфейса
© 2009-2017 WebSketches.ru