Macromedia Dreamweaver MX

Графика Macromedia Flash

Выше мы уже упоминали мощнейший пакет векторной Web-графики и анимации Macromedia Flash, "родного брата" Dreamweaver. "Братство" это проявляется не только в общем "родителе" — фирме Macromedia, но и в тесной интеграции двух пакетов. В частности, если у вас на компьютере установлены и Dreamweaver, и Flash, вы можете запустить Flash из Dream­weaver, нарисовать изображение и тут же вставить его в Web-страницу, от­крытую в окне Dreamweaver. Также Dreamweaver предлагает пользователю несколько "заготовок" различных надписей и кнопок, выполненных в фор­мате Flash, которые вы также можете поместить на страницу.

Но даже если вы не имеете установленного на компьютере пакета Flash, вы все равно сможете размещать на своих страницах надписи и кнопки в фор­мате Flash. Надписи Flash — это уже знакомые вам изображения - гиперссылки, но выполненные в формате Flash. Что касается кнопок Flash, то это просто активные изображения, имеющие вид кнопок и "нажимаю­щиеся" при щелчке на них.

Если у вас установлена достаточно новая программа Web-обозревателя, то необходимый модуль расширения уже находится в ее составе. В противном случае вам придется посетить Web-сайт Macromedia, чтобы найти соответст­вующую версию проигрывателя. Так или иначе, вам время от времени все равно придется туда заходить, чтобы найти "свежий" проигрыватель, т. к. Flash постоянно обновляется, "обрастает" новыми возможностями, которые не поддерживаются старыми версиями проигрывателя.

Сейчас мы рассмотрим, какие возможности работы с Flash-изображениями предлагает нам Dreamweaver.

Для такого случая мы снова создадим небольшую учебную страничку. Стра­ница со сведениями об авторе уже готова (или почти готова), так что не стоит пока над ней издеваться. Для наших экспериментов будет достаточно обычной пустой странички. Но, прежде чем помещать на нее Flash - изображения, сохраните ее в файле 4.3.htm, в противном случае Dream­weaver сам напомнит вам об этом. И закройте эту страницу.

Увы, увы, опять приходится говорить об ошибках, как бы нам этого не хо­телось... Конечно, иногда ошибки бывают маленькими и незаметными, но Dreamweaver MX — не тот случай. Из-за досаднейшей промашки разработ­чиков он не всегда корректно воспринимает имена файлов и папок, на­
бранные русскими буквами. Поэтому проверьте имя папки, в которой вы сохранили Web-страницу 4.3.htm, и если ее имя или имя одной из папок верхнего уровня имеет русские имена, перенесите файл страницы в другую папку, имеющую в имени только английские имена и цифры. Теперь може­те открывать вашу страницу 4.3.htm.

Сначала рассмотрим вставку надписи Flash — изображения в формате Flash, содержащего строку текста и работающего как изображение-гиперссылка.

Надпись Flash создается с помощью кнопки Flash Text (рис. 4.16) страницы Media панели объектов. Вы также можете воспользоваться пунктом Flash Text подменю Interactive Images меню Insert. Параметры создаваемой надписи Flash задаются в диалоговом окне Insert Flash Text, показанном на рис. 4.17.

В раскрывающемся списке Font выбирается шрифт, которым будет написан текст надписи. В поле ввода Size задается его размер в пунктах. Кнопки - выключатели В и / позволяют сделать шрифт текста жирным или курсив­ным. Три кнопки с изображением выровненных влево, по центру и вправо

Абзацев задают соответствующее выравнивание текста. Селектор цвета Color задает цвет текста, a Rollover Color — цвет, который примет текст, когда пользователь поместит над ним курсор мыши. В области редактирования Text вводится собственно текст надписи. Если флажок Show Font включен (а он включен по умолчанию), содержимое этой области редактирования показывается так, как оно будет выглядеть на Web-странице.

Поле ввода Lin к служит для задания интернет-адреса, по которому произой­дет переход, если пользователь щелкнет на надписи. Также предусмотрена кнопка Browse. Цель гиперссылки задается с помощью раскрывающегося списка Target.

Селектор цвета Bg Color задает цвет фона надписи.

Последнее поле ввода Save As позволяет задать имя файла, где будет сохра­нена созданная надпись. По умолчанию Dreamweaver подставляет туда ав­томатически созданное имя файла, которое вы можете изменить, если хоти­те. Кнопка Browse вызывает на экран стандартное диалоговое окно сохра­нения файла Windows.

Наберите в области редактирования какой-либо текст, например, "Macro­media". Введите в поле ввода Link какой-нибудь интернет-адрес, например Http://www. macromedia. com. Выберите шрифт и цвета по вкусу. И нажмите кнопку ОК. То, что у вас получится, показано на рис. 4.18.

Редактор свойств позволяет отредактировать множество параметров надписи Flash (рис. 4.19). Как и у обычного изображения, доступно изменение гео­метрических размеров (поля ввода W и Н), выравнивания (раскрывающийся список Align и одноименное подменю в контекстном меню), горизонтальное и вертикальное расстояние до текста (поля ввода Н Space и У Space) и сброс размеров в изначальное состояние (кнопка Reset Size).

Остальные элементы управления задают специфичные для изображений Flash параметры. Кнопка Edit (а также одноименный пункт контекстного меню) выводит на экран диалоговое окно создания надписи Flash, где вы сможете ее отредактировать. В поле ввода File задается имя файла, где хра­нится Flash-изображение; если у вас есть другие файлы надписей Flash, оно вам может пригодиться. Селектор цвета Bg позволяет быстро сменить цвет фона надписи Flash.

Теперь обратим внимание на кнопку Play. Как вы помните, чтобы протес­тировать активное изображение, созданное нами выше, мы были вынужде­ны загрузить страницу в Web-обозревателе, т. к. Dreamweaver не поддержи­вает выполнение сценариев. Изображения формата Flash не используют сценариев и поэтому могут быть просмотрены в самом Dreamweaver. Для того чтобы запустить просмотр, щелкните на кнопке Play. После этого рам­ка выделения с маркерами изменения размеров пропадет и вы, если помес­тите курсор мыши над надписью, увидите, что ее цвет изменился. Вот толь­ко на щелчки она не реагирует.

Заметьте, что при этом кнопка Play изменит название на Stop. Чтобы вер­нуть надпись Flash в режим редактирования из режима просмотра, щелкни­те по ней.

Вместо нажатия кнопки Play вы можете выбрать пункт Play подменю Plugins меню View или нажать комбинацию клавиш <Ctrl>+<Alt>+<P>. Пункт Play All того же подменю (или комбинация клавиш <Ctrl>+<Alt>+ +<Shift>+<P>) запускают просмотр всех изображений Flash, имеющихся на странице. Соответственно, пункт Stop (или комбинация клавиш <Ctrl>+ +<Alt>+<X>) останавливает просмотр текущего изображения Flash, a Stop All (или комбинация клавиш <Ctrl>+<Alt>+<Shift>+<X> — тренируйте свои пальцы) — всех изображений Flash на данной странице.

Раскрывающийся список Quality позволяет задать качество отображения изображения Flash. По умолчанию выбран пункт High — высокое качество. Однако в этом случае модуль просмотра изображений Flash будет требовать слишком много системных ресурсов, и если вы планируете распространять свои Flash-творения среди владельцев маломощных компьютеров, то стоит выбрать пункт Low. Еще два пункта позволят достичь компромисса: Auto High сначала устанавливает высокое качество, а потом при необходимости понижает, a Auto Low — наоборот.

Раскрывающийся список Scale задает, как изображение Flash отображается в границах, установленных параметрами W и Н. Выбранный по умолчанию пункт Default (Show all) заставляют проигрыватель Flash изменять масштаб изображения, "впихивая" его в нужные размеры, и предотвращать его иска­жение, соблюдая пропорции. Пункт No border выводит изображение в ори­гинальном масштабе; если при этом размеры W и Н слишком малы, часть изображения может не быть видна. И, наконец, пункт Exact fit подобен Default (Show all), но не предотвращает искажение масштаба.

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

Теперь поговорим о кнопках Flash. Создайте новую Web-страницу и сохра­ните ее под именем 4.4.htm. (Впрочем, вы можете стереть надпись Flash, вставленную нами ранее на страницу 4.3.htm, очистив ее.)

Кнопка Flash создается с помощью кнопки Flash Button страницы Media панели объектов (см. рис. 4.20). Вы также можете воспользоваться пунктом Flash Button подменю Interactive Images меню Insert. Параметры создавае­мой кнопки Flash задаются в диалоговом окне Insert Flash Button, показан­ном на рис. 4.21.

Здесь вы видите, прежде всего, большой список Style, где представлены все доступные в Dreamweaver стили кнопок Flash. Мы не будем их все рассмат­ривать, т. к. описание получится большое и маловразумительное. Лучше
всего вам будет просто посмотреть на них воочию, ведь правду говорят, что лучше один раз увидеть, чем сто раз услышать. Поможет вам в этом панель предварительного просмотра, расположенная выше этого списка.

Текст кнопки вводится в поле ввода Button Text. Остальные элементы управления знакомы вам по диалоговому окну Insert Flash Text (см. рис. 4.17), и выполняют они те же самые функции.

Давайте введем в поле ввода Button Text строку Macromedia, в поле ввода Lin к — Http://www. macromedia. com, выберем какой-нибудь приглянувшийся стиль кнопки и нажмем кнопку ОК. Получившаяся кнопка может выгля­деть, например, так — см. рис. 4.22.

Дизайнеры фирмы Macromedia приготовили для вас прекрасные шаблоны для создания Flash-кнопок. Не верите? Нажмите кнопку Play на редакторе свойств, поднесите курсор мыши к кнопке и посмотрите, что получится. К сожалению, печатная иллюстрация не может передать движение...

Редактор свойств позволит вам изменить различные параметры кнопки Flash. Все они аналогичны параметрам надписи Flash, да и всем изображе­ниям Flash.

Примечание )

Изображения Flash помещаются на страницу с помощью парного тега <object>. Этот тег служит для размещения не только изображений Flash, но и любых внедренных объектов, для которых в системе установлены модули про­смотра. Таким образом можно, например, разместить на Web-странице доку­мент MS Word или видеофильм. Тег <object> имеет множество атрибутов, ко­торые служат для задания типа внедренного объекта, интернет-адреса дистри­бутивного файла модуля просмотра, служащего для его обработки, геометрических размеров внедренного объекта и т. п. Мы не будем рассматри­вать эти атрибуты — вы можете найти их описания в электронном руководстве по HTML, поставляемом в составе Dreamweaver.

Выше говорилось, что тег <object> парный. Внутри этого тега помещаются описания различных параметров внедренного объекта (не самого тега <object>). Каждый параметр описывается с помощью одинарного тега <param>, имеющего атрибуты name (имя параметра) и value (значение параметра).

В дальнейшем мы вернемся к тегу <object>, когда будем рассматривать вне­дренные объекты.

Ну и, разумеется, вы можете поместить на Web-страницу любое изображе­ние Flash, созданное вами или кем-то другим. Это выполняется очень про­сто. Нажмите кнопку Flash (рис. 4.23) вкладки Common панели объектов (эта же кнопка находится на вкладке Media). Вы также можете выбрать пункт Flash подменю Media меню Insert или нажать комбинацию клавиш <Ctrl>+<Alt>+<F>. На экране появится уже знакомое вам диалоговое окно Select File, где вы сможете выбрать нужный файл SWF.

Рис. 4.23. Кнопка Flash панели объектов

Графика Macromedia Shockwave

Осталось сказать чуть-чуть о других форматах поддерживаемых данных.

Macromedia Shockwave — непосредственный предшественник Flash. Что­бы поместить файл в этом формате на Web-страницу, нажмите кнопку Shockwave (рис. 4.24) вкладки Media панели объектов, выберите пункт Shockwave подменю Media меню Insert или нажмите комбинацию клавиш <Ctrl>+<Alt>+<D>. После этого на экране появится диалоговое окно Select File, где вы сможете найти и выбрать нужный файл.

Рис. 4.24. Кнопка Shockwave панели объектов

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