Занятие № 5. Процедуры. Отправка сообщений

Упражнение № 1. Рисование фигур с помощью отправки сообщений

Создадим программу в которой после нажатия на сцену в месте клика будет нарисован квадрат.

Добавим блоки для рисования. Для этого нажми кнопку Добавить расширение image-20201211113527128, после чего выбери расширение Перо.

Открой Scratch и щёлки по фону в нижней части экрана:

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

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

В открывшемся окне введи название сообщения, которое нужно отправить. Потом нажми кнопку ОК.

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

Как только спрайт получит сообщение квадрат запустится скрипт рисования квадрата 1. Чтобы спрайт при передвижении от одного места на сцене до другого не оставлял след, поднимем перо 2. Затем переместим спрайт в координаты по которым располагался курсор мыши в момент клика 3. Выбираем случайный цвет для пера и опускаем его для начала рисования квадрата 4. С помощью цикла рисуем квадрат 5.

Попробуй нажимать на сцену. Спрайт будет перемещаться в место клика и рисовать там квадрат.

По нажатию на флажок сцена должна очищаться от всех рисунков.

Упражнение № 2. Программа Paint

Создадим программу для рисования.

Открой файл PaintBox_No_Code.sb2 который содержит шаблон новой программы. Сейчас на сцене должны располагаться два спрайта: карандаш и стерка.

Программа для карандаша

Выбери спрайт карандаш и добавь ему следующий скрипт:

Нажми на флажок. После этого спрайт должен следовать за курсором мыши.

Добавим блоки для рисования. Для этого нажми кнопку Добавить расширение image-20201211113527128, после чего выбери расширение Перо.

Измени добавленный скрипт, добавив блок если/иначе, чтобы при нажатии на кнопку мыши спрайт рисовал:

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

Выбор цвета для карандаша

Рисовать одним цветом не очень интересно. По этому сделаем выбор цвета для рисования.

Выбери спрайт карандаш и перейди в закладку Костюмы. Сейчас у спрайта должно быть два костюма: карандаш-синий и стёрка. Добавим третий костюм для зелёного цвета.

Нажми правой кнопкой мыши по костюму карандаш-синий и выбери пункт дублировать:

Выбери новый костюм и поменяй его имя на карандаш-зеленый:

Теперь нужно изменить цвет заливки нового костюма. В панели инструментов выбери инструмент Заливка image-20201211113934216. После этого выбери зелёный цвет на панели цветов image-20201211113952362. Теперь подведи курсор к синему цвету на текущем костюме. Он должен измениться на зелёный. После этого нажми левую кнопку мыши.

Новый костюм готов.

Создадим два спрайта, по нажатию на которые будем выбирать цвет карандаша.

Нажми кнопку Нарисовать в меню добавления нового спрайта:

Откроется закладка Костюмы. На панели инструментов выбери инструмент Прямоугольник image-20201211114346061.

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

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

Переименуй новый спрайт. Для этого выбери новый спрайт в библиотеке спрайтов 1 и введи в текстовое поле 2 новое имя спрайта - синий:

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

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

Выбери спрайт зеленый и добавь ему следующий скрипт:

Чтобы изменить название сообщения в блоке Передать, нажми по параметру и выбери пункт Новое сообщение. В появившемся диалоговом окне набери название нового сообщения и нажми кнопку OK.

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

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

Аналогично сделаем смену цвета на синий.

Выбери спрайт синий и добавь ему следующий скрипт:

Теперь выбери спрайт карандаш и добавь скрипт, который будет реагировать на сообщение синий:

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

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

Инструмент “Стерка” и очистка холста

Как бы хорошо мы не рисовали, случаются ошибки. Чтобы их исправлять добавим к программе кнопку Очистить и инструмент Стерка.

Начнём с кнопки Очистить. Добавь спрайт Block-X из библиотеки (раздел Буквы). Расположи его рядом со спрайтом стерка:

Выбери спрайт Block-X и добавь ему следующий скрипт:

Проверь работу программы. Нарисуй что-нибудь на сцене и нажми на крестик. Все рисунки должны исчезнуть.

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

Выбери спрайт стерка и добавь ему следующий скрипт:

Если нажать на изображение стерки наш карандаш должен изменить костюм на изображение стерки и выбрать цветом для рисования белый.

Составь необходимый скрипт для карандаша самостоятельно или можешь воспользоваться подсказкой.

Подсказка (Скрип для создания стерки) Тебе понядобятся эти блоки

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

Последовательность составления условия показана на следующем рисунке:

Теперь перо спрайта карандаш будет опускаться только если выполняются два условия: мышь нажата и координата y мыши больше -80.

Изменение ширины пера

Добавим возможность изменять ширину пера. Для этого создадим переменную ширина:

Используем новую переменную в скрипте спрайта карандаш:

Теперь размер пера всегда будет браться из переменной.

Чтобы упростить изменение ширины пера сделаем следующее: нажми правой кнопкой мыши по имени переменной ширина на сцене и выбери пункт рычажок:

Теперь под именем переменной появился рычажок (слайдер) который можно передвигать, и тем самым менять значение переменной.

Попробуй передвинуть рычажок и нарисовать что-нибудь с новым значением ширины пера.

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

Установи минимальное значение равное 1, а максимальное - 50.

Как улучшить программу для рисования

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

  1. Сделай возможность переключать цвета, стирать всё содержимое или вызывать инструмент стерка по нажатию на клавиши на клавиатуре. Например, по нажатию на клавишу b цвет может меняться на синий, а клавиша g будет включать зелёный цвет. Также можно сделать смену ширины пера по нажатию на стрелочки.
  2. Добавь к программе новые цвета. Например красный, желтый и черный. Вернись к началу инструкции, если у тебя возникнут трудности с этим заданием.