Как-то раз гулял Котик по лесу и забрёл на делянку где велась заготовка леса. Прораб был очень недоволен и кидался брёвнами! Пришлось Коту вспомнить о своём реактивном ранце, если бы не он, Коту несдобровать. В этой главе мы сделаем небольшую игру про Котика, который будет летать на реактивном ранце, уворачиваясь от летящих брёвен. Мы познакомимся с блоком «выдать случайное число», а также попрактикуемся в применении переменных. Как обычно, будем осваивать новые приёмы рисования. Игра будет выглядеть вот так.
Создание проекта начнём с фона. Нажмите на кнопку «Нарисовать новый фон».
Выберите инструмент «Прямоугольник».
Выберите зелёный цвет.
Выберите закрашенный прямоугольник.
Нарисуйте большой прямоугольник внизу сцены.
Возьмите его за уголки и растяните до самых краёв сцены.
Теперь выберите голубой цвет и нарисуйте большой прямоугольник на всю оставшуюся сцену.
Растяните прямоугольник так, чтобы не осталось пустого белого места.
Фон готов. Нарисуем Коту реактивный ранец. Выберите Кота и откройте редактор нажав на вкладку «Костюмы».
Увеличьте масштаб.
Выберите инструмент «Прямоугольник».
Рисуйте чёрным цветом.
Выберите инструмент «Изменение формы».
Кликните на нижний край прямоугольника и измените его форму.
Теперь надо закрасить реактивный ранец. Выберите инструмент «Заполнить цветом».
Выберите два цвета.
Выберите тип заливки.
Закрасьте ранец.
Теперь нарисуем огонь. Выберите инструмент «Карандаш».
Выберите красный и оранжевый.
Нарисуйте огонь в виде замкнутого контура. Это нужно для того, чтобы потом его можно было окрасить.
Выберите инструмент «Заполнить цветом».
Выберите способ заливки.
Окрасьте огонь и его контур.
Теперь надо немного наклонить рюкзак. Кликните в него инструментом выбора.
Потяните рюкзак за верхний кружочек и наклоните его.
Теперь выберите огонь, наклоните его и переместите на своё место.
Осталось переместить Кота на уровень вверх, чтобы реактивный ранец остался у него за спиной. Инструментом выбора кликните на Кота и на кнопку «Вперёд на слой».
Котик готов к полётам!
Теперь надо нарисовать ему грустный костюм, таким он станет при попадании в него бревна. Перейдите на вкладку «Костюмы».
Сначала удалим второй костюм Котика.
Теперь дублируйте первый костюм.
Увеличьте масштаб. Дважды кликните на плюс.
Выберите инструмент «Изменение формы».
Кликните на рот и передвиньте вних левую и правую точки привязки. Рот стал грустным.
Теперь кликните на глаз и передвиньте верхнюю точку пониже.
Теперь измените второй глаз.
Котёночек выглядит печальным. Осталось только переименовать костюмы. Первый костюм назовите «Весёлый Кот».
А второй костюм назовите «Грустный Кот».
Спрайт Кот в полёту готов! Переименуйте спрайт в «Кот». Кликните на синий кружочек.
В окне свойств спрайта напишите новое имя «Кот».
Теперь надо нарисовать бревно, которое будет лететь в Кота. Нажмите на кнопку «Нарисовать новый спрайт».
Перейдите в векторный режим рисования. Нажмите на кнопку «Конвертировать в векторную».
Сначала увеличьте масштаб — один раз нажмите на кнопку плюс.
Затем выберите инструмент «Прямоугольник».
Возьмите коричневый цвет.
Нарисуйте прямоугольник. Обратите внимание, бревно не должно быть длинным.
Затем возьмите инструмент «Эллипс» и нарисуйте по краям два овала.
Теперь бревно надо раскрасить. Выберите инструмент «Окрасить форму».
Добавьте к коричневому цвету светло-коричневый.
Выберите тип заливки.
Закрасьте бревно.
Закрасьте один из торцов.
А также контурные линии.
Теперь выберите вот такие цвета и окрасьте второй торец.
Бревно готово! Осталось только переименовать его в «Бревно1». Кликните на синий кружочек, и в свойствах бревна напишите его имя.
Теперь у нас есть фон, Кот и Бревно1. Можно сделать первый вариант игры.
А. ПРОСТЕЙШАЯ ИГРА, КОТ И БРЕВНО.
Игру будем делать поэтапно, постепенно усложняя скрипты. Сначала сделаем самый простой вариант игры. Кот будет двигаться равномерно, а летать будет только одно бревно. Вот программа для Кота. В ней всего один скрипт.
В этом скрипте встречается новый блок «если иначе». Он работает очень просто, если голубое условие выполняется, ответ на вопрос «клавиша пробел нажата?» - «да», тогда координата Y у Кота измениться на четыре и Кот поднимется вверх. Если клавиша пробел не нажата, то выполниться блок «изменить Y на -4», и Кот поедет вниз. Запустите программу зелёным флажком. Нажимайте пробел — Кот летает вверх и вниз.
Теперь сделаем программу для бревна.
В этом скрипте нам впервые встретился зелёный блок «выдать случайное от 2 до 4». Этот блок выдаёт любое случайное число из указанного диапазона. В нашем случае блок каждый раз выдаёт либо число два, либо три, либо четыре. А из-за того, что зелёный блок лежит в блоке «ждать», следующее бревно полетит неизвестно, когда, может через две секунды, может через три, а может через четыре. Это добавляет в игру элемент неожиданности.
Ещё один новый блок — «повторять пока не», повторяет то, что спрятано у него внутри до тех пор, пока не сбудется его голубая мечта, пока бревно не «коснётся края». А внутри блока «повторять пока не» лежит блок движения бревна — блок «изменить Х на -5». Как вы уже знаете, изменение Х на отрицательное число означает движение влево. Таким образом, бревно будет лететь влево до тех пор, пока не «коснётся края», а как только это произойдёт, то выполнение блока прекратиться и будет выполнен блок «скрыть», и следом за ним блок «перейти в Х Y» отправит бревно в начальную точку на правом краю сцены.
Снова запустите программу. Если бревно у вас не летает, то попробуйте его укоротить. Размер бревна должен быть примерно с голову Кота.
Как вы видите, бревно летает, но в Кота не попадает. Даже тогда, когда они с бревном находятся в одной точке, Кот продолжает весело улыбаться. Это надо исправить, следует добавить скрипт встречи с бревном.
Если Кот треснется об бревно, он станет грустным, а если не треснется, то весёлым.
Б. УСЛОЖНЯЕМ ПРОГРАММУ. ДОБАВЛЯЕМ ФИЗИКУ, БРЁВНА И ДЕРЕВЬЯ.
У нас получилась простейшая версия программы, в которой всего одно бревно, и Кот летает как-то неестественно, плавно поднимается и опускается, как на лифте. На самом деле, когда вы летаете с реактивным ранцем, то вы летаете как на ракете, с ускорением, сначала медленно, потом всё быстрее и быстрее. Ускорение можно почувствовать в автомобиле, когда папа жмёт со свей силы на педаль газа и вас вжимает в кресло, или в самолёте, когда пилот на взлёте передвигает ручку управления двигателями от себя. С ускорением летают птички в игре Angry Birds и транспорт в игре Hill Climb Racing. Ускорение проходят в школе на уроках физики, а о компьютерных играх, в которых движение выглядит как в жизни, говорят, что они содержат физику. Давайте добавим физику и в нашу игру — полёт Кота будет больше похож на реальную жизнь, когда соседский кот надевает реактивный ранец и отправляется на крышу. Для этого нам понадобится переменная «Скорость». Чтобы создать переменную нажмите на оранжевые блоки «Данные» и на кнопку «Создать переменную».
Введите имя переменной.
Теперь полностью удалите скрипт движения Кота. Перетащите его к блокам и бросьте.
Теперь сделайте новый скрипт движения для Котика.
Как видите, теперь мы изменяем координату Y Кота не просто на 4 или -4, а всегда на разную величину, которая храниться в переменной «Скорость». Эта величина не постоянная. В самом начале её значение равно нулю, и, если не нажимать на «Пробел», то значение будет всё время уменьшаться, и станет меньше нуля. Y будет изменяться на отрицательную величину, а Кот будет опускаться вниз, пока не провалится за край экрана. Если Вы решите помочь ему выбраться, то нажимайте на «Пробел», значение переменной «Скорость» будет увеличиваться, и когда оно станет больше нуля, Кот полетит вверх. Если рядом с переменной стоит галочка, то вы сможете видеть её значение на экране.
Запустите игру, нажимайте на «Пробел», и внимательно понаблюдайте за значением переменной. Когда Кот летит вниз — у переменной впереди виднеется минус, когда Кот летит вверх — значение переменной больше нуля. Обратите внимание, каким плавным стал полёт Кота. Если нажать на «Пробел», то он плавно разгоняется, если отпустить, то он продолжает немного двигаться вверх по инерции. Физика работает!
Теперь давайте усложним жизнь Коту, добавим ещё два бревна. Рисовать ничего не будем. Просто скопируем наше Бревно1 и немного изменим скрипты новых брёвен. Кликните на Бревно1 правой кнопкой и выберите «дублировать».
Появится спрайт второго бревна — Бревно2.
Ещё раз дублируйте первое бревно, появится Бревно3.
Для разнообразия можно немного изменить новые брёвна. Выберите Бревно2 и перейдите на вкладку «Костюмы».
Выберите бревно инструментом выбора.
Немного поверните его за верхний кружочек.
Теперь проделайте то же самое с третьим бревном, только поверните его в другую сторону.
Вот такие брёвнышки у нас получились.
Сейчас немного изменим скрипты второго и третьего бревна, и можно будет протестировать проект. В скриптах потребуется изменить только координаты Y — то есть высоту полёта брёвен, и интервал задержки в зелёном блоке. Вот так должен выглядеть скрипт Бревна2, оно летит посередине, его координата Y всегда равна нулю. Появляется оно через каждые три, четыре, пять, или шесть секунд.
Вот скрипт Бревна3, оно летит внизу, его координата Y всегда равна -140. Это самое редкое бревно, оно летает не чаще чем раз в четыре секунды.
Запустите проект. Кот летает с большим трудом уворачиваясь от брёвен. Играть стало гораздо интереснее, но чего-то не хватает. Всё портит неподвижный фон, он не даёт поверить, что Котик летит вперёд. Для того, чтобы это исправить, нам понадобятся три тополя. Пускай они медленно плывут справа налево, это украсит игру.
Сначала нарисуем первый тополь. Нажмите на кнопку «Нарисовать новый спрайт».
Кисть уже выбрана.
Остаётся выбрать цвет кроны из листьев и нарисовать её.
Теперь выбираем цвет ствола.
Рисуем снизу ствол.
Обратите внимание, линия должна быть замкнутой, иначе мы потом не сможем закрасить крону зелёным цветом.
Выберите инструмент «Заполнить цветом».
Выберите цвета.
И способ заливки кроны.
Закрасьте крону.
Теперь выберите цвета ствола, способ заливки тот же.
Закрасьте ствол.
Самое главное, не забыть установить центр костюма в самом низу дерева. Кликните на кнопку «Установить центр костюма».
Кликните внизу ствола.
Тополь готов! Переименуйте его.
Сделайте Тополю1 такую программу.
Программа очень похожа на программу бревна. Главное отличие в блоке «изменить размер на 0.3». Этот блок постоянно увеличивает дерево во время движения влево, и нам кажется, что тополь приближается. Запустите проект, посмотрите, как двигается дерево. Если дерево не появляется, или начинает движение падая с неба, то скрипту тополя потребуется отладка. Надо будет подобрать подходящие значения для координат начальной точки Х=190 и Y=-90, для начального размера 40%, и для скорости изменения размера 0.3.
Координаты Х и Y вам надо будет подобрать самостоятельно так, чтобы в момент начала движения ствол дерева касался травы и не касался края сцены. Если ваше дерево шире моего, то уменьшайте Х, сделайте его 170 или 150. Вот правильное начало игры.
Вот неправильное начало.
Начальный размер в 40% также подбирается на глаз. Так как я нарисовал очень большое дерево, то понадобилось его уменьшить до сорока процентов. Вот так выглядит мой тополь при размере 100% по сравнению с Котом.
Если вы нарисуете не такое большое дерево как у меня, от и процент у вас будет отличаться в большую сторону. Когда работа скрипта первого дерева будет отлажена, дерево должно плыть до левого края экрана и исчезать. Если дерево исчезает немного раньше, то, наверное, оно коснулось не левого края экрана, а верхнего или нижнего.
В этом случае вы можете изменить значение в блоке «изменить размер на 0.3». Напишите там 0.25 или 0.2.
Когда отладка скрипта Тополя1 закончена, то его смело можно дублировать два раза подряд.
Теперь у нас три тополя.
Скрипты Тополя2 и Тополя3 отличаются от первого только блоком «ждать». Вот скрипт Тополя2.
Вот скрипт Тополя3.
Запускайте проект. Если первое дерево двигалось правильно, то и теперь все три тополя будут двигаться также. Отладка больше не потребуется.
В. ФИНАЛЬНАЯ ДОРАБОТКА ИГРЫ.
Добавим Коту Жизни, которые будут убавляться при столкновении с брёвнами, а также сделаем так, чтобы он не улетал за край сцены.
Сначала добавим переменную «Жизни». Выберите оранжевые блоки и нажмите на кнопку «Создать переменную».
Введите имя переменной.
Появится новая переменная.
Установите около неё галочку, чтобы переменная отображалась на экране.
Доработайте первый скрипт Кота. Добавьте туда блок «задать Жизни значение 9». Теперь у кота будет всего 9 жизней.
Теперь доработайте скрипт столкновения Кота с препятствием. Сейчас он выглядит вот так.
А должен выглядеть вот так.
Давайте посмотрим, как работает этот скрипт. В блок «всегда» вложены три одинаковых блока «если иначе», каждый из которых реагирует на своё бревно. При столкновении с бревном Котик меняет костюм на грустный, количество его жизней уменьшается на единицу, а как только бревно пролетит дальше, и перестанет касаться Кота, он снова станет весёлым.
Для того, чтобы Котик не улетал за край сцены, добавьте Коту ещё два скрипта.
Первый скрипт работает следующим образом, если Кот долетел до самого низа сцены, и его координата Y стала меньше чем -160, то дальше координата Y изменяться не будет. Y будет установлен в -160, Кот застынет в нижней точке. Второй скрипт работает похожим образом. Если Кот долетел до самого верха сцены, и его координата Y стала больше чем 160, то дальше координата Y изменяться не будет. Y будет установлен в 160, Кот застынет в верхней точке. Значение скорости в обоих случаях будет равно нулю.
Осталось сделать только последний скрипт — скрипт проигрыша. Если у Кота останется ноль жизней, то он должен вращаясь уменьшиться и исчезнуть.
Вот теперь игра готова. Постарайтесь продержаться как можно дольше.
Вопрос: как ускорить полет брёвен?
Задание: сделайте, чтоб все три бревна вращались в полёте.