Как сделать кнопку shop
Обновлено: 08.07.2024
Такой вопрос может возникнуть, например, в кликере на C2, когда нужно ограничить игроку возможность покупать все подряд. Часто активные и неактивные кнопки используются для магазинов.
В своей игре " Маятник " я делала ограничение с помощью второго кадра, поэтому покажу именно этот вариант. Он будет выглядеть так:
Для начала, нужно создать саму кнопку. Процесс ее создания я уже описывала в статье о том, как создать простую кнопку , но сейчас понадобятся несколько иные настройки.
Для этого урока нужно две обычные кнопки, и второй кадр для каждой. Можете создать свои или взять нарисованный мною шаблон:
Наполнение уровня
Создаю новый проект в Construct 2. Настройки холста и размера экрана для игры не имеют значения.
Первым делом загружаю в проект две кнопки. Изначально кнопки будут не активного цвета.
Добавление кнопок в проект - путь: нажимаю правой кнопкой мыши на холст и выбираю Insert new object --> выбираю Sprite --> Insert --> нажимаю на холст, чтобы открылся редактор изображений --> загружаю шаблон через иконку папки в верхнем меню редактора изображений --> в левом меню редактора выбираю Rectangle select --> выделяю кнопку и нажимаю дважды на Crop на верхней панели --> закрываю редактор без сохранения
Теперь добавляю второй кадр для каждой кнопки, с более ярким вариантом.
Добавление второго кадра - путь: нажимаю дважды на добавленную кнопку, чтобы открыть редактор изображений --> в отдельном окошке Animation frames нажимаю в пустом месте правой кнопкой мыши и выбираю Add frame --> загружаю в появившийся кадр шаблон и вырезаю более яркую кнопку через Rectangle select --> нажимаю дважды на Crop на верхней панели --> теперь свожу центры кнопок с помощью кнопки Set origin and image points в левой панели редактора изображений. Нужно проследить, чтобы цифры совпадали (см. гиф) --> закрываю редактор без сохранения
Чтобы кнопки сразу не перескакивали на более яркий кадр, следует поставить скорость анимации на 0.
Изменение скорости анимации - путь: нажимаю на загруженную кнопку дважды, чтобы открыть редактор изображений --> в отдельном окошке Animation нажимаю на Default и в левой основной панели нахожу Speed --> ставлю значение 0 --> закрываю редактор изображений без сохранения
После этого я добавлю текст на каждую кнопку для обозначения цены.
Добавление текста для цены - путь: нажимаю правой клавишей мыши на холст и выбираю Insert new object --> выбираю Text --> Insert --> нажимаю на холст, чтобы проявить текст --> по желанию, настраиваю параметры текста в левой основной вкладке
Добавляю мышку в проект, чтобы накликать позже цену.
Добавление мыши в проект - путь: нажимаю правой клавишей мыши на холст и выбираю Insert new object --> выбираю Mouse --> Insert
Устанавливаю цену прямо в тексте. Лучше всего это делать в Event sheet, где прописывается механика, но если цены не меняются по ходу игры, то можно сделать и так.
Установка цены - путь: нажимаю на текст --> в левой основной вкладке напротив Text вписываю цену (здесь для первой кнопки 5, для второй 10)
И, в добавок, я привношу в проект еще один текст, который будет выводить количество кликов на экране.
Текст для вывода количества кликов - путь: нажимаю правой клавишей мыши на холст и выбираю Insert new object --> выбираю Text --> Insert --> нажимаю на холст, чтобы проявить текст --> по желанию, настраиваю параметры текста в левой основной вкладке
Механика
Теперь очередь работать со вкладкой Event sheet и одной глобальной переменной.
Глобальные переменные удобны тем, что их можно сбрасывать по ходу игры, сохранять, изменять. Глобальная переменная, которую я создам сейчас, будет записывать количество кликов, которые я сделала на экране.
Создание глобальной переменной - путь: перехожу в Event sheet в верхних вкладках --> нажимаю правую клавишу мыши и выбираю Add global variable --> в Name пишу money (название переменной) --> OK
Первым событием в механике я сделаю вывод количества кликов на экран при игре.
(событие) Вывод количества кликов в тексте - путь: нажимаю правую клавишу мыши и выбираю Add event --> System --> Next --> Every tick --> Done
(действие) Вывод количества кликов в тексте - путь: напротив события нажимаю Add action --> нажимаю на тот текст, который был создан для вывода текста, а не цены --> Next --> Set text --> Next --> в Text я прописываю "Деньги: " & money --> Done
"Деньги: " обозначает текст, который будет показан при запуске проекта. Обязательно ставлю пробел после двоеточия, иначе при игре отображаемое количество кликов будет написано вплотную.
После этого я делаю набор кликов с помощью мыши.
(событие) Набор кликов с помощью мыши - путь: нажимаю правую клавишу мыши и выбираю Add event --> Mouse --> Next --> On click --> Next --> Done
(действие) Набор кликов с помощью мыши - путь: напротив события нажимаю Add action --> System --> Next --> Add to (в подразделе Global & local variables) --> Next --> в Variable должно стоять название глобальной переменной money, а в Value значение 1 --> Done
Теперь настало время использовать второй кадр для каждой кнопки.
(событие) Механика для активации кнопки - путь: нажимаю правую клавишу мыши и выбираю Add event --> System --> Next --> Compare variable --> Next --> в Variable должна стоять глобальная переменная money; в Comparison выставляю ⩾ Greater or equal, что означает больше или равно; в Value прописываю цену (для первой кнопки 5, для второй 10) --> Done
(действие) Механика для активации кнопки - путь: напротив события нажимаю Add action --> кнопка --> Next --> Set frame --> Next --> в Frame number прописываю значение 1--> Done
После этого копирую получившееся событие и действие, а затем нажимаю на событие правой кнопкой мыши и выбираю Invert.
Напротив инвертированного события, в действии, меняю Frame number обратно на 0.
Для второй кнопки действия те же самые, но вместо 5 нужно указать 10, то есть, цену, указанную в тексте на уровне.
В итоге, весь механизм должен выглядеть так:
Чтобы произошла покупка, то есть, вычитание из глобальной переменной, нужно прописать это отдельно.
(событие 1) Вычитание при покупке - путь: нажимаю правую клавишу мыши и выбираю Add event --> Mouse --> Next --> On object clicked --> Next --> В Object clicked я выбираю текст, который обозначает цену за кнопку --> Done
(событие 2) Вычитание при покупке - путь: нажимаю правую клавишу мыши и выбираю Add event --> выбираю кнопку --> Next --> Compare frame --> Next --> в Number вставляю цифру 1 (что обозначает активную фазу кнопки) --> Done --> перетаскиваю второе событие к первому так, чтобы они состыковались. После этого удаляю оставшуюся внизу ячейку из-под события.
(действие) Вычитание при покупке - путь: напротив события нажимаю Add action --> System --> Next --> Subtract from --> Next --> в открывшемся окошке в Value вписываю цену (для первой кнопки 5, для второй 10) --> Done
Читайте также: