Блог онлайн школы Пиксель

Как сделать магазин на Скретч (Scratch)

Привет! Школа программирования для детей “Пиксель” продолжает курс уроков по Scratch. С этой серией занятий и инструкций вы узнаете о том, как сделать игру в Scratch с самыми разными дополнениями. Мы учимся добавлять подвижный фон, AR, мультиплеер и другие детали, которые сделают игры динамичнее и веселее!

Сегодня мы с вами научимся создавать на платформе программирования Scratch магазин с различными товарами. Поехали!

Подробную видеоинструкцию ищите в конце материала.

Подготовка спрайтов для магазина на Скретч


Первым делом мы создадим все необходимые нам спрайты и расположим их в нужных местах. Начнем с таблички “Магазин”. Для начала выберем фон для нашей таблички, растянем его в виде прямоугольника. Затем, выбрав функцию текст, добавим заголовок.


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


Переходим непосредственно к созданию товаров. Здесь есть несколько вариантов: можно отрисовывать товары вручную, а можно воспользоваться коллекцией стоковых изображений Скретча. Чтобы упростить задачу, мы воспользуемся встроенной библиотекой спрайтов. Выберем яблоко, например. Теперь необходимо переместить его в желаемое место на нашем прилавке и указать его стоимость. Допустим, наше яблоко стоит 15 рублей.


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


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

Программирование на Scratch таблички магазина


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

1) Когда флажок нажат, показаться.

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

3) И последний скрипт: когда получу сообщение “Закрыть”, показаться, чтобы при выходе из магазины мы снова могли в него попасть.


Программирование кнопки выхода из магазина


Переходим к спрайту с кнопкой выхода. Создаем следующие программы:

1) Когда флажок нажат, спрятаться.

2) Когда получу сообщение “Появись”, показаться, так как пользоваться кнопкой выхода мы будем, только попав в сам магазин.

3) Когда спрайт нажат, передать сообщение “Закрыть” и спрятаться.


Скрипты для товаров в магазине


Чтобы перейти к написанию скриптов для товаров, необходимо сначала ввести переменную, отвечающую за количество доступных нам денег. Для этого создадим переменную и назовем ее “Монеты”.


Теперь начинаем писать скрипт для яблока.

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

Здесь же зададим количество доступных монет. Проверим: если наше яблоко пропадает с нажатием флажка, значит все сделано правильно.

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

3) А когда мы получим сообщение “Закрыть”, яблоку надо будет спрятаться.

Приступим к программированию самой покупки.

4) Когда спрайт нажат, если количество монет равно или больше 15, программа позволит нам совершить покупку. Тогда мы передаем сообщение “Купить”, следовательно, наши монеты изменяются на минус 15. В ином случае передаем сообщение “Недостаточно денег”.


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

Скрипт для бананов:


Скрипт для бомбы:


Теперь проверим, что все работает исправно. Все отлично, при клике на товары монеты уменьшаются.

Скрипт для оповещения о покупке товара


Осталось лишь сделать систему оповещения, которая позволит понимать, купили мы товар или нет.

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


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


Осталось лишь запрограммировать их.

Начнем с удачной покупки.

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


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


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


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

Если вас заинтересовало Скретч программирование и вы хотели бы придумать и воплотить в жизнь свой личный проект, добро пожаловать в онлайн-школу программирования “Пиксель”. Мы познакомим вас со средой программирования Scratch и научим создавать крутые игры, анимацию, интерактивные проекты и др. Присоединяйтесь к курсу “Создание игр на Scratch 3.0”!

2022-05-08 09:00 Бесплатные видеоуроки Scratch для детей