Hyper Casual игра на Unity с нуля. #2 Первый уровень

Первая часть: Hyper Casual игра на Unity с нуля. #1 Начало

Репозиторий: github.com/sergeychemodanov/roller-splat

Уровень будет состоять из ячеек - пустых (пол, который нужно закрасить) и стен. Первым делом создадим enum с этими типами.

_/Scripts/Dynamic/CellType.cs:

namespace AwesomeCompany.RollerSplat.Dynamic { public enum CellType { Floor, Wall } }

Затем создадим класс Level, в котором будет информация об ячейках и стартовой позиции шара.

_/Scripts/Dynamic/Level.cs:

using UnityEngine; namespace AwesomeCompany.RollerSplat.Dynamic { public class Level { public CellType[,] cells { get; } public Vector2Int spawnPoint { get; } public Level(CellType[,] cells, Vector2Int spawnPoint) { this.cells = cells; this.spawnPoint = spawnPoint; } } }

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

_/Scripts/Dynamic/DataProviders/IDynamicDataProvider.cs:

using System.Collections.Generic; namespace AwesomeCompany.RollerSplat.Dynamic { public interface IDynamicDataProvider { List<Level> levels { get; } } }

Создадим тестового провайдера. Добавим в него один уровень 5x5 со стартовой позицией шара снизу слева.

_/Scripts/Dynamic/DataProviders/DebugDynamicDataProvider.cs:

using System.Collections.Generic; using UnityEngine; namespace AwesomeCompany.RollerSplat.Dynamic { public class DebugDynamicDataProvider : IDynamicDataProvider { public List<Level> levels { get; } public DebugDynamicDataProvider() { var cells = new[,] { {CellType.Wall, CellType.Wall, CellType.Wall, CellType.Wall, CellType.Wall}, {CellType.Wall, CellType.Floor, CellType.Floor, CellType.Floor, CellType.Wall}, {CellType.Wall, CellType.Floor, CellType.Wall, CellType.Floor, CellType.Wall}, {CellType.Wall, CellType.Floor, CellType.Floor, CellType.Floor, CellType.Wall}, {CellType.Wall, CellType.Wall, CellType.Wall, CellType.Wall, CellType.Wall}, }; var spawnPoint = new Vector2Int(1, 1); var level = new Level(cells, spawnPoint); levels = new List<Level> {level}; } } }

Также необходимо создать класс для ячеек, которые будут находиться на сцене. Добавим в него метод Initialize, который принимает индекс ячейки и устанавливает позицию объекта в соответствии с индексом.

_/Scripts/Gameplay/Cell.cs:

using UnityEngine; namespace AwesomeCompany.RollerSplat.Gameplay { public class Cell : MonoBehaviour { public Vector2Int index { get; protected set; } public virtual void Initialize(Vector2Int index) { this.index = index; transform.position = new Vector3(index.x, 0f, index.y); } } }

Теперь создадим префабы пола, стены и шара и поместим их в папку _/Resources/Gameplay.

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

Создаем класс LevelFactory, который будет отвечать за создание объектов. В нем два метода: создать шар и создать ячейку.

_/Scripts/Gameplay/LevelFactory.cs:

using System; using AwesomeCompany.RollerSplat.Dynamic; using UnityEngine; using Object = UnityEngine.Object; namespace AwesomeCompany.RollerSplat.Gameplay { public static class LevelFactory { private static readonly Transform _container; private static readonly GameObject _ballPrefab; private static readonly Cell _floorPrefab; private static readonly Cell _wallPrefab; static LevelFactory() { _container = new GameObject("LevelContainer").transform; _ballPrefab = Resources.Load<GameObject>("Gameplay/Ball"); _floorPrefab = Resources.Load<Cell>("Gameplay/Floor"); _wallPrefab = Resources.Load<Cell>("Gameplay/Wall"); } public static GameObject CreateBall(Vector2Int spawnPoint) { var ball = Object.Instantiate(_ballPrefab, _container); ball.transform.position = new Vector3(spawnPoint.x, 0f, spawnPoint.y); return ball; } public static Cell CreateCell(CellType cellType, Vector2Int index) { Cell cell; switch (cellType) { case CellType.Floor: cell = Object.Instantiate(_floorPrefab, _container); break; case CellType.Wall: cell = Object.Instantiate(_wallPrefab, _container); break; default: throw new ArgumentOutOfRangeException(nameof(cellType), cellType, null); } cell.Initialize(index); return cell; } } }

Далее создаем класс GameController, который будет управлять игрой. Пока что в нем один метод Play, в который передается необходимый уровень. Контроллер берет данные уровня и создает необходимое количество ячеек и шар с помощью LevelFactory.

_/Scripts/Gameplay/GameController.cs:

using AwesomeCompany.RollerSplat.Dynamic; using UnityEngine; namespace AwesomeCompany.RollerSplat.Gameplay { public class GameController : MonoBehaviour { public void Play(Level level) { var xLength = level.cells.GetLength(0); var zLength = level.cells.GetLength(1); for (var x = 0; x < xLength; x++) { for (var z = 0; z < zLength; z++) { var cellType = level.cells[x, z]; var index = new Vector2Int(x, z); LevelFactory.CreateCell(cellType, index); } } LevelFactory.CreateBall(level.spawnPoint); } } }

Добавляем ссылки на GameController и DynamicDataProvider в класс App. Теперь он имеет вид:

using AwesomeCompany.Common; using AwesomeCompany.Common.UI; using AwesomeCompany.RollerSplat.Dynamic; using AwesomeCompany.RollerSplat.Gameplay; using AwesomeCompany.RollerSplat.UI.Windows; using UnityEngine; namespace AwesomeCompany.RollerSplat { public class App : Singleton<App> { public IDynamicDataProvider dynamicDataProvider { get; private set; } public WindowManager windowManager { get; private set; } public GameController gameController { get; private set; } protected override void Awake() { base.Awake(); dynamicDataProvider = new DebugDynamicDataProvider(); windowManager = new GameObject("WindowManager").AddComponent<WindowManager>(); windowManager.transform.SetParent(transform); gameController = new GameObject("GameController").AddComponent<GameController>(); gameController.transform.SetParent(transform); } private void Start() { windowManager.Show<MainMenuWindow>(); } } }

Добавляем кнопку в класс MainMenuWindow, подписываемся на ее событие "Click". При нажатии берем первый уровень из списка уровней, передаем его GameController и закрываем окно.

using System.Linq; using AwesomeCompany.Common.UI; using UnityEngine; using UnityEngine.UI; namespace AwesomeCompany.RollerSplat.UI.Windows { public class MainMenuWindow : WindowBase { [SerializeField] private Button _playButton; protected override void Awake() { base.Awake(); _playButton.onClick.AddListener(OnPlayButtonClicked); } private void OnPlayButtonClicked() { var level = App.instance.dynamicDataProvider.levels.First(); App.instance.gameController.Play(level); Close(); } } }

Аттрибут [SerializeField] позволяет редактировать приватные переменные из редактора.

Далее нужно эту кнопку добавить в префаб окна. Я скачал SVG иконку кнопки play (256х256) с flaticon.com, закинул ее в figma.com, изменил цвет заливки на белый и сделал экспорт в PNG.

PNG картинку кладем в папку _/Sprites и меняем у нее в окне Inspector тип на Sprite (2D and UI), чтобы ее можно было добавить в интерфейс.

Открываем префаб MainMenuWindow, создаем кнопку, удаляем из нее дочерний объект Text, перетаскиваем иконку в компонент Image. Ставим галочку Preserve Aspect (для сохранения пропорций изображения) и кликаем Set Native Size чтобы установить размер кнопки равный размеру изображения. Перетаскиваем кнопку в поле PlayButton у объекта MainMenuWindow.

Перемещаем временно вручную камеру в нужное положение, примерно так:

Нажимаем Play и видим созданный уровень и шар. На сегодня это все. Еще раз ссылка на репозиторий, он будет обновляться вместе с выходом статей.

#unity #tutorial