Основы пользовательского интерфейса Flash

Основы пользовательского интерфейса Flash. Рассмотрим базовые принципы работы с пакетом Macromedia Flash. Итак, нам нужно создать изображение.

Статичное или анимированное то есть, фильм, простое или интерактивное фактически, программу - неважно. Что делать? Прежде всего, четко представлять, что мы хотим сделать. Это означает, что нам нужно предварительно спланировать свое пока еще не существующее изображение. Лучше всего нарисовать его на бумаге, хотя это необязательно.

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

Именно здесь мы создадим все элементы, которые будут отвечать только за интерактивность. И. конечисх напишем сценарии на языке ActionScript, которые и будут реализовывать эту интерактивность.

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

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

Эта информация сильно оптимизирована, чтобы уменьшить размер файла и ускорить его обработку. Такие файлы называются распространяемыми файлами Shockwave Flash. He перепутайте эти два формата данных - они совершенно разные и служат разным целям, хотя и тот, и другой предназначены для сохранения графики.

Формально последним этапом создания Flash-изображения является его распространение. Но мы не будет рассматривать, как это осуществляется. В конце концов, это проблемы уже не Flash. Здесь мы опишем только, как и с помощью какого программного обеспечения можно просмотреть готовое изображение. Скажем сразу, что изображение Flash можно экспортировать в другом формате, например, Apple QuickTime, AVI или тех же GIF или JPEG. Правда, кое-какая информация при этом потеряется, в частности, сценарии ActionScript.

Поэтому в другие, альтернативные Shockwave Flash, форматы стоит экспортировать только ту графику, которая не имеет никаких интерактивных возможностей. В отличие от изображений GIF и JPEG, поддерживаемых всеми существующими на данный момент программами Web-обозревателей, изображение Shockwave Flash для просмотра требует специальной программы - проигрыватвля Shockwave Flash. Этот проигрыватель может быть встроен в Web-обозреватель в качестве модуля расширения или существовать в виде программы, запускаемой отдельно. В этом формат Shockwave Flash схож с форматами Apple QuickTime и AVI, для которых также нужны отдельные проигрыватели, в первом случае - одноименный проигрыватель фирмы Apple, во втором - Универсальный проигрыватель фирмы Microsoft, поставляемый в составе Windows.

Но с проблемами распространения своего творчества мы столкнемся еще не скоро.

Пока что мы не знакомы с самой средой Flash. Познакомимся же с ней поближе. Главное или основное окно программы Macromedia Flash показано на рис. 1.1. Рассмотрим его подробнее. Скажем сразу, что Flash - приложение с многодокументным интерфейсом или просто многодокументное приложение. Это значит, что вы можете открыть в одном и том же рабочем окне программы сразу несколько документов. В этом случае окна, содержащие открытые документы, открываются внутри большого окна самой программы. К многодокументным приложениям также относятся Microsoft Word и Adobe Photoshop.

Этим они отличаются от приложений с однодокументным интерфейсом однодокументных приложений, в которых можно открыть только один документ, а чтобы открыть второй, нужно запускать вторую копию приложения. Примерами однодокументных приложений являются, в частности, текстовый редактор Microsoft WordPad и графический редактор Microsoft Paint, поставляемые в составе Windows. Окно документа Flash занимает большую часть окна программы.

Его заголовок совпадает с именем открытого в нем файла. Вы можете перемещать, свертывать и развертывать это окно и изменять его размеры, в общем, проделывать с ним те же манипуляции, что и с любым другим окном Windows. Единственное исключение вы не можете вытащить это окно за пределы окна программы так называемого родительского окна. При первом запуске Flash MX выводит на экран еще одно небольшое окно, показанное на рис. 1.2. Это так называемое приглашение, содержащее текст, предлагающий пользователю прочитать некоторые справочные данные или запустить интерактивные презентации, объясняющие, как работать во Flash. Вы можете просмотреть их или сразу же закрыть это окно. При последующих запусках окно-приглашение появляться больше не будет. Левее окна документа находится главный инструментарий Flash или просто инструментарий.

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

Нажимая кнопки, вы можете выбирать те или иные инструменты, предлагаемые Flash для рисования или правки графики. Если вы захватите инструментарий мышью за особую ручку, отображаемую в виде набора точек на темно-сером фоне в ее верхней части рис. 1.3 , то он отклеится от края родительского окна и превратится в независимое окно рис. 1.4 . Таким образом вы можете увеличить площадь окна документа Flash. Можно перемещать это окно по экрану так же, как любое другое окно. Есть даже возможность вытащить его за пределы окна программы, что недоступно для окон документов. Однако менять размеры окна, содержащего инструментарий, вы не можете - они всегда постоянны.

Если же вы не хотите, чтобы инструментарий маячил постоянно перед глазами, вновь приклейте его к краю окна. Для этого поднесите его мышью к левому или правому краю родительского окна и оставьте там. Отследить момент приклеивания и отклеивания очень просто если при перетаскивании инструментарий меняет толстый контур на тонкий, то при отпускании кнопки мыши он будет приклеен. И наоборот, если тонкий контур меняется на толстый, инструментарий будет отклеен. Чтобы инструментарий ни в коем случае не приклеивался к краю окна, при его перетаскивании удерживайте нажатой клавишу Ctrl. Если вы хорошенько присмотритесь к инструментарию, то увидите, что он разделен на четыре области.

Перечислим их сверху вниз. 1. Область основных инструментов заголовок Tools. Здесь находятся кнопки, предоставляющие доступ ко всем инструментам, что предусмотрены во Flash для рисования и правки уже нарисованного. 2. Область вспомогательных инструментов заголовок View. Здесь находятся всего две кнопки, которые мы рассмотрим в этой главе. 3. Область задания цвета заголовок Colors. Здесь находятся элементы управления, позволяющие вам задавать цвет. 4. Область модификаторов заголовок Options. Здесь находятся кнопки, предоставляющие доступ к модификаторам - дополнительным режимам, предусмотренным в том или ином выбранном в данный момент инструменте.

Не всегда в данный момент времени в инструментарии присутствуют все четыре области.

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

Большинство панелей имеют так называемое дополнительное меню. Оно открывается при щелчке мышью по небольшой кнопке, расположенной в правом верхнем углу панели и имеющей изображение списка из трех позиций и небольшой стрелки, направленной вниз рис. 1.9 . В дополнительном меню находятся пункты, выполняющие редко используемые команды. Пункт Tools служит для вывода на экран или скрытия главного инструментария. Если слева от имени этого пункта стоит галочка, это значит, что инструментарий выведен на экран или, как еще говорят, что соответствующий пункт меню включен. Чтобы убрать его, снова выберите этот пункт инструментарий исчезнет вместе с галочкой. Если впоследствии вы еще раз выберете этот пункт, инструментарий и галочка снова появятся.

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

Далее в книге мы рассмотрим эти пункты вместе с рассмотрением той или иной панели. Если вам для какой-то цели нужно закрыть все панели и инструментарии, например, чтобы просмотреть без помехи все изображение, выберите пункт Close All Panels. Все панели будут тут же закрыты. Но имейте в виду, что открывать вам их придется вручную. Если же вам нужно не закрыть безвозвратно, а просто скрыть на время все панели и инструментарии, выберите пункт Hide Panels в меню View. Этот пункт работает как выключатель, т. е. при первом выборе он скрывает все панели, а при втором - снова выводит их на экран.

Вы также можете нажать клавиши ТаЬ или F4 - это проще и быстрее, чем лезть в меню. Есть еще один весьма удобный способ организовать свое рабочее место пользовательские раскладки панелей. В двух словах это можно объяснить следующим образом. Вы открываете нужные вам в данный момент панели, располагаете на экране так, как вам удобно, и сохраняете их расположение в настройках Flash. После этого вы можете закрыть их совсем или переместить на другие места.

Но чтобы вернуться к прежнему состоянию, вам достаточно будет выбрать сохраненную ранее раскладку, и все панели выстроятся на экране так, как они были выстроены при сохранении выбранной раскладки. Таких сохраненных раскладок может быть сколько угодно. Чтобы сохранить раскладку панелей, выберите пункт Save Panel Layout. На экране появится диалоговое окно Save Panel Layout рис. 1.12 . Введите в поле ввода Name имя сохраняемой раскладки и нажмите кнопку ОК. Если вы передумали сохранять раскладку, нажмите кнопку Cancel.

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

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

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

Глава 2.