Как сделать свой кликер для андроид

Создание простой кликер-игры с нуля

В последние несколько лет набирают большую популярность игры такого жанра, как «кликеры». Мне самому очень интересно играть в них, но не менее интересно создавать игру — кликер самому. Благодаря такому движку как Unity, создать свой шедевр не составит труда даже простому новичку. Давайте перейдем к делу.

Что нужно сделать?

1. Подумать, почему и на что мы должны кликать?
2. Что должно произойти, когда мы кликнем?
3. Что должно произойти, если не кликнем?

Как ответил я на эти вопросы:

1. Мы должны кликать в любое место на экране.
2. При клике должен смениться объект.
3. При игнорировании — проигрыш.

О чем будет игра?

Игроку нужно вовремя выбрать либо меч, либо щит, в зависимости от того, что будет падать сверху. То есть, падает меч — выбираем меч, падает щит — выбираем щит. При неправильном выборе игрок просто проиграет. На словах всё довольно просто, а в реализации еще проще.

Откуда мне новичку брать красивый спрайт и фон? Ответ: нарисовать самому.

Тут нет ничего сложного, так как мы рисуем в Adobe Illustrator. Даже если у вас нет опыта в рисовании, то опять же не расстраиваемся, так как я покажу вам всё по деталям.

1. Меч
2. Щит
3. Задний фон
4. Ветка с листьями

Этого хватит.

Техника проста и покажу на примере меча:

1. Рисуем контур
2. Заливаем цветами
3. Рисуем тени

И всё, наш меч готов!

Также проделываем и с другими. Не пугайтесь, если в начале одно ваше творение покажется вам далек от идеала, ведь в совокупности они будут смотреться, как картина Ван Гога. Шутка. А может и нет.

Задний фон сделаем еще хитрее.

Нарисуем зеленый прямоугольник и используем градиент. Выглядит вот так:

Можно сказать, что уроки художества на этом закончены и мы наконец идем в Unity.

В первую очередь закинем наши спрайты, а меч и щит перетащим в окно иерархии, так как нам нужно будет создать из них префабы и не только.

1. Добавляем Rigidbody 2D и установим значение “0” в поле Gravity Scale, чтобы щит стоял на одном месте.
2. Добавим Circle Collider 2D и установим галочку в Is Trigger, чтобы отслеживать действия.

С префабом те же действия, только нужно установить значение “1” в поле Gravity Scale, чтобы щит падал вниз. И перетаскиваем его в папку Prefabs. С мечом те же действия. Готово!

Далее украсим игру спрайтами, нарисованными ранее. Первым делом кидаем фон.

1. Размещаем ветки сверху
2. Добавим снизу бревно
3. Посередине разместим мост

Основной секрет дизайна такой: сверху и снизу разместим ветки, а у лесенки уменьшим значение прозрачности. Зачем это делать?

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

Теперь создадим кнопку, которая будет занимать весь экран. Чтобы создать кнопку нужно в иерархии нажать на UI -> Button. Далее:

1. Нажимаем на Color.
2. Устанавливаем значение «0» в поле А, которая отвечает за прозрачность нашей кнопки.
3. Убеждаемся, что кнопка стала такой, какой мы хотели.

Таким же путем создаем текст, чтобы показывать наш текущий счет и рекорд.

И наконец, мы дошли и до программирования.

Что творится в этих методах?

Start (). Он запускается каждый раз, когда мы запускаем игру или же перезапускаем сцену. Всё что прописано внутри этого метода выполняется только один раз. Поэтому мы туда записываем: счет равный нулю, запуск корутины (то, что отвечает за создание префабов), значение времени.

Update (). Выполняется раз за кадр. Сюда удобно записать то, что постоянно должно обновляться. В нашем случае: показатель счета и рекорда, рандомное значение n от которого зависит что создастся – меч или щит.

BtnClick (). Вы спросите, почему перед этим методом стоит «public»? Нам необходимо, чтобы он отражался в самом Unity и мы могли прописать слово «Click», чтобы отследить, на какую именно кнопку мы нажимаем, хотя и кнопка всего одна, знать чуточку больше никому не помешает.

Сюда запишем то, что должно произойти после нажатия на кнопку. При нажатии должно меняться с меча на щит и наоборот, устанавливать значение времени «1», так как при проигрыше она обнуляется.

OnTriggerEnter2D (). Проверяет столкновение объекта. Если теги обеих объектов совпадает, то счет увеличивается на единицу, а префаб уничтожается. Если теги разные, то проигрыш – останавливается время и обнуляется счет.

Осталось добавить эти самые теги. И тут всё очень просто:

1. В окне Inspector нажимаем на Tag.
2. В выпавшем списке в самом низу нажимаем на Add Tag.
3. Жмем на плюсик и называем тег как хотим.

После создания также нажимаем на Tag и выбираем нужный.

Осталось перенести скрипты нужным объектам и заполнить некоторые поля. Создадим пустой объект и добавим скрипт «Main Script», а «Player Script» добавим в наш меч и щит.

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

Источник

Pocket Code | Программирование на телефоне #3 | Создание кликера с улучшениями

Сегодня мы разберём, как создать кликер с улучшениями.

В начале создаём проект. Добавляем объект в качестве кнопки и добавляем к нему ещё 2 образа, в скриптах у него пишем

Там создаём переменную «клик» (можно назвать переменную и по другому) и присваиваем ей значение 0

• Как только становится истинным (Событие)

В них пишем «устройство» >> «касается пальца» = 1

• Как только становится истинным (Событие)

В них пишем «касается пальца» = 0

• Изменить размер на 100

На данном этапе мы сделали кнопку которая при нажатии уменьшается

Пока оставим кнопку и сделаем улучшение

Создаём объект, добавляем 2 образа и пишем код

Создаём переменную «уровень кнопки» и присваиваем ей 1

• При нажатии
• Если истина, то (управление)

«Уровень кнопки»(переменная) = 1

Скрипт «если истина, то» совершает действие внутри себя, если соблюдаются условия

Данный значок _> обозначает больше или равно, и находится он во вкладке

«Клик»(переменная) на -10

• Следующий образ
• Вещать всем (события)

Создаем команду «улучшение»

«Вещать всем» — данный скрипт позволяет передавать команды скрипту «когда я получу»

«Уровень кнопки»(переменная) 2

«Остановить» — данный скрипт позволяет остановить данную часть кода

Источник

Гайд: Как создать кликер на Unity

Я являюсь преподавателем в школе программирования ЯЮниор и не так давно мы опубликовали пост с разбором жанра кликеров и пообещали, что если пост наберет 100 плюсов, то жаба разрешит мне выпустить статью по разработке кликера! Мы видим, что тема вам интересна, и не можем просто так оставить это без внимания.

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

Спрайты для урока:

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

Торты у нас будут заранее созданы и храниться в префабах. Чтобы сделать первый торт — создайте на сцене пустой объект и назовите его Cake. После этого создайте папку Prefabs в окне Asset, а в ней Cakes. Перетащите с окна Hierarchy созданный пустой объект торта в папку Cakes.

2 раза кликаем по получившемуся префабу, и переходим в режим редактирования префаба. Сразу проверьте, чтобы координаты родительского объекта были нулевыми.

Размещаем слой торта, и устанавливаем размер по Y 1.5

После этого дочерним к слою располагаем крем и выставляем ему Scale 1 по всем осям. После установки, раскрашиваем слой и крем.

Первый уровень торта готов, но хотелось бы сделать его минимум из 3 уровней. Выделяем слой, и нажимаем ctrl+d, мы получили дубликат слоя, сдвигаем его повыше, и видим следующую картину:

Тут проблема в слоях. Вам нужно вручную проставить Order in layer для каждого спрайта в торте. Получается, что у нашего 1 уровня будет слой 0, а у крема 1. Далее всё зависит от того, сколько вам нужно будет уровней для торта, но каждый последующий слой будет больше.

В итоге у нас получится вот такой торт. Хотел бы обратить внимание на пару вещей.

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

Также для упрощения понимания, приведу структуру полученного торта и какие слои у каждого элемента.

Как вы видите, у нас есть 3 коржа. У каждого коржа есть крем, а у последнего ещё и конфети. Распределение слоев идет следующим образом:

• корж 1 — слой 0;
• крем 1 — слой 1;
• корж 2 — слой 2;
• крем 2 — слой 3;
• корж 3 — слой 4;
• крем 3 — слой 5;
• все конфети — слой 6.

Теперь наш торт окончательно готов, и т.к. пустой GameObject торта находился на сцене, то сейчас там появится целый торт.

Фон мы с вами расположим на Canvas, для этого нажимаем правой кнопкой мыши по окну иерархии и создаем Canvas.

Canvas нужен для отрисовки графического интерфейса, но также на нем можно расположить и фон. Перед работой нам нужно его настроить.
Первым делом переключаем Render Mode в Camera и указываем камеру, к которой будет привязан канвас, т.к. у нас она одна, то её и указываем.
После этого нам нужно указать настройки для адаптивности нашего интерфейса, для этого в Scale Mode выбираем Scale With Screen Size. Этот режим означает, что мы разработаем весь интерфейс для определенного эталонного разрешения, а дальше unity будет его растягивать отталкиваясь от этого. Указываем Reference Resolution 1080 на 1920 и Match 0.5, mathc — это то, как будет тянуться интерфейс, по ширине или по высота, в случае с 0.5, это по ширине и высоте одновременно.

Канвас настроен, теперь нажимаем пкм по канвасу в окне иерархии, и создаем объект Panel, он будет являться нашим фоном, указываем в Source Image картинку нашего заднего фона. Теперь фон указан, но он какой-то темный, чтобы убрать это затемнение, вам следует нажать лкм на color и параметр A(alpha) установить в 255. Теперь ваш фон смотрится адекватно.

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

Наши торты не будут изначально стоять на платформе, да и много разных их будет, по этому нам нужно с вами настроить место для спавна тортов.
Создаем пустой объект, и называем его CakePlace. Размещаем его на платформе так, чтобы он обозначал нижнюю точку торта.

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

Теперь, наконец-то, перейдем к скриптам)

Создаем папку для скриптов, и в неё уже создаем скрипт CakePlace.

Пока наш скрипт будет выглядеть так, мы будем постепенно его дописывать. Давайте разберем, что он делает сейчас. У нас есть поле торт, в котором будет храниться тот торт, который мы хотим заспаунить. В старте мы вызываем метод SetCake, который просто создает торт дочерним к нам. Также уже готов метод RemoveCake, который будет удалять торт.

Этот компонент мы добавляем к объекту CakePlace. Удаляем со сцены сам торт и в поле Cake указываем префаб нашего торта.

Теперь при запуске игры вы увидите, что торт создался внутри CakePlace. На этом этапе торт уже должен стоять ровно, если это не так, то снова перейдите в редактирование префаба и приподнимите или опустите слои.

В папке скрипты создаем папку Cake, а в ней 2 скрипта: Cake и CakeLayer.

У нас есть следующие поля:

• _clicksBeforeCooking — сколько кликов нужно, чтобы слой был готов;
• _spriteRenderer — хранит компонент отрисовки этого слоя;
• _layerColor — цвет нашего слоя поле выпекания;
• CookingProgress — свойство, которое обозначает прогресс, сколько кликов уже сделано.

Зачем нам хранить цвет слоя? Дело в том, что нам надо как-то помечать то, что слой не выпечен, и пользователь видел, что он сейчас выпекает. Для этого мы каждый слой в старте превращаем в призрачный — белый слой с небольшой прозрачностью.

Как торт выпекается?

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

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

Источник