Создаем игру морской бой в Scratch для детей

Этот пост написан пользователем Sports.ru, начать писать может каждый болельщик (сделать это можно здесь).

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

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

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

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

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

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

Начнём с пушки, ее основной задачей будет вращение, чтобы когда мишень двигалась это выглядело более реалистично. Начинаем: когда флажок нажат повернуться в направлении 90 и перейти в координаты 7 и минус 190, смотрим, чтобы пушка была ориентировочно по центру низа экрана. После чего давайте сделаем ее поменьше установив размер 60% . Далее ставим цикл повторять всегда внутрь которого запишем два условия если, то. Если клавиша стрелка вправо нажата, то повернуть на 1 градус по часовой стрелке, если клавиша стрелка влево нажата, то повернуть на 1 градус против. 

Переходим к мишени. Когда флажок нажат перейти в координаты 46 -18, это должно быть место на одной линии выше пушки. Затем устанавливаем размер 30% , мы видим, что мишень находится не в центре поэтому меняем ее координаты на 6 и 4. Затем ставим цикл повторять всегда. И внутрь запихиваем 5 условий если то. Здесь мы будем писать движение прицела. В каждое такое условие вставляем сенсоры. Если клавиша пробел нажата, и 4 если клавиши стрелки влево, вправо, вверх и вниз нажаты. Если клавиша стрелка вправо нажата, меняем х на 3. Если клавиша стрелка влево нажата меняем х на -3. 

Если клавиша стрелка вверх нажата меняем у на 3, если клавиша стрелка вниз нажата меняем у на -3. Если же нажат пробел, передаем сообщение. Это будет являться сигналом того, что мы произвели выстрел. Теперь пишем новую команду когда получим сообщение 1. Давайте переименуем наши корабли на корабль 1 и 2, чтобы не путаться. Так вот когда  получим сообщение 1, если мишень касается корабля 1, то необходимо передать сообщение 2, и второе равноправное условие если мишень касается корабля 2, то передать сообщение 4. Это будет являться индикатором того, что в корабль попали. Токсин на него навели мишень и нажав пробел, произвели выстрел. 

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

Теперь пишем скрипт: когда флажок нажат спрятаться. После чего цикл повторять всегда, создать клон себя и ждать 4 секунды, ставим такую большую задержку, чтобы корабль успевал преодолеть все источники перед тем как за ним начнёт плыть новый.  Далее начинаем писать новую команду , когда начинаем как клон. Устанавливаем размер в промежутке от 50 до 70%. Давайте также переименуем костюмы корабля до взрыва пусть будет номер 1, а после номер 2. Итак, после установки масштабов меняем костюм на 1. После чего необходимо перейти в координаты х=250, а установим с помощью рандомайзера, чтобы корабль выплывал из разного места каждый раз. После чего надо показаться и плыть от 2ух до 6ти секунд в точку на противоположной стороне экрана, то есть влево, в координату -250 у от -30 до 50. 

Если корабль касается края, игра заканчивается. Ставим условие, что при соприкосновении с краем передаются сообщение 3. Теперь напишем команду, которая будет срабатывать когда снаряды попадает в судно. Когда получим сообщение 2, изменяем костюм на второй, который с огнём и дымом. После чего ждём 0,2 секунды и удаляем клон. Эта команда описывает успешное поражение корабля. 

Переходим ко второму кораблю который будет выплывать слева и стремиться попасть на противоположную сторону. Точно также дублируем его костюм и на втором экземпляре рисуем огонь, по аналогии с первым. Переименуем костюмы в 2 и 3, чтобы не запутаться. После того как костюмы готовы, напишем скрипт. Он будет практически таким же, как и на прошлом спрайте. Когда флажок нажат, надо спрятаться, затем цикл повторять всегда. Где мы создаём клон корабля и ставим задержку в 3 секунды, посмотрим, устроит ли нас это.  Вторая команда: когда начинаем как клон изменяем костюм на 2. И переходим в координаты х -250 и у от -30 до 40. Затем надо показаться после плывем от 2ух до 6ти секунд в определенную точку. Далее ставим условие если касается края, то передать сообщение 3.

И новая команда, когда получаем сообщение 4 изменяем костюм на 3, ждём 0,2 секунды и удаляем клон.Первое, что бросается в глаза это то, что клоны появляются слишком быстро, поэтому меняем время с 3к секунд на  4.  Далее  размер корабля, он слишком огромный, значит уменьшим его до 60% . Также заметили, что забыли правильно указать координаты финишной точки, но сейчас мы это исправим, он должен оказаться справа значит х будет 250, а у по традиции пусть варьируется от -39ти до 50ти. Отлично, теперь все работает. 

Скорее всего, самые внимательные заметили, что сообщение под номером 3 никуда не ушло, а значит необходимо добавить что-то еще, это конечно же табличка информирующая нас о конце игры. Давайте создадим новый спрайт, где с помощью текста напишем конец и затем, используя градиент сделаем переход из красного цвета в синий. И теперь пропишем скрипт для нашего финиша. Итак, когда получим сообщение 3 надо показаться, после чего останавливается все. Когда же флажок нажат этой надписи необходимо спрятаться. Давайте также разместим ее в центре экрана в координатах х -1 и у 11. Ну что ж, настало время тестировать готовый проект. 

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