Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Game Development
  2. From Scratch
Gamedevelopment

Создаём игру Match-3 с помощью Construct 2: подробнее о перемещениях, игровых баллах и Matching

by
Difficulty:BeginnerLength:LongLanguages:
This post is part of a series called Make a Match-3 Game in Construct 2.
Make a Match-3 Game in Construct 2: Points, Matching, and Gravity
Make a Match-3 Game in Construct 2: Block Movement

Russian (Pусский) translation by Alex Grigorovich (you can also view the original English article)

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


Итоговая демо версия игры

Перед вами демо версия игры, над которой мы будем работать в этом уроке. 




1. Улучшение механики перемещений

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

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

Влево, вправо 

Что это точно значит? Ну, во-первых, если вы захотите, вы можете переместить блок за пределы игрового поля влево или вправо, сделав своп, как показано ниже:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

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

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

Чтобы решить эту проблему, мы добавим новые условия в событие Block > On DragDrop drop. Перейдите к этому событию и добавьте данное условие в  редактор событий, которое проверяет перемещения, находящиеся с левой стороны:

Теперь добавьте это условие в редактор событий, которое проверяет правильные перемещения:

Ваши левые и правые события обмена должны теперь выглядеть так:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

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

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

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

За границами

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

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

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

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

Это будет так же просто, как и предыдущие два шага.  Перейдите в редактор событий, которое проверяет предыдущие перемещения блоков и добавляет следующее условие:

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

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Как и предыдущее условие, это гарантирует, что перемещение не будет размещать блок в области вне игрового поля. В этом случае он просматривает область под игровым полем.

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

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


2. Текст с плавающей запятой

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

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

Создание самого текста

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

  1. Перейдите к слою 1.
  2. Вставьте новый объект Text:
    1. Имя:FloatingPointsText
    2. Слой: Game Field
    3. Расположение: 616, 250
    4. Размер: 127, 43
    5. Техт: 0
    6. Шрифт: Calibri, Bold, 24
    7. Цвет: 255, 255, 255
  3. На вкладке «Проекты» справа щелкните правой кнопкой мыши по объекту FloatingPointsText и выберите Behaviors.
  4. Добавьте новое поведение Fade и закройте окно Behaviors.
  5. В свойствах, расположенных в левой части экрана, измените значение Fade Out Time на 1.25.

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

Создание текста, отображающее количество баллов

Чтобы создать текст, отображающий количество баллов, мы добавим два новых действия в NumMatchesFound для функции FindMatches.

Перейдите к функции FindMatches и добавьте эти два действия в конец каждого условия NumMatchesFound> 3:

Функция FindMatches теперь должна выглядеть так:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Итак, что делают эти действия?  Первое действие создает объект FloatingPointsText поверх первого блока в группе, а второй умножает количество блоков в группе на 10, как и формула наших баллов, и устанавливает текст нового объекта на это число.

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

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

Перемещение текста

Вернитесь к списку событий 1 и добавьте новое событие:

Ваше новое событие должно выглядеть так:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Если вы сейчас запустите игру, вы увидите, что текст изменяется.

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


3. Завершение работы по складыванию трех фигур в ряд.

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

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

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

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

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

Первая линия  будет найдена, когда она начнется с блока А и будет содержать пять блоков:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Вторая линия будет найдена, когда она начнется с блока B и будет содержать четыре блока:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

И третья линия будет найдена, когда она начнется с блока C, и будет содержать три блока:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

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

Как мы это исправим

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

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

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

Первое, что мы добавим, это новый параметр для функции CheckMatches.  Этот параметр будет целым числом, и он будет равен 1или 0.

Если параметр равен 1, он будет указывать на функцию,которая должна выполнить проверку, чтобы убедиться, что она смотрит на начальный блок в группе; если он равен 0, он указывает функции, что он уже выполнил эту проверку, и может нормально работать, чтобы определить, состоит ли группа из трех или более блоков.

Давай сделаем это

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

Теперь функция FindMatches должна выглядеть так, так на картинке ниже. Я обозначил два измененных свойства для вашего понимания.

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

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

Прежде чем завершить модификацию функции CheckMatches, вам также необходимо добавить оператор Else в начало события для функции CheckMatches, и вам нужно добавить новый параметр при вызове функции CheckMatches и установить его значение на 0.

Новый код функции CheckMatches должен выглядеть так:

Make a Match-3 Puzzle Game in Construct 2: More Swapping, More Points, and More Matching

Событие, которое мы добавили, делает именно то, что я описал выше.  Во-первых, оно смотрит на блок выше или слева от блока, начинающего линию.

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

С другой стороны, если цвет не совпадает, происходит выполнение условия оператора Else, и функция ищет линию из трех или более блоков.

Если вы тестируете игру в этот момент и создаете группу с более чем тремя блоками, вы должны увидеть только один объект с текстом о количестве баллов.


Вывод

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

Если вы хотите начать работать над этим уже сейчас, определитесь с некоторыми вещами. Очевидно, первое, что вам нужно сделать, это реализовать непосредственно перемещение. Для этого можно использовать похожую систему, которую мы создавали для отображения количества баллов. Подумайте, как вы измените скорость движения. Наконец, как вы будете генерировать новые линии для игрока, и как вы узнаете, когда именно их нужно создавать.

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

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.