Примеры скриптов
Перед тем как приступить к упражнениям, будет полезно вначале рассмотреть пару примеров и создать контекст для понимания того, как Director работает со скриптами. Когда головка воспроизведения входит в новый кадр, то Director ищет события, связанные с кадром, просматривает иерархию скриптов и определяет, нет ли сообщения скрипта на включение какого-либо действия. Вот подобный пример.
on enterFrame
put the Frame
end exitFrame
Когда головка войдет в кадр, содержащий предыдущий скрипт, то Director будет показывать в окне Message номер кадра. Вот еще один пример.
on exitFrame
gо to the Frame
end exitFrame
Во втором примере головка считывает команду события (on exitFrame) и определяет, что при выходе из кадра она должна войти в тот же самый кадр, из которого она только что вышла. Это похоже на команду Wait в специальном канале Tempo - головка остается в одном и том же кадре. Но вместо останова головки, как это происходит в команде Wait, в этом примере головка зацикливается в текущем кадре.
Различие между «ожиданием» и циклическим движением головки очень существенное. Во втором примере головке разрешено двигаться циклически, и она продолжает исполнять обработчики событий. Сцену нельзя обновлять, когда головка остановлена или «ждет». Создание цикла, подобного этому, позволяет анимации продолжаться, ролловерам кнопок - оставаться активными, а другим средствам взаимодействия с пользователем - быть доступными для выбора.
Практическое упражнение 11.1: Работа с маркерами
Подсказка
Маркер используется для сообщения Director'y расположения определенного кадра, и Director может передвинуть головку в этот определенный кадр.
В этом упражнении вы будете создавать фильм Director'a, в котором будет происходить перемещение в другое место партитуры, после того как пользователь включит событие. В данном случае пользователь щелкнет по кнопке. Вы уже познакомились с маркерами в главе 4, но здесь вы приобретете практический опыт обозначения кадров маркерами, для того чтобы Director мог перемещаться к этим обозначенным кадрам.
В этом упражнении будет использовано событие on mouseDown для перемещения головки в определенное место партитуры, обозначенное маркером. Затем вы создадите для пользователя кнопки управления
Forward (Вперед) и Backup (Назад). Вы также создадите программу показа слайдов, предоставляющую пользователю возможность продвигаться по ней, что будет напоминать перелистывание страниц книги.
Для структуры такой программы показа требуется последовательность маркеров, определяющая позиции смены сцены. Вы научитесь в этом упражнении создавать маркеры. Маркеры будут помещаться в канал
Marker и будут называться Start, Page One, Page
Two и Page Three (Старт, Первая Страница, Вторая Страница и Третья Страница).
Обратите внимание на то, что в канале 1 имеется общий элемент фона. В канале 2 содержатся графические изображения слайдов и видно, какой слайд отображается в данный момент. Канал
Script будет содержать реакцию на событие с обработчиком события кадра on enterFrame и командой Lingo go to the frame.
В каналах 3 и 4 содержатся кнопки Forward и Backup. Эти навигационные кнопки появляются в партитуре, как и требуется, при показе каждого слайда.
Для маркера Start нужна только кнопка Forward, так как из первой страницы некуда возвращаться. Таким же образом кнопка
Forward отсутствует у маркера последней страницы (Page Three).
Рассмотрим пример
Давайте взглянем на завершенное упражнение. Шаги этого раздела в данном упражнении будут более детализированы, чем в подобных разделах предыдущих упражнений. В этом упражнении мы поможем вам «заглянуть под капот» и посмотреть на «двигатель» (то есть на детали, заставляющие работать слайд-шоу). Мы будем двигаться медленно, чтобы вы могли связать увиденное на сцене с кодом Lingo, управляющим действиями на сцене.
1. Измените расположение различных панелей, для того чтобы было все видно.
2. В Control Panel щелкните по кнопке Rewind. Щелкните по кнопке
Play.
Быстрый переход Открытие Control Panel-Windows: Ctrl + 2
3. Вы увидите, как головка переместится в кадр 8 и остановится. Щелкните по кнопке
Forward на сцене. Обратите внимание, что головка в партитуре переместится в кадр 10 и, не останавливаясь, переместится в кадр 18 и остановится. Щелкните по кнопке Backup на сцене и вы увидите, как головка переместится в кадр 1 и, дойдя до кадра 8, остановится.
4. С помощью кнопок Forward и Backup на сцене просмотрите все слайды фильма, обращая внимание на то, что происходит в партитуре.
5. Взглянем поближе. В Control Panel щелкните по кнопке Rewind, а затем щелкните по кнопке
Play.
6. Вы увидите, как головка переместится в кадр 8 и остановится. И, хотя партитура выглядит неподвижной, в действительности головка циклически двигается по кадру 8 из-за наличия события кадра в канале
Script. Дважды щелкните по кадру 8 в канале Script, как показано на рис. 11.1.
Рис. 11.1. Кадр 8 в канале Script
7. Вы должны увидеть следующий программный код в открывшемся диалоговом окне.
on exitFrame
go to the frame
end
Именно фраза go to the frame заставляет Director зацикливаться в кадре 8 (текущем кадре), оставляя активными кнопки Forward и Backup на сцене. Без такого внутреннего цикла Director не смог бы обнаруживать щелчки пользователя по кнопкам и реагировать на них.
8. В партитуре слева в канале Marker находится всплывающее меню, в котором перечисляются все маркеры фильма Director'а, как показано на рис. 11.2. Щелкните по этому меню и выберите Page One.
Рис. 11.2. Всплывающее меню для выбора маркеров
9. Обратите внимание, что головка перемещается на этот маркер (Page One), как показано на рис. 11.3. Сцена обновляется и отображает информацию текущего кадра.
Подсказка
После выбора маркера во всплывающем меню головка передвигается к этому маркеру в партитуре. В шаге 9 маркер
Page One расположен в пределах текущей зоны видимости партитуры. Однако если выбранный маркер находится далеко справа в партитуре, то головка может выйти из зоны видимости. В этом случае вам нужно будет прокрутить партитуру к новому месту размещения головки.
Рис. 11.3. Головка воспроизведения переместилась на маркер Page One в партитуре
11. В окне Cast (откройте его, если оно еще не открыто) щелкните по элементу труппы
Forward. Посмотрите на левый нижний угол миниатюры для Forward. Этот значок в виде «листка бумаги» означает, что к данному элементу труппы подключен скрипт труппы. Выберите
Window | Script, для того чтобы просмотреть сам скрипт. В открывшемся окне
Script вы увидите следующий скрипт.
on mouseUp
go next
end
Скрипт запускается событием мыши on mouseUp (когда пользователь отпускает кнопку мыши). В команде go можно задать конкретный номер кадра, имя маркера, фильма или другие параметры, которые вы изучите, когда начнете работать с командой go. В нашем случае go next приказывает Director'y перейти к следующему маркеру (Page One). Если бы мы открыли скрипт, связанный с кнопкой Backup, то обнаружили бы похожую команду go previous, приказывающую Director'y перейти назад к предыдущему маркеру.
Что должно получиться на экране
На рис. 11.4 показано, как выглядит сцена завершенного упражнения.
Рис. 11.4. Сцена завершенного упражнения
Что должно получиться за сценой
На рис. 11.5 показано, как должна выглядеть партитура, когда вы закончите упражнение.
Рис. 11.5. Партитура завершенного упражнения
Пошаговые инструкции
1. Начнем с открытия файла, содержащего нужные нам элементы, следующим образом.
а) Выберите File | New
2. Выберите File | Save As и поместите ваш новый файл в папку с именем Save Work на вашем жестком диске. Назовите файл MyHorses.dir.
3. Если окно Cast не открыто, то откройте его, выбрав Window | Cast.
Быстрый переход Открытие окна Cast: Ctrl + 3
4. Если партитура не открыта, то откройте ее, выбрав Window | Score.
Быстрый переход Открытие окна Score: Ctrl + 4
5. Выберите Edit | Preferences | Sprite. В открывшемся диалоговом окне напечатайте 8 в поле Span Duration (Интервал Показа). Создаваемые вами спрайты из первой труппы должны иметь длительность, равную восьми кадрам.
6. В окне Cast, показанном на рис. 11.6, содержатся элементы, которые вы будете использовать для построения интерактивного слайд-шоу.
Рис. 11.6. Окно Cast с элементами труппы, готовыми к использованию
Подсказка
Маркеру вовсе необязательно присваивать имя, но имя облегчит его поиск в дальнейшем. Таким образом, это хорошая идея - использовать уникальное и описательное имя для маркера.
7. Поместите элемент труппы Title в канал 1 партитуры, щелкнув по нему и Перетащив Title из окна Cast в кадр 1 канала 1, как показано на рис. 11.7.
Рис. 11.7. Спрайт в партитуре
Подсказка
Вы можете редактировать имя маркера, просто щелкнув по нему в канале Marker и заново напечатав его имя. Для удаления маркера щелкните по треугольнику и, удерживая кнопку мыши нажатой, вытащите маркер из канала. Затем отпустите кнопку мыши.
8. Давайте создадим маркер и обозначим его.
а) Выберите кадр 1 в канале Marker партитуры.
б) Появится треугольник, показывающий новый маркер. Director также создает имя маркера по умолчанию (New Marker) и предлагает вам его изменить. Напечатайте Start и нажмите клавишу Enter. Результат показан на рис. 11.8.
Рис. 11.8. Новый маркер с новым именем Start
9. Давайте продолжим добавление остальных графических изображений.
а) Выберите элемент труппы Slide 1 в окне Cast (это первое графическое изображение для слайд-шоу).
б) Перетащите элемент труппы Slide 1 в партитуру и поместите его в кадр 10 канала 1, как показано на рис. 11.9.
Рис. 11.9. Элемент труппы Slide 1 в кадре 10 канала 1 партитуры
в) Во вкладке Sprite на панели Property Inspector, расположенной справа, выберите поле End Frame (Конечный Кадр) и напечатайте 18, как показано на рис. 11.10.
Рис. 11.10. Поле End Frame вкладки Sprite на панели Property Inspector
г) Выберите кадр 20 в канале 1.
д) Перетащите элемент труппы Slide 2 из окна Cast (это второе графическое изображение для слайд-шоу) в кадр 20 канала 1.
е) В поле End Frame в Property Inspector напечатайте 28.
ж) Выберите кадр 30 канала 1.
з) Перетащите элемент труппы Slide 3 из окна Cast (это третье графическое изображение для слайд-шоу) в кадр 30 канала 1.
и) В поле End Frame в Property Inspector напечатайте 38.
к) Ваша партитура теперь должна выглядеть, как на рис. 11.11.
Рис. 11.11. Четыре элемента труппы, добавленные в канал 1, будут слайдами
10. Давайте вернемся назад и еще добавим маркеры.
а) Добавьте новый маркер в кадр 10, щелкнув по этому кадру в канале Marker. Назовите новый маркер Page One.
б) Добавьте новый маркер в кадр 20 и назовите его Page Two.
в) Добавьте новый маркер в кадр 30 и назовите его Page Three.
г) Ваша партитура теперь должна выглядеть, как на рис. 11.12.
Рис. 11.12. Новые маркеры Page One, Page Two и Page Three в канале Marker
11. Вы только что создали основу для слайд-шоу. Теперь наступило время добавить средства навигации.
а) Выберите кадр 8 в канале Script. Это соответствует последнему кадру, в котором демонстрируется слайд Title.
б) Щелкните по элементу труппы Loop в окне Cast. В этом элементе труппы содержится скрипт, который мы хотим использовать для навигации.
Подсказка
Скрипт труппы - это скрипт, подключенный к определенному элементу труппы. Когда элемент труппы помещается на сцену, то его скрипт также подключается к этому новому спрайту.
в) Давайте коротко взглянем на этот скрипт. Выберите Window | Script. Ознакомьтесь со скриптом в открытом диалоговом окне, показанном на рис. 11.13.
Рис. 11.13. Скрипт, подключенный к элементу труппы с именем Loop
г) Это реакция на событие, в которой содержится обработчик события on exitFrame и команда Lingo go to the frame. Когда головка войдет в связанный с ними кадр (мы собираемся подключить скрипт к кадру 8), то она остановится и зациклится внутри этого кадра. Головка останется в данном кадре до тех пор, пока пользователь не щелкнет по кнопке Forward (которую вы добавите позднее в этом упражнении).
д) Щелкните по X в правом верхнем углу окна Script, чтобы его закрыть.
е) Перетащите элемент труппы Loop из окна Cast в партитуру и поместите его в кадр 8 канала Script. Отпустите кнопку мыши. Результат показан на рис. 11.14.
Рис. 11.14. Поместите элемент труппы Loop в кадр 8 канала Script
12. Давайте добавим этот же скрипт в другие графические изображения.
а) Выберите кадр 18 в канале Script.
б) Перетащите элемент труппы Loop в партитуру и поместите его в кадры 18, 28 и 38 (все кадры - в канале Script).
в) Теперь ваша партитура должна выглядеть, как на рис. 11.15.
Рис. 11.15. Скрипт добавлен в кадры 18,28 и 38 канала Script
13. Сохраните вашу работу в папке Save Work.
Подсказка
Всегда полезно часто сохранять свою работу и регулярно делать резервные копии.
14. Давайте создадим кнопки для навигации.
а) Выберите кадр 1 канала 3 в партитуре.
б) Палитра Tools должна быть уже открыта. Если нет, то выберите Window | Tool Palette.
в) Выберите инструмент Push Button (Нажимаемая Кнопка), как показано на рис. 11.16.
Рис. 11.16. Инструмент Push Button
г) С помощью этого инструмента вы создадите кнопку нужного вам размера. Давайте попробуем это сделать. Щелкните в правом нижнем углу сцены и, удерживая кнопку мыши нажатой, создайте ограничивающую рамку для кнопки. Отпустите кнопку мыши.
д) Внутри кнопки появится курсор ввода текста. Напечатайте Forward. Результат показан на рис. 11.17.
Рис. 11.17. Добавление текста в кнопку на сцене
е) Щелкните по фону сцены, чтобы закрыть текстовое окно кнопки. Ознакомьтесь с результатами на сцене.
ж) Щелкните по кнопке Forward на сцене.
з) В Property Inspector выберите вкладку Sprite и измените значение поля End Frame на 28. Нажмите кнопку Enter.
Подсказка
Вы также можете изменить конечный кадр кнопки Forward, щелкнув по последнему кадру этого спрайта в партитуре и перетащив его в кадр 38
15. Давайте создадим скрипт труппы для кнопки Forward.
а) Эта кнопка была автоматически добавлена как элемент труппы в окно Cast, когда вы создали кнопку Forward на сцене.
б) Выберите элемент труппы Forwards окне Cast, щелкнув по нему.
в) Пока мы не вышли из окна, давайте назовем кнопку. Щелкните по полю Name в окне Cast и напечатайте Forward.
г) Щелкните по кнопке Script в правом верхнем углу окна Cast, как показано на рис. 11.18. При этом откроется редактор скриптов.
Рис. 11.18. Кнопка Script в окне Cast
д) Введите приведенную ниже информацию. Обратите внимание на то, что Director автоматически формирует первую и последнюю строки, и вы должны добавить к ним go next.
on mouseUp
go next
end
Подсказка
Director начинает этот новый скрипт, используя обработчик события on mouseUp. Этот скрипт будет включаться, когда пользователь нажмет и отпустит кнопку мыши. Скрипт go next отправит головку к следующему маркеру.
е) Когда вы закончите писать скрипт, щелкните по кнопке Recompile, как показано на рис. 11.19.
Рис. 11.19. Кнопка Recompile в окне Script
16. Давайте создадим кнопку Backup (Назад).
а) Выберите элемент труппы Forward в окне Cast, щелкнув по нему.
б) Удерживая нажатой клавишу Alt , щелкните по элементу труппы Forward и перетащите его в пустую ячейку рядом с ним.
Мы только что создали дубликат. Скопированный элемент труппы показан на рис. 11.20.
Рис. 11.20. Скопированный элемент труппы
Подсказка
Вы создали копию элемента труппы Forward. Этот прием сберегает время, так как при этом также копируется и подключенный к элементу труппы скрипт труппы. Выполните следующие шаги, чтобы изменить элемент труппы и его скрипт для использования в кнопке Backup.
в) Измените в поле Name имя элемента труппы на Buckup.
г) Дважды щелкните по миниатюре скопированной кнопки, чтобы открыть диалоговое окно.
д) В левом столбце измените текст на Buckup. Закройте окно, щелкнув по кнопке X.
е) При еще выбранном элементе труппы Buckup щелкните по кнопке Script в правом верхнем углу окна Cast.
ж) Измените скрипт Lingo, чтобы он выглядел следующим образом.
on mouseUp
gо previous
end
з) Этот скрипт запускается, когда пользователь нажимает и затем отпускает кнопку мыши. Скрипт go previous отправит головку к предшествующему маркеру.
и) Когда вы закончите писать скрипт, то щелкните по кнопке Recompile.
Подсказка
После щелчка по кнопке Recompile скрипт проверяется на наличие ошибок. Если допущены опечатки или некорректное написание скрипта, то будет выдано предупреждение с приглашением проделать необходимые исправления.
17. Давайте отрегулируем интервал показа кнопки Buckup. Как вы помните, мы не хотим, чтобы кнопка Backup отображалась в слайде Title, так как из него некуда продвигаться назад. Кроме того, мы хотим, чтобы кнопка Backup, в отличие от кнопки Forward, присутствовала в последнем слайде, так как у нас есть возможность вернуться из последнего слайда назад к предыдущему слайду.
а) Перетащите элемент труппы Backup из окна Cast в кадр 10 (первый кадр второго слайда) канала 4 в партитуре.
б) Выберите вкладку Sprite и измените значение поля End Frame на 38. Нажмите клавишу Enter.
в) С помощью инструмента Arrow переместите кнопку Backup в левый нижний угол, как показано на рис. 11.21.
Рис. 11.21. Кнопка Backup, перемещенная на свое место сцены
18. Сохраните вашу работу в папке SaveWork.
19. Хорошо, теперь берите воздушную кукурузу и усаживайтесь смотреть ваш фильм.
а) Щелкните по кнопке Rewind на Control Panel.
б) Щелкните по кнопке Play на Control Panel.
в) На сцене щелкните по кнопке Forward. Продвигайтесь вперед, пока не достигнете последнего слайда.
г) На сцене щелкните по кнопке Backup. Продвигайтесь назад, пока не достигнете слайда Title (Заголовок).
д) Если вы способны успешно продвигаться вперед и назад по программе слайдов, то примите поздравления! Вы только что создали ваше первое средство навигации.
е) Если ваш фильм реагирует не так, как ожидалось, то внимательно пройдите назад по предыдущим шагам и посмотрите, не сделали ли вы где-нибудь ошибку. Вы также можете свериться с завершенным вариантом этого упражнения в файле с именем Horses.dir.
Практическое упражнение 11.2: Переходы
В этом упражнении вы будете добавлять эффекты переходов при смене программой одного слайда другим и обеспечивать более интересное отображение и зрительное воздействие в вашем проекте. В Director'e переход - это зрительный эффект, происходящий между одним или несколькими графическими элементами на сцене от кадра к кадру. Переходы отображаются, когда головка воспроизведения выходит из одного кадра и входит в другой кадр, в котором содержится переход. Другими словами, если вы хотите создать эффект перехода между кадрами 1 и 2, то должны поместить спрайт перехода в кадр 2. В этом упражнении графические изображения меняются у каждого маркера, и поэтому переход должен быть помещен в тот же кадр, что и маркер.
В Director'e можно выбирать из более пятидесяти различных внутренних переходов. Кроме того, вы можете добавлять эффекты переходов независимых разработчиков с помощью функции Xtras, не говоря уже о том, что вы сможете создать сами с помощью Lingo! В этом упражнении вы будете работать с несколькими переходами и осваивать опции каждого из них. Изучение принципов, лежащих в основе этих переходов, снабдит вас базой для самостоятельного экспериментирования с другими видами переходов.
Каналы эффектов в партитуре содержат канал Transition (канал Переходов). При помещении в кадр канала Transition переход становится спрайтом и поэтому помещается также в окно Cast как новый элемент труппы. Это позволяет использовать его многократно, не увеличивая объема проекта.
Рассмотрим пример
Давайте посмотрим на завершенное упражнение, чтобы вы лучше поняли, что вам предстоит создать.
1. Измените расположение различных панелей для того, чтобы было все видно.
2. В Control Panel щелкните по кнопке Rewind. Щелкните по кнопке Play.
3. Перемещайтесь по слайд-шоу с помощью кнопок Forward и Backup, расположенных на сцене, и наблюдайте, как слайды наплывают и сдвигаются при переходе программы от одного слайда к другому.
Что должно получиться на экране
На рис. 11.22 показано, что вы должны увидеть на сцене, когда упражнение будет завершено.
Рис. 11.22. Сцена завершенного упражнения
Что должно получиться за сценой
На рис. 11.23 показано, как будет выглядеть партитура, когда вы закончите упражнение.
Рис. 11.23. Партитура завершенного упражнения
Пошаговые инструкции
1. Мы начнем с открытия файла, содержащего нужные нам элементы.
а) Выберите File | New .
2. Выберите File | Save As и поместите ваш новый файл в папку с именем SaveWork на вашем жестком диске. Назовите файл MyCars.dir.
3. Если окно Cast не открыто, то откройте его, выбрав Window | Cast.
4. Если партитура не открыта, то откройте ее, выбрав Window | Score.
5. Взгляните на партитуру. Она выглядит похожей на партитуру из последнего упражнения: последовательность графических изображений уже на месте, и маркеры обозначают точки партитуры, в которых меняются эти графические изображения. По существу мы начинаем в том же месте, где оставили последнее упражнение, только с другими слайдами.
6. Нам нужно расширить партитуру, чтобы показать каналы эффектов. В правой части партитуры щелкните по кнопке Hide/Show Effects Channels (Спрятать/Показать Каналы Эффектов), как показано на рис. 11.24.
Рис. 11.24. Кнопка Hide/Show Effects Channels в партитуре
7. Щелкните по кадру 10 в канале партитуры Transition, как показано на рис. 11.25.
Быстрый переход
Вы также можете открыть диалоговое окно Frame Properties: Transition двойным щелчком по ячейке в канале Transition.
Рис. 11.25. Кадр 10 выбран в канале партитуры Transition
8. Давайте создадим переход.
а) Выберите Modify | Frame | Transition (Изменить | Кадр | Переход). Это откроет диалоговое окно Transition.
б) В открывшемся диалоговом окне Frame Properties: Transition щелкните по опции Dissolve (Наплыв) под заголовком Categories (Категории), расположенныe в левой части диалогового окна Frame Properties: Transition, как показано на рис. 11.26.
Рис. 11.26. Диалоговое окно Frame Properties: Transition
Подсказка
Категория Dissolve, возможно, - наиболее используемый набор переходов. Какой тип перехода вы будете использовать - дело вашего вкуса.
в) В правом столбце щелкните по опции Dissolve, Boxy Squares (Наплыв, Кубики).
г) Обратите внимание, что внизу диалогового окна бегунок шкалы Duration (Интервал) показывает, что наплыв произойдет в течение двух секунд. Установите интервал на одну секунду, перетащив бегунок или использовав кнопки со стрелками, как показано на рис. 11.27.
Рис. 11.27. Бегунок Duration
Подсказка
Положение бегунка Duration не является точным показателем времени полного выполнения наплыва. В действительности время в большей степени зависит от быстродействия компьютера и заданного уровня сглаживания. Сглаживание задается установкой размеров «кубиков»,/создаваемых группировкой пикселов. Для более гладкого перехода требуются более мелкие кубики с меньшим количеством пикселов в каждом кубике. При этом будет увеличиваться время перехода от одного кадра к другому.
д) Внизу диалогового окна Frame Properties: Transition вы также можете установить параметр, указывающий Director'y на воздействие в пределах всей сцены или только в пределах ее изменяемой части. Выберите Changing Area Only (Изменять Только Область), Эта опция обычно уменьшает время перехода.
е) Чтобы закрыть диалоговое окно, щелкните по кнопке ОК.
Подсказка
Вы можете изменять переход и его параметры, дважды щелкнув по существующему спрайту перехода в канале Transition. Снова откроется диалоговое окно, и вы сможете провести в нем изменения.
9. Теперь займемся вторым переходом.
а) Выберите кадр 20 в канале Transition.
б) Выберите Modify | Frame | Transition.
в) Поэкспериментируйте с различными переходами и используйте тот, который вам понравится.
г) Измените интервал по вашему усмотрению.
д) Щелкните по кнопке ОК, чтобы закрыть окно.
10. Давайте создадим последний переход.
а) Выберите кадр 30 в канале Transition.
б) Выберите Modify | Frame | Transition.
в) Поэкспериментируйте с различными переходами и используйте тот, который вам понравится.
г) Измените интервал по вашему усмотрению.
д) Щелкните по кнопке ОК, чтобы закрыть окно.
11. Ваша партитура должна выглядеть похожей на ту, что показана на рис. 11.28.
Рис. 11.28. Партитура завершенного упражнения
12. Сохраните вашу работу в папке SaveWork.
13. Перемотайте фильм с помощью Control Panel и щелкните по кнопке Play.
14. Перемещайтесь по программе, выбирая на сцене кнопки Forward и Backup.
15. Отличная работа! Теперь вы поняли, как легко можно добавлять эффекты переходов в ваши проекты.
Реакции на события
Реакции на события — это объекты, состоящие из скриптов Lingo, которые могут быть использованы для добавления взаимодействия в ваш проект. Реакции на события были созданы для облегчения работы со скриптами Lingo. Хорошо написанная реакция на событие позволит вам добавлять скрипт в ваш фильм Director'а без реального составления какой-либо отдельной программы Lingo.
В Director'e есть библиотека готовых к использованию реакций на события, доступ к которым осуществляется переходом Window | Library Palette. Выбор представлен целым рядом категорий. Эти предустановленные скрипты могут добавляться простым выбором реакции на событие в библиотеке и перетаскиванием ее в спрайт в партитуре или в элемент труппы на сцене. Некоторые реакции требуют установки определенных свойств. Свойства являются переменными, содержащимися внутри реакции на событие.
При помощи задаваемых свойств, скрипт Lingo может более определенно взаимодействовать со спрайтом, элементом труппы или кадром, к которому он приписан. Если свойство требует от автора ручного задания свойств для реакции, то при добавлении реакции в партитуру или на сцену появляется диалоговое окно. Позднее в этой книге вы научитесь, как создавать индивидуальные реакции и добавлять описания свойств. Но давайте вначале ознакомимся с более простым процессом применения реакций на события и работы с ними.
Практическое упражнение 11.3: Работа с реакциями на события
В этом упражнении вы создадите меню, в котором пользователь может выбирать цветок, для того чтобы больше о нем узнать. Программа затем переходит на страницу с информацией о выбранном цветке. Пользователь может затем вернуться в меню для выбора следующего цветка или выйти из программы.
В упражнении создается структура меню из последовательности кнопок, предлагающих выбрать тему (цветок). Сделанный выбор укажет головке, на какой маркер передвинуться, чтобы получить информацию о конкретном типе цветка.
Этот тип навигации отличается от навигационного средства из предыдущего упражнения с показом слайдов/Вместо того чтобы переходить к следующему или предыдущему маркеру по ранее применяемой нами линейной схеме, темы теперь могут выбираться в любом порядке, и программа будет переходить к выбранной теме (маркеру) с помощью реакции на событие.
Вы также познакомитесь с реакцией «ролловер». Эта реакция показывает, что кнопка активна, если изменить внешний вид кнопки при наведении на нее курсора.
Когда пользователь перемещает курсор над кнопкой , то элемент труппы кнопки меняется на новый элемент труппы. Например, графическое изображение нормального «верхнего» состояния кнопки может быть заменено графическим изображением «ролловера», в котором вокруг кнопки отображается подсветка. Когда курсор выходит из области кнопки, то вновь появляется первоначальный элемент труппы.
Таким же образом когда кнопку мыши нажимают (событие on mouseDown), то элемент труппы кнопки меняется на элемент труппы, отображающий «нижнее» состояние. Изменение элемента труппы произошло в результате работы скрипта, вызванного обработчиком события. Ниже перечислены обработчики событий, которые могут быть использованы для кнопок навигации.
on mouseEnter: Курсор входит в спрайт. on mouseLeave: Курсор выходит из спрайта. on mouseDown: Кнопка мыши нажата. on mouseUp: Кнопка мыши отпущена (из нажатого состояния).
Эти четыре обработчика событий являются средством создания различных кнопочных меню. При обработке одного из этих событий скрипт Lingo подает команду Director'y, например, установить кнопку в состояние «ролловер» или перейти к определенному маркеру.
Для этого упражнения создана реакция на событие, содержащая скрипт Lingo и обеспечивающая необходимые функции кнопок меню. Эта реакция на событие предложит вам выбрать состояния кнопки (верхнее, нижнее и «ролловер») и выбрать маркер, к которому должна передвинуться головка.
В один спрайт могут быть добавлены несколько реакций на события, обеспечивающие несколько функций. Реакции на события из панели Library часто содержат несколько реакций, и при добавлении библиотечной реакции обеспечиваются сразу несколько функций. Реакция, добавляемая в этом упражнении, будет требовать от вас только выбора нескольких свойств из ниспадающих меню.
Вам не нужно будет работать со скриптом Lingo. Тем не менее, вы должны знать, как выглядит этот скрипт. Скрипт, используемый для изменения состояний кнопки, выглядит следующим образом.
on mouseDown me
Sprite(me.Spritenum).member=buttonDown
end
Давайте посмотрим, из чего состоит этот скрипт, on mouseDown является событием (вызываемым мышью пользователя), которое запускает скрипт. Sprite(me.Spritenum).member является фразой, сообщающей Director'y, что элемент труппы текущего спрайта будет меняться на другой элемент труппы. Другими словами, элемент труппы текущего спрайта будет становиться новым элементом труппы.
buttonDown является переменной (местом памяти), в которой вы будете определять с помощью ниспадающего меню, какое графическое изображение будет в ней размещено. buttonDown будет равно элементу труппы, обеспечивающему «нижнее» состояние кнопки.
Подобный же скрипт предусмотрен для обработчиков событий on mouseEnter и on mouseLeave, изменяющих элементы труппы для соответствующих состояний. При использовании обработчика события on mouseUp подобный этому скрипт позволяет присвоить имя маркеру, к которому кнопка будет обеспечивать переход.
Рассмотрим пример
Давайте посмотрим на завершенное упражнение, чтобы вы лучше поняли, что вам предстоит создать.
1. Измените расположение различных панелей, для того чтобы было все видно.. Вы можете щелкнуть по кнопке Hide/Show Effects Channels в партитуре, чтобы спрятать каналы эффектов и получить больше пространства на экране вашего компьютера.
2. В Control Panel щелкните по кнопке Rewind. Щелкните по кнопке Play.
3. Передвиньте мышь на одну из кнопок. Обратите внимание, что кнопка стала ярко-голубой, то есть перешла в состояние «ролловер». Этот ярко-голубой цвет заменится цветом нормального «верхнего» состояния кнопки, когда вы уберете мышь с кнопки.
4. Выберите одну из кнопок на экране меню. Головка воспроизведения переместится из экрана меню на страницу с темой (на маркер в партитуре), связанной с выбранной вами кнопкой.
5. Щелкните по кнопке Menu на тематической странице, чтобы перейти назад в меню. Выберите другую тему.
6. Посмотрите, как устроена партитура. Каналы в первых пяти кадрах создают структуру меню. Программа состоит из фонового графического изображения и шести кнопок меню. Эти кнопки действуют как средство навигации по остальной части программы. К каждой кнопке подключена реакция на событие. Реакция состоит из ряда скриптов Lingo, обеспечивающих поведение кнопки в определенной манере.
7. После выбора тематической кнопки посмотрите, что делается в партитуре.
8. Когда вы закончите, перейдите к следующему материалу.
Что должно получиться на экране
На рис. 11.29 показано, что будет видно на сцене, когда упражнение будет выполнено .
Рис. 11.29. Сцена завершенного упражнения
Что должно получиться за сценой
На рис. 11.30 показано, как будет выглядеть партитура после выполнения упражнения.
Рис. 11.30. Партитура завершенного упражнения
Пошаговые инструкции
1. Мы начнем с открытия файла, содержащего нужные нам элементы.
а) Выберите File | New.
2. Выберите File | Save As и поместите ваш новый файл в папку с именем Save Work на вашем жестком диске. Назовите файл MyFlowers.dir.
3. Если окно Cast не открыто, то откройте его, выбрав Window | Cast. В нем находятся элементы, необходимые вам для построения структуры меню.
4. Если партитура не открыта, то откройте ее, выбрав Window | Score. Изучите партитуру. В ней имеется шаблон. Это - последовательность маркеров, указывающих на каждую новую страницу с информацией. Первый маркер указывает на экран меню. На сцене размещены кнопки, но реакций на события пока нет.
5. Щелкните по спрайту (кнопке) Roses в партитуре в кадре 1 канала 2.
6. Выберите элемент труппы Menu Button Behavior. Это реакция на событие для кнопок меню.
7. Перетащите элемент труппы Menu Button Behavior из окна Cast в спрайт (кнопку) Roses в партитуре (кадр 1 канала 2) и опустите его прямо наверх кнопки.
8. Откроется диалоговое окно Parameters, предлагающее вам выбрать свойства для реакции.
а) В поле Up Button по умолчанию уже установлены настройки для текущего элемента труппы спрайта roses up и мы оставим их, как они есть.
б) В поле Down Button откройте ниспадающее меню и выберите элемент труппы roses down.
в) В поле Highlite Button (Подсветка Кнопки) откройте ниспадающее меню и выберите элемент труппы roses roll.
г) В поле GoTo Marker (Перейти К Маркеру) откройте ниспадающее меню и выберите маркер roses.
д) Ваше диалоговое окно Parameters должно выглядеть, как показано на рис. 11.31.
Рис. 11.31. Диалоговое окно Parameters для реакции на событие roses
е) Щелкните по кнопке ОК, чтобы закрыть окно. У вас теперь различные элементы труппы связаны с различными состояниями кнопки меню Roses.
9. Давайте попробуем еще один способ подключения имеющейся реакции на событие к спрайту.
а) Щелкните по второй кнопке Tulips в меню сцены.
б) Щелкните по информационной кнопке для реакции на событие в меню информации о свойствах спрайта для выбранной на сцене кнопки Tulips, как показано на рис. 11.32. Если накладной экран для спрайта не активен, то выберите View | Sprite Overlay | Show Info (Вид | Наложить Спрайт | Показать Информацию).
Рис. 11.32. Кнопка информации о реакции на событие на накладном экране спрайта
в) Откроется Property Inspector (справа на экране). Выберите вкладку Behavior в Property Inspector.
г) Щелкните по кнопке Behavior (по вкладке Behavior), как показано на рис. 11.33, и выберите в ниспадающем меню опцию Menu Button Behavior. В меню будут показаны все реакции, размещенные в каждом элементе труппы, входящем в ваш проект.
Рис. 11.33. Кнопка Behavior Popup и вызываемое ею ниспадающее меню
д) Откроется диалоговое окно Parameters. Установите в его полях следующие опции.
Up Button: tulips up. Down Button: tulips down. Highlite Button: tulips roll. GoTo Marker: tulips.
е) Теперь ваше диалоговое окно Parameters должно выглядеть, как показано на рис. 11.34. Щелкните по кнопке ОК, чтобы закрыть это окно.
Рис. 11.34. Диалоговое окно Parameters для реакции tulips
ж) Если вам когда-нибудь понадобится изменить первоначально установленные вами параметры, то вы всегда можете к ним вернуться, выделив нужную реакцию на события в инспекторе Behavior в панели Property Inspector, как показано на рис. 11.35.
Рис. 11.35. Выделенная реакция в инспекторе Behavior
з) Щелкните по кнопке Parameters, показанной на рис. 11.36, чтобы открыть окно с параметрами. При этом откроется то же самое окно Parameters, которое вы использовали для первоначальной установки свойств элемента труппы. Вы теперь можете легко изменить любой нужный вам элемент труппы. (Для того чтобы закрыть окно Parameters, не внося изменений, просто щелкните по кнопке Cancel.)
Рис. 11.36. Кнопка Parameters на вкладке Behavior
10. С помощью любого из только что изученных вами способов (либо в шагах 6-8, либо в шаге 9) подключите элемент труппы Menu Button Behavior к остальным пяти кнопкам и выберите соответствующие свойства для состояний кнопок и необходимый маркер для каждой кнопки.
11. Сохраните вашу работу в папке SaveWork.
12. Вы почти закончили. Теперь осталась лишь функция, обеспечивающая средство перемещения из каждой тематической страницы назад в экран меню.
13. Щелкните по кнопке Menu в кадре 10 канала 2 партитуры (под маркeром Roses). Эта кнопка возвращает пользователя в экран меню, посылая головку к маркеру Menu. Обратите внимание, что этот спрайт растянут от маркера Roses (в кадре 10) до конца последнего маркера Lilies (в кадре 69). Вам, может быть, нужно будет прокрутить партитуру вправо, чтобы увидеть последний кадр. Эта кнопка Menu должна иметь одну и ту же реакцию в каждой тематической странице и посылать головку назад к маркеру Menu. Как вы видите, мы используем этот единственный спрайт для возвращения в меню из любой тематической страницы.
14. Подключите элемент труппы Menu Button Behavior к кнопке Menu, используя любой из изученных способов. Выберите необходимые свойства для состояний кнопки и соответствующий маркер.
15. Сохраните вашу работу в папке Save Work.
16. Щелкните по кнопке Play в Control Panel. Выберите кнопку темы в меню. Вернитесь обратно в меню. Попробуйте все остальные тематические кнопки.
17. Если ваша программа не работает должным образом, то внимательно исследуйте каждую кнопку для того, чтобы убедиться в правильности подключенной к ней реакции на событие.
Примите поздравления! Вы создали интерактивную обучающую программу, позволяющую пользователю выбирать интересующую его тему и затем просматривать информацию по этой теме. После того как пользователь просмотрит конкретную тему, он может вернуться в меню и выбрать другую тему.
С помощью методов, приведенных в упражнениях этой главы, вы можете добавлять дополнительные страницы в каждую тему. Затем вы можете, добавить маркеры в тематическую область и кнопки Forward и Backup для навигации.
Фильм в окне (MIAW - Movie in a Window)
Фильм в окне в точности соответствует своему названию. MIAW позволяет создавать новый фильм Director'a внутри уже существующего фильма Director'a. Вы можете использовать MIAW для создания контрольных точек для фильмов, файлов справки, обслуживающих файлов и других модулей, добавляющих материал для поддержки вашего проекта.
MIAW может быть очень полезным, когда вам нужно обеспечить дополнительный материал и вы не хотите включать его на постоянной основе в ваш проект. Этот модуль также чрезвычайно полезен своей способностью повторного использования сегментов целиком от одного проекта к другому. Отличным примером, иллюстрирующим эти два качества, является пример файла справки, который обеспечивает дополнительной информацией элементы пользовательского интерфейса. Такой справочный файл предоставляет дополнительную информацию по требованию пользователя, и вы можете повторно использовать MIAW без изменений в другом проекте (при условии, если вы стандартизовали ваши средства навигации).
В Практическом упражнении 11.4 вы будете шаг за шагом продвигаться по процессу встраивания файла справки, доступного из основного фильма. При щелчке по кнопке Director будет открывать новый фильм, содержащий файл справки. Этот новый фильм будет запускаться в отдельном окне поверх существующего фильма.
Давайте посмотрим, в чем заключается открытие нового фильма. Быстрым и легким способом сделать это является исполнение команды Lingo open window (открыть окно). Эта команда откроет новый фильм в окне с настройками по умолчанию. Новое окно будет отображаться как стандартное системное окно с кнопками Закрыть, Свернуть, Восстановить/Развернуть и строкой заголовка с именем фильма. Для некоторых целей эти элементы окна могут оказаться существенными, но есть много других элементов настройки, с помощью которых расширены функции MIAW.
Director позволяет вам открыть несколько окон одновременно. Если вы собираетесь это сделать, то, возможно, захотите добавить еще несколько операций в команду открыть окно, которые бы позволили Lingo взаимодействовать с каждым окном. Вы можете выбрать тип окна среди нескольких имеющихся типов окон, в зависимости от назначенных вами функций для MIAW. Этот выбор выполняется командой windowType = [номер типа]. В таблице 11.1 описаны различные типы окон и их номера для команды.
Таблица 11.1. Типы окон и соответствующие номера для команд В таблице 11.2 описаны команды Lingo для MIAW.
Номер команды |
Тип окна |
0 |
Передвигаемое окно с изменяемыми размерами и без поля масштаба. * |
1 |
Окно предупреждения или модальное диалоговое окно (если открыто модальное окно, то нет обращения к другим окнам, пока не закроется это окно). |
2 |
Простое окно без заголовка. |
3 |
Простое окно с затенением без заголовка. |
4 |
Передвигаемое окно без изменения размеров и поля масштаба. |
5 |
Передвигаемое модальное диалоговое окно. |
8 |
Масштабируемое окно без изменения размеров. |
16 |
Окно с закругленными углами. |
49 |
Плавающая палитра в авторском режиме (в проекторах Macintosh значение 49 означает стационарное окно). |
Таблица 11.2. Команды Lingo для перемещения в Window
Команда Lingo |
Функция |
close window |
Закрывает окно, определяемое именем окна41 . |
open window |
Открывает окно, определяемое именем окна. |
forget window |
Стирает в памяти окно, определяемое именем окна. |
windowList |
Возвращает список всех активных окон. |
drawRect |
Определяет размеры фильма, который будет воспроизводиться в окне, определяемом именем окна. |
sourceRect |
Определяет первоначальные размеры фильма, воспроизводимого в окне. |
fileName (свойство окна) |
Называет именем файла Director' а окно, определяемым именем окна. |
tell |
Посылает команду в другое окно, определяемое именем окна. |
JrontWindow |
Определяет, какой фильм будет активным на первом плане, определяемом именем окна. |
title |
Присваивает имя строке заголовка окна, определяемое именем окна. |
modal |
Определяет установку модальности окна. Принимает значения Истина или Ложь. |
titleVisible |
Определяет видимость заголовка в строке заголовка. |
moveToBack |
Перемещает окно, определяемое именем окна, на задний план. |
visible (свойство окна) |
Определяет видимость окна, определяемого именем окна. Принимает значения Истина или Ложь. |
MoveToFront |
Перемещает окно, определяемое именем окна, на передний план. |
WindowPresent (свойство окна) |
Определяет, является ли объект, определяемый именем окна, фильмом в окне (MIAW). Принимает значения Истина или Ложь. |
name (свойство окна) |
Присваивает имя окну, определяемому именем окна. |
windowType |
Определяет тип окна, определяемого именем окна. |
reel (свойство окна) |
Определяет размеры окна, определяемого именем окна. |
Подсказка
Модальность означает активность только одного окна. Если признак модальности установлен в Истину, то все другие элементы (включая интерфейс Director'a), за исключением текущих модальных окон, будут неактивными. Обязательно снабдите окно этого типа кнопкой Закрыть.
Практическое упражнение 11.4: Работа с MIAW
Что должно получиться на экране На рис. 11.37 показано, как будет выглядеть сцена завершенного вами упражнения.
2. Выберите File | Save As и поместите ваш новый файл в папку с именем SaveWork на вашем жестком диске. Назовите файл MyMovie.dir. 3. Если окно Cast не открыто, то откройте его, выбрав Window | Cast. В нем находятся элементы, необходимые вам для построения структуры меню. 4. Если партитура не открыта, то откройте ее, выбрав Window | Score. 5. Щелкните по кнопке Open Window на сцене. 6. Behavior Inspector должен быть открыт. Если нет, то выберите Window | Behavior Inspector. 7. Щелкните по кнопке Behavior Popup и в ниспадающем меню выберите New Behavior. 8. В открывшемся диалоговом окне напечатайте имя реакции на событие (Open Window Behavior) и щелкните по кнопке ОК. 9. Щелкните по кнопке Script Window на вкладке Behavior (см. рис. 11.39), чтобы открыть окно Script.
Подсказка on mouseUp me sprite(me.spritenum).member = «up button» global newWindow newWindow = window «New Window» window («New Window»).filename = «SmallWin2.dir» window («New Window»).windowType = 2 window («New Window»).modal = True window («New Window»).rect = rect(the\ stageLeft+100, the stageTop+120, the\ stageRight-100, the stageBottom-80) open newWindow end on mouseDown me sprite(me.spritenum).member = «down button» end 11. Дважды сверьте то, что вы напечатали в окне Script, с образцом скрипта. Когда закончите сверку, щелкните по кнопке Recompile, а затем щелкните по кнопке X, чтобы закрыть окно. 12. Сохраните вашу работу в папке SaveWork. 13. Давайте взглянем поближе на то, что вы только что напечатали.
14. Важная операция: Выберите File | Save As и сохраните файл, используя текущее имя (SmallWin2.dir) в папке SaveWork, в которой также находится ваш файл MyMovie.dir. Эти два файла (MyMovie.dir and SmallWin2.dir) должны быть в одной папке, иначе Director не найдет вызываемый фильм MIAW. 15. Щелкните по кнопке Close Window на сцене. 16. Откройте Behavior Inspector, выбрав Window | Behavior Inspector. 17. Выберите New Behavior во всплывающем меню Behavior. 18. Назовите реакцию на событие Close Window Behavior и затем щелкните по кнопке ОК. 19. Щелкните по кнопке Script, чтобы открыть окно Script. 20. Напечатайте следующий скрипт. on mouseUp me global newWindow close newWindow forget newWindow end Подсказка Если вы увидите открытое диалоговое окно, сообщающее об ошибке в скрипте, то, вероятнее всего, вы допустили ошибку при печатании кода. Ошибку можно найти, внимательно сверяя строку в этом окне с кодом, приведенным в шаге 10, если ошибка возникла в файле MyMovie, или с кодом, приведенным в шаге 21, если ошибка возникла в SmallWin2.dir. Наиболее часто ошибки происходят из-за неправильного написания слов команд (в том числе заглавных букв, т.к. нужно учитывать регистр) и лишних пробелов.
22. Дважды сверьте то, что вы напечатали в окне Script, с образцом скрипта. Когда закончите сверку, щелкните по кнопке Recompile, а затем щелкните по кнопке X, чтобы закрыть окно. 23. Сохраните файл под именем SmallWin2.dir в папке SaveWork. 24. Откройте файл MyMovie.dir в папке SaveWork. 25. Щелкните по кнопке Play в Control Panel. Щелкните по кнопке Open Window на сцене. В новом открывшемся окне щелкните по кнопке Close Window. |