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

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

Если необходимо, чтобы, например, кнопки, находящиеся в одном углу экрана, управляли анимацией в другом, а текст был посередине, это не является препятствием к "разделению" ролика на два! Управлять одним роликом из другого можно, используя функции JavaScript. Для их вызова из ролика применяется оператор fscommand. Об этом еще пойдет речь в главе 7.

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

Текстовые поля

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

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

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

В текстовое поле можно ввести любой текст (рис. 2.89). Для того, чтобы выбрать начертание и размер шрифта, служит панель Character (Оформление текста) (рис. 2.90).

Рис. 2.89. Текстовое поле

Рис. 2.90. Вспомогательная панель для настройки шрифта

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

Рис. 2.91. Числовые настройки легко меняются с помощью движка

Кроме всего перечисленного, на панели Character (Оформление текста) имеется флажок Kern (С кернингом), который должен включать режим автоматического кернинга. Результат этого показан на рис. 2.92: сверху приведен образец текста без кернинга, а внизу - с кернингом. Особенно хорошо это заметно на стыке букв "T" и "e".

Рис. 2.92. Применение кернинга

К сожалению, автоматический кернинг работоспособен далеко не на всех шрифтах и никогда не работает на кириллице. Кстати, вполне может случиться, что на одном из двух родственных шрифтов этот режим работает, а на другом - нет (например, таковы шрифты Times New Roman и Times New Roman Cyr).

Теперь несколько слов о выделении текста. Внутри текстового поля можно выделить произвольный текстовый фрагмент обычным для текстовых редакторов способом (протягивание мыши при нажатой левой кнопке). Кроме того, двойной щелчок выделяет слово, а сочетание CTRL+A - весь абзац.

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

Рис. 2.93. Вспомогательная панель для форматирования абзацев

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

Виды текстовых полей

Статическое текстовое поле предназначается для отображения статического текста. Этот текст не может изменяться. Его можно только выделять его для копирования в буфер обмена. Правда и это возможно только в том случае, если на вспомогательной панели Text Options (Параметры текста) установлен флажок Selectable (Выбираемый).

Необходимо отметить, что в программе Flash текстовые поля могут иметь фиксированную ширину или быть расширяемыми. Расширяемое поле автоматически меняет свою ширину в зависимости от содержимого, а поле фиксированной ширины - нет. При создании текстового поля щелчком мыши оно изначально оказывается расширяемым. Если же "потянуть" мышью за его манипулятор, чтобы вручную расширить или сузить, поле приобретает фиксированную ширину.

Определить, имеет ли то или иное текстовое поле фиксированную ширину, легко. Текстовые поля фиксированной ширины имеют квадратный манипулятор, а расширяемые - круглый. У статических полей этот манипулятор расположен в правом верхнем углу, а у остальных - в правом нижнем. Чтобы поле фиксированной ширины сделать расширяемым, достаточно просто дважды щелкнуть на его манипуляторе.

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

Однако следует иметь в виду, что если в ролике используются наклоненные и вертикальные текстовые поля, то в файл ролика необходимо включить контуры шрифтов. Для этого следует нажать одну из кнопок Embed Fonts (Внедрить шрифты) на вспомогательной панели Text Options (Параметры текста), иначе наклонные текстовые поля вообще не отобразятся, как будто их нет.

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

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

Динамические текстовые поля также отображают текст, но этот текст может изменяться по ходу проигрывания ролика. Чтобы превратить текстовое поле в динамическое, следует выбрать пункт Dynamic Text (Дикамический текст) в раскрывающемся списке панели Text options (Параметры текста) (рис. 2.94).

Рис. 2.94. Вспомогательная панель для установки типа текстового поля и его настройки

Программное изменение динамических полей

Как видите, в этом режиме на панели появилось поле Variable (Переменная). Если туда ничего не ввести, то динамический режим текстового поля не будет иметь почти никакого смысла. В поле Variable (Переменная) нужно указать имя переменной, которая соответствует содержимому этого текстового поля. Например, напишем в текстовом поле слово Текст, сделаем это поле динамическим и введем в поле Variable (Переменная) значение mytext. Теперь, если в какой-то момент присвоить этой переменной другое значение, например, написать

mytext="Слово";

то содержимое текстового поля изменится, то есть вместо надписи Текст там появится надпись Слово! Таким образом можно организовать что-то вроде собственной строки состояния или динамической подсказки, поместить в ролик электронные часы и многое другое. Так как вы еще не знакомы с внутренним языком сценариев Flash (обычно его называют ActionScript), могут возникнуть естественные вопросы: где писать приведенный выше код, какие вообще бывают переменные, что с ними делать... Потерпите немного, скоро все эти вопросы будут рассмотрены очень подробно, так как большая часть этой книги (начиная с главы 5) посвящена именно языку ActionScript.

Настройка динамических полей

Помимо возможности изменения содержимого, динамические текстовые поля обладают еще рядом особенностей. Во-первых, их можно сделать однострочными или многострочными, выбрав из раскрывающегося списка на панели Text Options (Параметры текста) пункт Single Line (Одна строка) или Multiline (Многострочное) соответственно. Для многострочных полей доступен флажок Word Wrap (Перенос по словам), включив который, можно "приказать" программе автоматически переносить ниже не помещающиеся в одну строку слова.

Во-вторых, вокруг динамических полей можно прорисовать рамку, обозначающую их границу. Рамка включается с помощью переключателя Border/Bg (Граница/фон) на той же самой панели Text Options (Параметры текста).

Однако самое интересное, что в динамические текстовые поля можно включать теги HTML для форматирования текста. Чтобы проигрыватель Flash правильно распознал их, нужно установить на вспомогательной панели Text Options (Параметры текста) флажок HTML.

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

Например, если создать пустое текстовое поле, определить его как динамическое, сопоставить ему имя переменной t1, а затем в первом кадре написать (если пока не совсем понятно, где именно это писать, обратитесь к главе 5).

t1="<В>Это</В> <I>текстовое</I> <U>поле</U>, <FONT SIZE='-30'> содержащее HTML-форматирование</FONT>!";

то при просмотре или публикации ролика (например, по нажатию CTRL+ENTER) можно увидеть то, что показано на рис. 2.95. Как видите, это вполне похоже на обычную разметку с помощью тегов HTML.

Рис. 2.95. В текстовых полях можно употреблять теги HTML

Правда, пока что, к сожалению, использование здесь тегов HTML очень ограничено. Можно использовать только теги <А>, <В>, <I>, <U>, <P>, а также <FONT> с атрибутами FACE=, SIZE= и COLOR=. Но и это уже немало. Более того, использование тега <A> позволяет включать в текстовые поля самые настоящие гиперссылки, причем как гиперссылка действует уже не весь блок, как при использовании поля URL панели Character (Оформление текста), а только нужная часть текста. Автоматически, правда, эти гиперссылки не подчеркиваются и вообще не выделяются никак. Единственное, что их визуально отличает - указатель мыши при наведении превращается в "руку". Но их можно выделить вручную, например, с помощью тегов <U> и <FONT COLOR=>.

Еще необходимо заметить, что размер шрифта здесь устанавливается в пикселах, а не в традиционных для HTML "условных единицах". Этим и объясняется непривычное для глаза знатока HTML сочетание <FONT SIZE='-30'> из данного примера.

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

Чтобы превратить текстовое поле в поле ввода, выберите в раскрывающемся списке на панели Text Options (Параметры текста) пункт Input Text (Ввод текста). Теперь пользователь сможет ввести в это поле какой-нибудь текст, и все, что он ввел, присваивается соответствующей переменной. Обычно после этого имеет смысл отправить введенную информацию на сервер для обработки сценарием CGI. Для этого можно предусмотреть в ролике специальную кнопку (о кнопках речь пойдет в главе 4 и последующих) или просто отследить нажатие на клавишу ENTER.

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

Настройка полей ввода

Упомянем еще две особенности полей ввода. Во-первых, можно ограничить максимальное число символов, вводимых в поле. Это ограничение задается полем Мах Chars (Всего символов) на панели Text Options (Параметры текста). Если значение этого поля установлено в 0, количество вводимых символов не ограничивается (разумеется, на практике какое-то ограничение все же существует, но допустимое число символов очень велико).

Наконец, при выборе режима Input Text (Ввод текста) во втором раскрывающемся списке на панели Text Options (Параметры текста) появляется еще один пункт - Password (Пароль). Если выбрать этот пункт, то в поле ввода каждый символ отображается в виде звездочки, как это принято в большинстве систем для ввода пароля. Разумеется, не следует из этого делать вывод, что программа Flash предназначена для работы с конфиденциальной информацией. Нет, никакой защиты там нет, и все данные хранятся в открытом виде. Так что звездочки в поле пароля - это только традиционная защита от "подсматривания" паролей на экране.

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

Ну, а если захочется сделать с текстом что-нибудь особенное, например, анимировать его, заставляя постепенно проявляться или же плавно превращать одно слово в другое, то, скорее всего, текст придется преобразовать в обычные графические объекты - Modify Break Apart (Изменить Разделить) или клавиши CTRL+B - и далее уже работать с ним, как с контурами и заливками (правда, в этом случае редактировать текст обычным образом уже не удастся). Кстати, как раз об анимации и пойдет рассказ в следующей главе.

В заключение рассказа о работе со статическими объектами в программе Flash следует упомянуть еще об одном удобном инструменте для работы, подчас позволяющем осуществить не очень очевидные решения. Речь идет о вспомогательной панели Align (Выравнивание), которая позволяет ровно размещать объекты в рабочей области.

Сначала рассмотрим панель Align (Выравнивание) в общих чертах, а затем приведем пример не совсем тривиального ее использования.

Чтобы вызвать вспомогательную панель Align (Выравнивание) (если ее еще нет на экране), следует нажать комбинацию клавиш CTRL+K или дать команду Window Panels Align (Окно Панели Выравнивание). Эта панель показана на рис. 2.96. Она предназначена для автоматического выравнивания объектов.

Рис. 2.96. Вспомогательная панель для выравнивания объектов

Пользоваться панелью Align (Выравнивание) очень легко. Вначале надо выделить те объекты, которые необходимо выровнять, а затем нажать одну из 18 кнопок выравнивания.

Рис. 2.97. Выравнивание объектов по вертикали. Слева - исходное расположение

Справа в верхнем ряду расположены кнопки для выравнивания по горизонтали; по верхнему краю, по центру и по нижнему краю (рис. 2.98).

Рис. 2.98. Выравнивание объектов по горизонтали

Следующий ряд кнопок предназначен для распределения объектов. При распределении объекты располагаются на равных расстояниях друг от друга в пределах границ, заданных крайними объектами. Скажем, распределение по левому краю (первая кнопка во втором ряду) означает, что левые крайние точки всех объектов располагаются на одинаковом расстоянии друг от друга. При распределении по центру на равном расстоянии размещаются центральные точки объектов (в горизонтальной или вертикальной плоскости) и так далее. Пример такого распределения объектов по вертикали приведен на рис. 2.99, а по горизонтали - на рис. 2.100.

Рис. 2.99. Распределение объектов по вертикали

Рис. 2.100. Распределение объектов по горизонтали

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

Рис. 2.101. Выравнивание размеров объектов

Последние две кнопки панели Align (Выравнивание) предназначены для выравнивания величины горизонтальных или вертикальных промежутков между объектами. При этом крайние объекты остаются на местах, а все остальные сдвигаются, соответственно, по горизонтали или вертикали так, чтобы расстояния (промежутки) между этими объектами стали одинаковыми (рис. 2.102).

Рис. 3.103. Выравнивание расстояний между объектами

Рис. 3.103. Выравнивание горизонтальных интервалов относительно сцены

В качестве центра также принимается центр всего ролика, а при приведении к единому размеру объекты растягиваются на всю ширину или высоту ролика. Например, если нарисовать в любом месте рабочей области небольшой прямоугольник, а затем, включив переключатель To Stage (Относительно сцены), центрировать его последовательно по ширине и высоте и затем нажать кнопку выравнивания по размерам, то прямоугольник как раз займет всю рабочую область.

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

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

Вначале создадим окружность и удалим из нее заливку. Затем где-нибудь в стороне создадим горизонтальную линию, по длине равную или чуть превосходящую диаметр нашей окружности. Кстати, проверить или задать этот параметр можно на вспомогательной панели Info (Сведения). Получится примерно то. что изображено на рис. 2.104.

Рис. 2.104. Первый этап создания пятиконечной звезды

Далее, так как нам нужна пятиконечная звезда, скопируем нашу линию и повернем ее на 360 : 5=72 градуса. Для этого достаточно выделить линию, на вспомогательной панели Transform (Преобразование) установить угол поворота (Rotate) равным 72 градусам и щелкнуть на кнопке Copy and apply transform (Копировать и преобразовать), расположенной на этой же панели. Щелкнем на этой кнопке не один раз, а четыре раза подряд.

Теперь у нас есть пять копий линии, каждая из которых повернута на 72 градуса относительно предыдущей. Если мы хотим, чтобы один из лучей звезды указывал точно вверх, выделим все эти линии и дадим команду Modify Transform Rotate 90 CW (Изменить Преобразовать Поворот на 90° по часовой стрелке) (рис. 2.105).

Рис. 2.105. Второй этап создания пятиконечной звезды

Теперь откроем панель Align (Выравнивание), включим переключатель То Stage (Относительно сцены), выделим все объекты и отцентрируем их последовательно по горизонтали и вертикали. Удерживая нажатой клавишу SHIFT, последовательно выделим каждый второй луч нашего "солнышка" и нажмем клавишу DELETE. Затем выделим и удалим те части линий, которые оказались вне круга (рис. 2.106). Можно немного подкорректировать масштаб с помощью кнопки Scale (Масштабирование).

Рис. 2.106. Третий этап создания пятиконечной звезды - получение круга с пятью секторами

Теперь возьмем инструмент Линия и соединим через одну точки соприкосновения нашего "солнышка" с окружностью. При этом важно, чтобы был включен режим Snap to objects (Притягивание к объектам). Затем выделим окружность (она уже, кстати, разбита на дуги, так что выделять ее придется по частям) и удалим ее клавишей DELETE. Также можно удалить и внутренние соединительные линии (рис. 2.107).

Рис. 2.107. Четвертый этап создания пятиконечной звезды - соединение узлов и удаление окружности

Наконец, можно добавить дополнительные линии, чтобы разбить звезду на "сектора", выбрать градиентные заливки и залить каждый "сектор" отдельно, чередуя светлые и темные градиенты. Затем можно двойным щелчком мыши но контуру выделить весь контур и удалить его клавишей DELETE. Звезда готова (рис. 2.108).

Рис. 2.108. Заключительный этап создания пятиконечной звезды - заполнение контуров заливками

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

Итак, подведем промежуточный итог. Мы с вами освоили многие возможности Flash как редактора векторной графики. Однако статическая графика - это далеко не основное, чем завоевала популярность эта программа. Теперь, постигнув азы, можно переходить к более интересным темам: анимации и интерактивности. Этим темам и посвящена остальная часть книги.