Главная страница «Первого сентября»Главная страница журнала «Информатика»Содержание №20/2008


Предлагаю коллегам

Среда Scratch - первое знакомство

Продолжение. Начало см. в № 18/2008

ДЕМОНСТРАЦИОННЫЕ   ПРОЕКТЫ (ГРУППА  A)

Проект 2. “Делаем мультфильм”

Важным направлением медиатворчества является анимация, т.е. “оживление” графических персонажей. Посмотрим, насколько просто обстоит с этим дело в Scratch.

Разумеется, в подобной среде просто не может не быть средств для анимации. И действительно, в Scratch предусмотрен механизм смены изображений (“костюмов”), что, собственно говоря, и решает сформулированную задачу. Если каждая из картинок представляет собой определенную фазу движения, то смена их с определенной скоростью и породит на экране своеобразный компьютерный мультфильм.

Для практического освоения навыков анимации в Scratch удобно воспользоваться набором картинок, изображающих шагающего мальчика. Они находятся в папке People (Люди) и называются boy4-walking-a, boy4-walking-b и т.д. до “e”, т.е. всего 5 картинок.

Загрузить картинки можно следующим несложным способом. Запустим Scratch и в спрайте традиционного кота перейдем на вкладку Costumes. Удалим картинки с веселыми котиками, для чего используем круглую кнопку с крестиком возле каждого из изображений (справа внизу). Теперь щелкнем по кнопке Import, что позволит нам загрузить первую картинку под буквой a. Затем повторим процедуру импорта еще 4 раза, не забывая каждый раз “наращивать” букву в имени файла. В результате у вас получится следующая галерея рисунков (рис. 2.1).

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

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

Для этой цели соберем несложный скрипт, приведенный на рис. 2.2. Как видно из текста программы, она запускается стартовой клавишей с зеленым флажком и в “вечном” цикле forever делает следующее. После паузы в 0,1 сек. (время подбирается для максимальной правдоподобности движения) сменяется картинка, а затем мальчик сдвигается на заданное число пикселей (он же должен не просто перебирать ногами на месте, но и двигаться). Последний блок if on edge bounce обеспечивает автоматический поворот (“отражение”) мальчика, когда он доходит до границы экрана.

Вот, собственно, и все. Остается запустить проект и полюбоваться шагающим мальчиком. (Ах да, чуть не забыл: смените режим поворота спрайтов на лево-право, иначе влево мальчик будет идти вниз головой!)

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

Разумеется, Scratch позволяет и усложнить скрипт, что сделает сюжет вашего мультфильма более содержательным и интересным. Попробуйте!

 

 

Рис. 2.2. Программа создания анимации

 

 

Проект 3. “Столкновение”

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

Пусть спрайт-1 движется вдоль экрана и наталкивается на неподвижный спрайт-2 — этакая сильно урезанная модель катастрофы “Титаника”.

Картинки объектов найдем в библиотеке рисунков Scratch. Вместо корабля выберем, например, роскошную яхту (файл yacht в папке Transportation), а вместо отсутствующей картинки айсберга — скалу (файл rock в папке Things). Разумеется, вы можете выбрать два любых других понравившихся вам рисунка.

Очень важно понимать разницу между данным проектом и предыдущим. В проекте-2 был единственный спрайт, у которого было несколько “костюмов”. Сейчас же мы имеем дело с двумя спрайтами, а механизм Costumes для простоты вообще не задействуем. Иными словами, в автоматически созданном первом спрайте мы опять удалим кота и заменим его веселые образы рисунком яхты, а затем создадим новый спрайт, второй. Возможно, читатели запомнили, что это делается при помощи группы кнопок 8, причем сейчас нам лучше всего подходит средняя из кнопок (при подведении к ней мыши высвечивается Choose new sprite from file — Выберите новый спрайт из файла).

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

Скрипт устроен крайне просто: яхта движется вправо до тех пор, пока (until) не заденет Sprite2, — условие имеет вид touching (Sprite2).

Обязательно обратите внимание на тот факт, что Scratch работает со спрайтами очень аккуратно: он не считает их прямоугольниками, а фиксирует факт касания самих рисунков. Посмотрите внимательно на рис. 3.1, где на сцене произошло столкновение спрайтов. Мы видим, что мачта яхты задела скалу, хотя ее нос уже успел продвинуться очень далеко. Механизм такой аккуратности состоит, по всей видимости, в наличии “прозрачного” цвета — как в PhotoShop и других графических редакторах. Действительно, вернитесь к рис. 1.8 и обратите внимание на клетчатое поле вокруг изображения — именно так принято обозначать прозрачный цвет.

Заметим, что работа с цветом лежит в основе и многих других “сенсоров” (фиксируемых системой условий) Scratch. В частности, спрайт может задеть заданный цвет, например, синий, что может свидетельствовать о попадании в воду. Можно также зафиксировать факт касания края сцены (touching edge) и некоторые другие. Такое разнообразие позволяет строить весьма изощренные по логике проекты.

В заключение можем порекомендовать для повышения эмоционального воздействия добавить к нашей сцене фоновую картинку (background). Для этого в области списка спрайтов найдем сцену (Stage), щелкнем по ней и выберем закладку Backgrounds. Подобно тому, как мы это делали при импортировании “костюмов” спрайтов, загрузим изображение фона. Из готовых изображений наиболее подходящим мне показался файл city-with-water2, находящийся в папке Outdoors (рис. 3.2).

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

 

Проект 4. “Пишем музыку”

Цель этого короткого проекта — показать, что Scratch не просто может проигрывать звуковые файлы, но и предоставляет детям с музыкальными способностями возможность самим синтезировать музыкальное сопровождение в виде своеобразной нотной партитуры.

Для целей звукоизвлечения в Scratch предусмотрена страница с командами, блоки которых окрашены в розовый цвет. Перейдем на соответствующую страницу палитры блоков и обратимся к оператору play note (60) for (0.5) beats. Этот оператор играет заданную ноту в течение указанного времени. Ноты пронумерованы, но для удобства настройки при выборе ноты вместо выпадающего списка появляется рисунок с клавиатурой пианино (рис. 4.1).

 

Рис. 4.1. Выбор ноты

Примечание. По-видимому, это недоработка ПО, но нарисованная клавиатура содержит только ноты с 48-й по 72-ю, что соответствует всего двум октавам (как это изменить, мне найти не удалось). Тем не менее вместо числового значения Scratch принимает (и затем правильно воспроизводит) любые номера нот с 0-го до 127-го.

В качестве легкого упражнения автор реализовал некоторую гармоническую “распевку”, которая выглядит как “до-ми-соль-ми-до”. Затем, чтобы проверить возможности многоголосия, были дописаны еще две “партии”, которые состояли из паузы на первые 4 ноты (rest for (2.1) beats), а на пятую обеспечивали аккорд из трех выбранных нот.

Самая первая команда в скрипте выбирает музыкальный инструмент. Мне понравился номер 20 — это церковный орган. Разумеется, вы можете выбрать и любой другой из более чем 120 инструментов.

Примечание. Логика подсказывает, что длительность паузы в течение четырех нот по 0.5 бита должна равняться 2.0 бита. Но на практике хочется ее сделать немного больше.

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

ДЕМОНСТРАЦИОННЫЕ   ПРОЕКТЫ (ГРУППА  B)

Предыдущие проекты из группы A были задуманы для освоения приемов и технологий работы со средой Scratch. В то же время, их практическая ценность как самостоятельных проектов была невелика: едва ли нашего “ходящего человека” или аккорд из трех нот даже родственники согласятся воспроизвести хотя бы несколько раз.

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

Проект 5. “Создаем стандартные элементы управления”

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

Как с этим обстоит дело в среде Scratch? Подобные компоненты там отсутствуют. Если речь идет о детях

8–10 лет, то это придется признать оправданным — ребенку такого возраста проще произвести свой выбор между красочными картинками, чем читать подписи и выбирать требуемый вариант с помощью радиокнопок. Но более старшие ученики, вполне возможно, будут иного мнения. Поэтому давайте посмотрим, как можно решить эту проблему, если нам все-таки потребуются подобные элементы управления.

Для конкретности рассмотрим следующую задачу. Пусть мы хотим управлять видимостью спрайта (например, того же “титульного” кота) с помощью флажка проверки (checkbox). Реализовать этот проект средствами Scratch вполне реально и даже не очень сложно. Обсудим, как это можно сделать.

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

Итак, берем любой редактор, например встроенный Paint, и создаем в нем флажок проверки с произвольной подписью (на серый фон рис. 5.1 пока не обращайте внимания).

Рис. 5.1. Создаем рисунок флажка проверки

Мы быстро нарисовали квадратик и сделали подпись (кстати, нарисовать ее вне среды — это единственный способ получить русский текст в текущей версии Scratch). Теперь возникает вопрос, в каком формате сохранить рисунок. Он решается легко: заглядываем в библиотеку рисунков (папка media) и видим, что файлы там имеют расширение GIF или PNG. Сохраним наше творение в формате GIF.

Примечание. Для сохранения собственных рисунков рекомендуем внутри папки Media\Costumes создать отдельную папку.

Загрузив в Scratch данный рисунок, мы ничего не увидим. Почему — понять непросто, но Scratch очень чувствителен к наличию прозрачного цвета. Как его установить? Прежде всего надо закрасить неиспользуемым цветом ту область, которую вы хотите сделать прозрачной (вернемся к рис. 5.1). Казалось бы, можно просто сделать прозрачным белый фон. Но это плохое решение. В дальнейшем мы обнаружим, что щелчок по прозрачной области спрайта системой не засчитывается. Именно поэтому площадь внутри квадрата ни в коем случае не должна быть прозрачной!

Остается задать цвет, которым закрашен фон нашей картинки, прозрачным. С ужасом вспоминая, насколько это длинная процедура в PhotoShop (включая обязательный временный переход в формат RGB), я использовал для этой цели редактор MS Photo Editor, в котором данная операция выполняется элементарно: нажимаем кнопку на панели инструментов (см. рис. 5.2) и щелкаем мышкой в любую точку прозрачной области. В результате получаем рисунок, который уже нормально читается в Scratch.

Рис. 5.2. Сделаем фон прозрачным

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

На этом подготовительная работа завершена и можно наконец запустить Scratch.

Как мы уже твердо усвоили, Sprite1 — это кот. Создаем Sprite2, в который в качестве “костюмов” загружаем обе подготовленные картинки. Он-то и будет являться заготовкой для флажка проверки.

Далее создадим внутреннюю переменную, которая будет хранить либо 0, либо 1 в зависимости от состояния нашего флажка. Для этого открываем на палитре блоков страницу Variables и щелкаем по кнопке Make a variable (создать переменную). В появляющемся диалоговом окне впишем имя переменной (на рис. 5.3 в качестве имени использовано сокращение от checkbox — cb) и, учитывая локальный характер величины, поменяем значение For all sprites (для всех спрайтов) на For this sprite only (только для этого спрайта).

Рис. 5.3. Создание переменной в Scratch

После этого на палитре блоков появятся новые блоки оранжевого цвета для работы с переменной cb — см. левую часть рис. 5.5.

Теперь создадим обработчик, который будет устанавливать визуальный образ флажка в зависимости от значения только что созданной нами переменной. Для этого к заголовку When Sprite2 clicked пристыкуем оператор if / else. Теперь в него после слова if надо добавить условие. Это также делается мышкой: на рис. 5.4 показано, как условие в виде равенства буксируется со страницы Numbers (зеленый цвет) на требуемое место.

Пустой шаблон для условия готов. Теперь уже внутрь него надо заносить левую и правую части необходимого равенства cb = 0. Переменную возьмем и перетащим со страницы Variables (рис. 5.5), а числовое значение просто впишем.

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

- изменение значения переменной cb на противоположное; если cb = 0, то cb = cb + 1 (реализуется блоком change cb by (1)), иначе cb = 0 (set cb to (0));

- установка соответствующего изображения: если cb = 0, то switch to costume [checkbox1], иначе switch to costume [checkbox0];

- выключить или включить Sprite1.

Рис. 5.4. Создание условия в Scratch

Рис. 5.5. Посещаем переменную внутрь условия

Первые два действия собираются из стандартных блоков элементарно, но с последним возникают принципиальные трудности. В Scratch предусмотрены команды hide и show, которые нам подходят для включения спрайта, однако проблема в том, что они применяются к тому спрайту, для которого написан скрипт. Иными словами, тот скрипт, который мы разрабатываем для флажка, в состоянии спрятать только сам флажок, но не кота!

Примечание. Вот она, плата за “облегченность”! Согласно классическим принципам ООП, перед именем метода указывается тот объект, к которому он применяется: например, для выключения изображения кота следовало бы писать Sprite1.hide. Но ради простоты языка для малышей запись сократили, вследствие чего объект указывать уже не надо (но зато и нельзя, даже если потребуется!).

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

Чтобы объект послал сообщение, на странице Control (цвет желтый) есть команда broadcast [ ], т.е. разослать широковещательное сообщение всем объектам. Параметром команды является имя сообщения. В начальный момент никаких сообщений нет, их надо создать, выбрав пункт new…, который всегда возникает в конце списка после имен уже имеющихся сообщений. После создания сообщений с именами 0 и 1 окончательная программа для флажка примет вид, приведенный на рис. 5.6.

А для кота, который только получает сообщения, программа будет еще проще (рис. 5.7). Заметим, что when I receive [ ] означает “когда я получу сообщение”.

Как только все набрано (а точнее сказать, собрано из блоков), можно пощелкать по флажку и убедиться, что он работает сам (обязательно проконтролируйте значение переменной cb в левом верхнем углу сцены!) и правильно “руководит” видимостью кота.

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

Рис. 5.6. Программа для спрайта с флажком

Рис. 5.7. Программа для спрайта с котом

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

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

Все эти эксперименты должны убедить вас, что в Scratch вполне достаточно средств для создания развитых интерактивных приложений.

Проект 6. “Имитируем Лого-Черепашку”

Во введении мы упоминали, что Scratch вполне может имитировать Лого-Черепашку. Настало время проверить это.

Начнем с того, что нарисуем образ будущей героини проекта, так как в галерее рисунков ее, как ни странно, нет. Возможное (и, видимо, не лучшее, учитывая мои более чем скромные художественные способности) решение показано на рис. 6.1. Подчеркнем, что для правильной работы программы очень важно, чтобы спрайт-Черепашка смотрел в направлении оси x, т.е. вправо.

Рис. 6.1. Образ Черепашки

Дальнейшая работа показала, что моя черепашка оказалась слишком большой. К счастью, Scratch предложил простое решение проблемы — оказалось, что спрайт очень легко уменьшить. Для этого надо на панели инструментов воспользоваться самой правой кнопкой. На ней изображены стрелки, которые направлены внутрь, а при подведении указателя мыши выдается текст про уменьшение спрайта: Shrink sprite. Выберем данный инструмент, щелкнув по нему мышкой. Наставив изменившийся курсор на Черепашку, будем щелкать по ней, пока она не уменьшится до нужного размера (рис. 6.2). Кстати говоря, аналогичным способом можно и увеличивать спрайт соседним инструментом панели.

Когда Черепашка примет удовлетворительный вид, займемся скриптом. Пусть мы хотим заставить Черепашку нарисовать квадрат со стороной 100 единиц. Окончательный вариант программы виден из рис. 6.3.

Рис. 6.2. Уменьшаем размер спрайта

Рис. 6.3. Черепашка нарисовала квадрат

Скрипт запускается по кнопке с зеленым флажком и состоит из двух частей. Первая, образованная четырьмя блоками, инициализирует Черепашку; она универсальна и будет открывать любые “Лого-алгоритмы”. А вторая, начинающаяся блоком pen down, рисует квадрат. В целом программа настолько проста, что понятна без комментариев.

Результат виден в окошке сцены и вполне напоминает “настоящее” Лого.

Усложним теперь задачу так, чтобы потребовалась работа с переменными. Итак, пусть Черепашка должна нарисовать окружность радиуса R, которую обычно подменяют правильным n-угольником с большим числом сторон n; обычно n = 36 вполне достаточно.

Начнем с того, что создадим переменные R и n, которые являются параметрами задачи, и придадим им требуемые значения блоком типа set r to (0).

Вычислим из геометрических соображений угол поворота и размер стороны, считая заданными R и n. Угол, как известно, вычисляется по формуле 360/n, а длина стороны легко находится, если приравнять периметр многоугольника n*L к длине окружности. В итоге получаем требуемую длину стороны 2R/n 6*R/n.

Примечание. Если захотите более точно учесть значение , набирайте дробную часть через точку, например, 6.28.

Заметим, что даже “сборка” таких относительно несложных выражений, каковым является 6*R/n (см. рис. 6.4), у меня породила очень отрицательные эмоции. Захотелось вернуться к старой доброй клавиатуре, а не мучиться с мышью, вставляя друг в друга многочисленные блоки. Возможно, поклонники Microsoft Equation найдут подобный способ сборки выражений вполне естественным.

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

Рис. 6.4. Собираем арифметическое выражение

Таким образом, мы видим, что средства Scratch вполне достаточны, чтобы в простейших задачах заменить Черепашку. Тем не менее, как уже отмечалось во введении, Лого-программы с процедурами без переделок в среду Scratch перенести не удается (по крайней мере в текущей версии).

Проект 7. “Готовим учебную презентацию”

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

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

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

Воспользуемся описанием процесса чтения ОЗУ, которое дано в статье о функциональном устройстве компьютера в “Энциклопедии учителя информатики”, опубликованной в газете прошлым летом (нас сейчас интересует стр. 26 в номере 13 за 2007 год). Там дано следующее представление процесса взаимодействия процессора и ОЗУ:

- процессор выставляет на шину адреса необходимый адрес ячейки памяти;

- процессор передает по шине управления необходимые сигналы, обеспечивающие чтение из ОЗУ;

- ОЗУ принимает управляющие сигналы процессора и в ответ считывает с соответствующей шины адрес, находит его содержимое и выставляет на шину данных;

- ОЗУ по соответствующим линиям шины управления сообщает процессору о готовности данных;

- процессор, наконец, считывает с шины необходимую информацию.

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

Примечание. Строка 6 таблицы может быть опущена. На практике так часто и происходит: процессор, выждав время, заведомо достаточное для появления данных на шине, считывает ее содержимое. Нам кажется методически целесообразнее разобрать полный цикл взаимодействия, поскольку он более четко демонстрирует методы шинного взаимодействия между двумя устройствами.

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

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

Рис. 7.1. Фоновый рисунок для презентации

Далее придумаем динамические образы для спрайтов — это стрелки и символическое изображение двоичного кода (рис. 7.2).

Рис. 7.2. Заготовки для спрайтов

Для указания направления движения информации использованы стрелки. Поскольку обе стрелки никогда не будут использоваться одновременно, предлагается поместить их образы на один спрайт. В оригинальном проекте стрелки имеют разный цвет; если же вас устраивает одинаковый, то достаточно будет одного “костюма”: перевернуть стрелку можно командой point in direction (ее действие мы опробовали в проекте 1).

Спрайты 2–4 для простоты взяты с одинаковым графическим образом. Для усиления выразительности можно было бы сделать три разных рисунка, например, используя различные последовательности нулей и единиц или фон разного цвета.

Подготовка завершена, пора наконец-то запустить Scratch. Сразу же заменяем, как это мы уже не раз делали, образы кота на новые — в данном случае стрелки, затем создаем Sprite2 с образом двоичной информации. Далее копируем полученный спрайт с помощью кнопки на панели инструментов, как это показано на рис. 7.3 на. Так мы получим идентичные Sprite3 и Sprite4.

Затем выберем в качестве выделенного элемента сцену и загрузим ее фон. После расстановки спрайтов на ориентировочные места получим следующую заготовку презентации (рис. 7.4 ).

Рис. 7.3. Дублирование спрайта

Рис. 7.4. Все подготовленные рисунки помещены в проект

Рис. 7.5. Основной скрипт презентации

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

Примечание. Может показаться, что тогда все паузы по необходимости получатся одинаковыми, но это не так. “На нашей стороне” возможность вставить в оператор wait (1) secs произвольное выражение вроде p+1 или 2*p.

Структура самого скрипта оказывается весьма тривиальной: после паузы wait (p) secs следует команда извещения всех динамических компонентов broadcast (1) and wait, которая рассылает сообщение 1, вызывающее в них все необходимые динамические эффекты фазы 1. Затем такой же кусок повторяется для сообщения 2
и т.д. К сожалению, язык не позволяет вставить в оператор broadcast (1) and wait параметр в виде переменной и затем организовать по ней цикл, а потому приходится для каждого кадра помещать собственный блок.
В итоге вместо компактного цикла получается длинная и “нудная” линейная программа.

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

Полный главный скрипт, “привязанный” к сцене, будет иметь вид, изображенный на рис. 7.5.

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

Поскольку поведение стрелок наиболее сложное, начнем со спрайта с номером 2, который символизирует данные на шине адреса. Из анализа таблицы очевидно, что сначала он не отображается, а в конце фазы 1 появляется на экране. Первое из названных событий обозначено 0, а вот второе пока не определено. Поскольку оно должно произойти в конце (финале) фазы 1, обозначим его 1F. В результате скрипты для спрайта примут вид, изображенный на рис. 7.6. Посылку сообщения 1F мы организуем позже.

Рис. 7.6. Скрипты Sprite2 (код на шине адреса)

Совершенно аналогичные скрипты получаются и для спрайтов 3 и 4 — коды шин данных и управления. Единственная разница заключается в имени сообщения: вместо 1F следует указать 5F и 2F соответственно.

Примечание. Если заранее предвидеть такую идентичность скриптов, то лучше было бы создать Sprite2, собрать из “кубиков” все его скрипты и только потом скопировать, уже вместе с программой. Мы же скопировали только рисунок, когда скриптов на спрайте еще не было.

Остается описать поведение стрелки.

Как видно из скриптов рис. 7.7, в ответ на инициализирующее презентацию сообщение 0 стрелка исчезает.

Рис. 7.7. Скрипты Sprite1 (стрелка; сообщения 0-2)

Обработчик сообщения 1 устроен следующим образом. Стрелка устанавливается в начальное состояние, переключается на вид стрелки вниз и появляется на экране. Далее следует цикл ее перемещения вниз (change y by (–1) ) и затем после секундной паузы стрелка, которая указывала в конце цикла на шину адреса, с экрана убирается. Последней командой обработчик посылает сообщение 1F (финал первого этапа). Данное сообщение предназначается для спрайта номер 2, и его обработчик уже готов (см. рис. 7.6).

Примечание. В Scratch реализован очень удобный и понятный, хотя и не совсем очевидный механизм установки начальных координат спрайта. Когда спрайт мышкой отбуксирован в нужную точку, достаточно выполнить на нем двойной щелчок, и текущие координаты будут автоматически занесены в тело блока go to x: ( ) y: ( ) на палитре блоков. Остается лишь перетащить этот автоматически сформированный оператор в программу, так что знание координат практически не требуется.

В фазе 2 поведение стрелки во многом аналогично, так что и скрипт обработчика сообщения 2 практически такой же. Отличия весьма незначительны и заключаются в следующем. Удалена излишняя команда switch to costume [down]; увеличен параметр цикла repeat — стрелка теперь должна доходить до шины управления; изменено имя завершающего сообщения на 2F.

Cкрипты для фаз 3 и 4 во многом похожи на описанные выше, но и они имеют некоторые особенности (рис. 7.8). Оба они двигают стрелки не от процессора к шине, а от шины к ОЗУ, так что имеют другую координату x, а также направлены на перемещение стрелки вдоль оси y вверх, а не вниз, как ранее (switch to costume [up] и положительный шаг по y). Кроме того, в описываемых фазах презентации не требуется посылать сообщения другим спрайтам, поэтому команда broadcast отсутствует.

Рис. 7.8. Скрипты Sprite1 (сообщения 3 и 4)

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

 

Рис. 7.9. Скрипты Sprite1
(сообщения 5–7)

Рис. 7.10. Один из динамических кадров итоговой презентации

Теперь можно запустить и посмотреть созданную презентацию. Поскольку получаемая картина существенно динамическая, здесь мы приведем только один из кадров — рис. 7.10. На нем изображена фаза 5 (в левой части рисунка видно, что обведена реакция на сообщение 5). В запечатленный на рисунке момент стрелка уже дошла от ОЗУ до шины данных, и вот-вот на последней высветится считанное из памяти содержимое.

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

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

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

Теперь, когда работа над презентацией закончена, хочется сравнить возможности Scratch и PowerPoint. Конечно, и в PowerPoint тоже есть довольно мощные анимационные возможности, но, по-моему, даже на нашей достаточно тривиальной задаче разницу при желании можно заметить. Сравните Scratch-программу движения стрелки с механизмом, который предлагает пользователям PowerPoint (рис. 7.12). Видно, что движение стрелки по прямой — это предел его возможностей*. В Scratch, напротив, движение элементарно модернизируется, например, программируется остановка в середине пути или траектория делается синусоидальной. Важно подчеркнуть доступность любого анимационного эффекта, даже такого, который не был предусмотрен создателям ПО в MIT (в PowerPoint ваши возможности строго ограничены фантазией и усилиями, затраченными при разработке эффекта программистами Microsoft!).

Рис. 7.11. Встроенная в среду запись звука

Рис. 7.12. Сопоставляем возможности с PowerPoint


* Возможности VBA мы здесь не принимаем во внимание, что, может быть, делает сопоставление не совсем честным; тем не менее ясно одно: для школьника запрограммировать движение в Scratch много проще, чем в VBA.

Е.. А.. Еремин,
г. Пермь

TopList