WWW.DISSERS.RU

БЕСПЛАТНАЯ ЭЛЕКТРОННАЯ БИБЛИОТЕКА

   Добро пожаловать!

Pages:     | 1 |   ...   | 2 | 3 || 5 | 6 |   ...   | 8 |

«F L A S 100 советов и рекомендаций профессионала O'REILLY С&ППТЕР Шам Бхангал F L A S H H A C K S Sham Bhangal O'REILLT Beijing • Cambridge • ...»

-- [ Страница 4 ] --

Автоматическое завершение имеет смысл лишь в том случае, если текущее слрво содержит не менее двух букв, поэтому команда if в следующем фрагменте отменяет проверку, если в текущем слове был введен только один символ. Если же пользователь ввел минимум два символа, цикл for сравнивает слово с каждым элементом словаря до тех пор, пока не найдет совпадение. Переменная search оптимизирует будущие операции поиска. Известно, что словарь отсортирован по алфавиту, поэтому любые будущие возможные совпадения этого слова будут находиться после текущей найденной позиции словаря. Следовательно, запоминая позицию текущего слова, мы сможем в следующий раз возобновить поиск с той же позиции: if(lastWord.length > 1){ -for (var i = 0: i < dictionary.length;

i++) { i f (lastWord == (dictionary[i].substr(0. lastWord.length))){ // Совпадение обнаружено match - dictionary[i]: search = i ;

break;

Наконец, если попытка поиска еще не предпринималась, потому что текущее слово было слишком коротким, сохраненная позиция search сбрасывается когда слово будет иметь достаточную длину, поиск следует начать от начала словаря: } else { search = 0: } Программа написана так, чтобы пользователь мог подтвердить предложенный вариант завершения слова нажатием клавиши Ctrl (другие способы рассматриваются далее). Когда пользователь нажимает клавишу Ctrl, в результате прослушивания событий вызывается функция autoComplete(), которая передает текущий вариант автоматического завершения в поле ввода, фактически, завершая слово за пользователя: function autoCompleteO { i f(Key.i sDown(Key.CONTROL)){ myText_txt.text - complete_txt.text + " ";

Sel ecti on. setSel ecti on(myText_txt. text. 1 ength. myText_txt.text.1ength);

Автоматическое завершение текста Последняя команда в приведенном фрагменте перемещает курсор в конец текущей строки. Для перемещения в конец содержимого текстового поля используется фокус с выделением нулевой длины. На рис. 6.6 представлен механизм автоматического завершения в действии. Если ввести фразу «Не sa», вам будет предложен вариант завершения «Не said». Нажмите клавишу Ctrl, чтобы занести предложенный текст в текущее поле ввода. При желании добавьте статическую справку, в которой бы сообщалось, что клавиша Ctrl инициирует автоматическое завершение.

Не s| Не за|н Не said Рис. 6.6. Автоматическое завершение в действии Итоги В этом разделе приведен базовый код, необходимый для реализации автоматического завершения. Скорее всего, вы захотите его изменить - например, чтобы автоматическое завершение подтверждалось другой клавишей (скажем, пробелом). Но в этом случае придется приложить дополнительные усилия. Хотя нажатие пробела можно обнаружить простым поиском « » в конце текущего содержимого поля, нужно убедиться в том, что последней нажатой клавишей была не клавиша Backspace. Другой потенциальный недостаток заключается в том, что при нажатии пробела для перехода к другому слову механизм автоматического завершения может добавить нежелательный текст. Например, если ввести слово «table» и нажать пробел, это слово может неожиданно замениться словом «tablecloth». Впрочем, это маловероятно, потому что часто встречающиеся слова из списка обычно имеют небольшую длину. Другое обстоятельство, способное вызвать раздражение у некоторых пользователей, - добавление пробела в конец каждого автоматически завершаемого слова. Впрочем, это все мелочи - даже если изменить подробности реализации, основной принцип остается прежним. Базовый словарь из часто встречающихся слов также может стать отправной точкой при построении более полезного списка. Когда речь заходит о «включении словаря», может показаться, что это приведет к заметному увеличению объема SWF-файла, однако 300 самых распространенных слов занимают менее 1 Кбайт. Расширение списка до 3000 слов (что приближается к количеству слов, используемых в нормальной речи, если не считать имена собственные и служебные частицы) потребует не более 10-15 Кбайт! Получается не так уж много, и это обстоятельство позволит нам создать словарный запас для синтезатора речи (см. трюк 52), чтобы он мог читать простой текст. Синтезатор выводит неопознанные слова, которые вы можете добавлять в словарь (см. трюк 44) по своему усмотрению.

Глава 6. Текст Далее перечислены некоторые из возможных усовершенствований. • • • Сделайте так, чтобы автоматическое завершение выполнялось по нажатию клавиши Return/Enter. Предотвратите возможный переход к скрытому полю, задав свойство tablndex для поля myText_txt, но не для complete_txt. Реализуйте дополнительную логику, чтобы автоматическое завершение работало даже в том случае, если пользователь щелкнет в середине заполненного текстового поля. Решите проблемы с переносом и прокруткой, возникающие при работе с длинным текстом. Ускорьте поиск слов, чтобы программа могла использовать более длинные словари без ухудшения быстродействия. Например, словарь можно разбить на массивы, хранящиеся в хеш-таблице, ключом которой являются первые два символа. Идею трюка подсказал Stickman • • Динамическое построение списка вводимых слов Накопление списка слов для поиска, индексирования и автоматического завершения и его сохранение в локальном файле. Ранее было показано, как организовать автоматическое завершение текста (см. трюк 43) по заранее построенному списку слов, то есть по ограниченному словарю. Такой подход хорошо работает для часто встречающихся слов, но на практике понятие «часто встречающийся» изменяется в зависимости от ситуации. Например, 300 или 3000 самых распространенных слов в разговоре специалистов по компьютерам будут отличаться от того лее количества слов в обычном разговоре. Автоматическое завершение текстовых полей чаще всего применяется при заполнении экранных форм. Как правило, такие формы заполняются нестандартными словами, специфическими для конкретного пользователя (скажем, его имя, название улицы и города и т. д.). В этом трюке показано, как реализовать динамическое построение списка слов.

Добавление новых слов в список В нашем примере поиск новых слов для включения в список будет производиться только после того, как пользователь завершит ввод текущих данных. На форме это происходит в тот момент, когда пользователь отправляет данные кнопкой Submit. В обработчике onReiease кнопки Submit мы ищем текст, введенный в текстовом поле (или полях), и включаем в словарь те слова, которые не были включены в него ранее.

Динамическое построение списка вводимых слов Программа Следующий код решает задачу поиска новых слов и их включения в список (предполагается, что код из трюка 43 также присутствует, а обработчик события onRelease вызывает функцию entered()). 1 function entered О { 2 var newWords:Array = new ArrayO;

3 newWords = myText_txt.text.split(" " ) ;

4 for (var i = 0;

i

i++) { 5 if (myText.indexOf(newWords[i].toString()) == -1) { 6 7 8 9 10 1 1 // Новое слово отсутствует в словаре. // Добавить его и отсортировать словарь заново. myText += " "+newWords[i];

dictionary.push(newWords[i]): dictionary.sort О:

} } В строках 2 и 3 функции создается новый массив newWords, содержащий все слова из текстового поля myText_txt. Если форма содержит несколько текстовых полей, просто объедините их в одну строку конструкцией следующего вида (вместо строки 3 предыдущего листинга): newWords = (myTextFieldl_txt.text + " " + myTextField2_txt.text).split(" ");

В теле цикла for (строки 4-11) программа последовательно ищет в словаре каждое слово в текстовом поле (конечно, можно ограничиться словами, состоящими из трех и более букв). Если новое слово не найдено, оно включается в словарь, после чего словарь заново сортируется. Хотя в этом коде содержимое строки myText используется для быстрого поиска (см. трюк 79), новые слова сохраняются в массиве dictionary (см. трюк 43). В этом можно наглядно убедиться: запустите ролик в отладочном режиме (Control • Debug Movie) и просмотрите содержимое массива root.dictionary при вводе слова «aardvark». Если щелкнуть на кнопке Submit, вы увидите, что элемент dictionary[0] теперь содержит слово «aardvark». Нажимайте клавишу Backspace до тех пор, пока слово «aardvark» не будет полностью стерто, и начните вводить его заново. После ввода символов «аа» Flash автоматически завершает слово.

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

Глава 6. Текст В следующем листинге приведен код поиска новых слов и их сохранения в локальном файле (изменения по отношению к предыдущим версиям выделены жирным шрифтом): function entered О { var newWords:Array = new ArrayO;

var needUpdate:Boolean = false;

newWords = myText_txt.text.split(" " ) : for (var i = 0;

i

dictionary.push(newWords[i]);

dictionary.sort О: needUpdate • true;

} if (needUpdate) { saveDictionaryO;

> function saveDictionaryO { var shared:SharedObject = SharedObject.getLocal("dictionary") shared.data.dictionary = myText;

shared. flushO;

} function loadDictionaryO { var shared:SharedObject = SharedObject.getLocal("dictionary") if (shared.data.dictionary ! undefined) { = myText = shared.data.dictionary;

} function enterEventO { enteredO;

/ П о а о р б т а к о к Submit... / рчя баок нпи } function autoCompleteO { if (Key.isDown(Key.CONTROL)) { myText_txt.text = complete_txt.text+" ";

Sel ect i on.setSelecti on(myText_txt.text.1ength, myText_txt.text.1ength):

} function fieldChangeO { match = "";

startOfWord = this.text.lastlndexOfC ")+l;

lastWord = this.text.substring(startOfWord. this.text.length): i f (lastWord.length>l) { for (var i = 0: idictionary.length: i++) { i f (lastWord == (dictionary[i].substr(0. lastWord.length))) // Совпадение обнаружено match = dictionary[i]:

Динамическое построение списка вводимых слов search = i ;

break;

} else { search = 0:

} } } complete_txt.text - this.text.subs-tr(0. startOfWord)+match;

/ Ииилзця / нцаиаи / Плы сио со н пиоис / онй пск лв е рвдтя vrmTx:tig = "bu a o e. y uyug y u " a yetSrn aot b v.. o on o r ;

v r d c i n r : r a = n w ArrayO;

a itoayAry e vrsac:ubr = 0 a erhNme : vrlsWr:tig = ";

a atodSrn " vr satfodSrn = ": a trOWr:tig " v r c n r l O j c = n w ObjectO: a oto:bet e / З г у к х а и о ос о а я / арза рнмг лвр loadDictionaryO;

/ Псреи соая / отоне лвр d c i n r - m T x. p i ( ");

itoay yetsit" d c i n r. sortO;

itoay / Нсрйа сбтй и суаее / аток оыи лштлй mTx_x.nhne = fedhne yetttoCagd ilCag: cnrloKyon = atCmlt;

oto.neDw uoopee K y a d i stener(control): e.dL etrbnoRlae= etrvn;

ne_t.nees neEet В третьей строке обновленной функции enteredO определяется логическая переменная needUpdate;

при обнаружении новых слов, которые должны быть добавлены в словарь, ей присваивается значение true. Если в словарь были добавлены новые слова, в последней строке enteredO вызывается функция saveDictionary(). Она сохраняет текст текущего полного словаря в локальном хранилище LSO (Local Shared Object). LSO всего лишь является удобным средством для хранения данных между сеансами, по аналогии с браузерными cookie. Данные будут загружены в тот момент, когда это потребуется. При попытке сохранения LSO, размер которого превышает максимально допустимое значение в системе пользователя, Flash Player запрашивает у пользователя разрешение на сохранение дополнительных данных, отображая вкладку Local Storage диалогового окна Settings. По умолчанию объем локального хранилища данных составляет 100 Кбайт на домен. Если вы собираетесь организовать локальное хранение данных, сообщите об этом пользователю. Если диалоговое окно появится неожиданно для пользователя, это может сильно встревожить его - особенно если заполняемая форма предназначена для оформления заказа на какой-нибудь товар! Сохраненный словарь загружается функцией loadDictionaryO. Функция сначала ищет в LSO ранее сохраненный словарь и, если он существует, использует новый текст для замены стандартного словаря myText. Чтобы убедиться в том, что новые слова сохраняются между сеансами, запустите ролик в режиме тестирования, введите в текстовом поле слово «aardvark», '_ Глава 6. Текст закройте SWF-файл и запустите его заново. На этот раз слово «aardvark» автоматически завершается после второй буквы.

Итоги В последнем листинге поиск в словаре производится в двух случаях: • • когда пользователь вводит слова в текстовом поле, происходит подбор варианта для автоматического завершения (алфавитный поиск в массиве dictionary);

когда мы хотим узнать, присутствуют ли в словаре вновь введенные слова, поиск выполняется по строке myText.

Таким образом, мы имеем две версии списка слов: одна обеспечивает структурный алфавитный поиск, а другая позволяет узнать, присутствует ли введенное слово в текущем словаре. Обе версии оптимизированы по скорости. Возможно, вы также обратили внимание на одно допущение: наша программа предполагает, что все слова встречаются с одинаковой частотой, а вернее - что частота их появления соответствует алфавитному порядку. Это не всегда так. Например, слово «said» встречается чаще, чем «sad», но при алфавитном упорядочении словаря «sad» будет предлагаться раньше, чем «said». Одно из возможных решений - упорядочить список по частоте использования (либо на основании данных, полученных в результате статистического анализа, либо простым подсчетом использования отдельных слов в текущем контексте). Но такое решение замедлит поиск, если список не будет упорядочиваться (по крайней мере частично) по алфавиту. При небольших списках слов поиск всегда выполняется относительно быстро. Но если списки имеют большой размер, выбор решения зависит от того, насколько алфавитная сортировка снижает скорость. Область применения методики сохранения часто используемых слов не ограничивается автоматическим завершением текста. Она также может использоваться для накопления статистики - скажем, отслеживания самых популярных ответов в опросах или предложения возможных условий поиска в тех случаях, когда поиск по заданному критерию не дает результатов. Конечно, эти нетривиальные варианты применяются в основном при сохранении данных на рабочем сервере. Трюк обеспечивает локальное хранение данных, а это означает, что набор часто используемых слов зависит от пользователя. При помощи Flash Remoting или других технологий можно загружать данные на сервер и накапливать статистику по нескольким пользователям.

Перенос сложного форматирования №45 в Flash ТРЮК Воспроизведение в Flash сложных текстовых/графических макетов — таких, как математические формулы. Microsoft Word используется как буфер для промежуточного хранения данных. Flash получает все большее распространение и все чаще используется в целях, отличных от «чистого» дизайна веб-сайтов. На обучающих сайтах часто возни Перенос сложного форматирования в Flash кает задача вывода сложного форматирования текста - например, математических формул. Так, сайт MathWorld (http://mathworld.wolfram.com) довольно быстро сталкивается с ограничениями базовых средств HTML - уравнения, приводимые на этом сайте, реализуются с использованием растровой графики в таблицах HTML. Должно быть, на создание таких страниц уходит целая вечность! При создании макетов с нестандартным форматированием гораздо проще использовать Flash, нежели HTML. Flash не только позволяет размещать текст с точностью до пиксела, но и сохраняет возможность его редактирования. Однако возможности Flash по форматированию текста не ограничиваются простым оформлением - Flash позволяет воспроизводить сложные атрибуты формата, выходящие за рамки традиционных возможностей Web. Как вы вскоре увидите, в Flash даже можно полностью скопировать структуру HTML-страницы!

Создание математических формул Математические формулы обычно создаются в Microsoft Word с использованием Equation Editor. Этот специализированный редактор не устанавливается в составе Microsoft Office по умолчанию. Чтобы установить его в Windows XP (используя Office XP), откройте панель управления Windows и щелкните на кнопке Установка и удаление программ (Add or Remove Programs). Найдите в списке Microsoft Office XP и щелкните на кнопке Изменить (Change). В открывшемся диалоговом окне установки Microsoft Office установите переключатель Добавить или удалить компоненты (Add or Remove Features) и щелкните на кнопке Далее (Next). Найдите строку Редактор формул (Equation Editor) в категории Средства Office (Office Tools), как показано на рис. 6.7. В Mac OS X Equation Editor устанавливается в составе компонента Microsoft Office Value Pack, находящегося на компакт-диске Microsoft Office для Mac OS X;

тем не менее, представленный трюк лучше работает в Windows, чем на Мае. Чтобы использовать редактор формул после его установки, выполните команду Insert • Object и выберите строку Microsoft Equation. Затем создайте уравнение при помощи панели инструментов Equation Editor, появившейся на экране. Основные меню Microsoft Word тоже изменяются, чтобы вам было удобнее применять форматирование, специфическое для уравнений (в частности, вводить нижние и верхние индексы и буквы греческого алфавита). Equation Editor можно заменить редактором MathType (http://www.mathtype.com), сторонним редактором формул для Word (Word может выдать диалоговое окно с информацией о MathType при первом запуске Equation Editor). Объекты MathType имеют более сложную структуру, чем стандартные выходные данные Equation Editor, поэтому у Flash возникают трудности с их импортированием. Так что не соглашайтесь на замену, если вы собираетесь использовать математические формулы в Flash. Используя Equation Editor, отформатируйте формулу в Word. Чтобы скопировать ее в Flash, выделите текст формулы (рис. 6.8) и нажмите клавиши Ctrl+C (Windows) или < > С (Мае), чтобы скопировать его в буфер обмена. Н+ Глава 6. Текст Micros Microsoft Office XP Professional with FrontPage Choose instaiiafon opoons for air Office applications and toois Features to install:

ш *ш i •щ^| : X Office Shared Features Office Tools • ' * • H T M L Source Editing L a n g u a g e Settings Tool Microsoft D r a w Converter Microsoft G r a p h ^р| -г Microsoft Office S n d e r S u p p o r t Microsoft Office D o c u m e n t Imaging Microsoft Office Shortcut Bar Description Inserts mathematical symbols and equations into documents.

Space Required on С: 1696 KB Hep „Cancel,:

Рис. 6. Копировать нужно текст внутри объекта формулы, а не сам объект формулы. Впрочем, скопировать объект во время редактирования все равно невозможно, поэтому, если текст выделяется, как показано на рис. 6.8, - значит, все нормально. Если скопировать объект, Flash сможет импортировать его только в виде растрового изображения. Чтобы скопировать текст формулы после выхода из режима редактирования (то есть если меню Equation Editor отсутствует на экране), дважды щелкните на объекте формулы, затем выделите текст и нажмите Ctrl+C (Windows) или Ж+С (Мае). После копирования текста в буфер активизируйте окно Flash, щелкните на сцене и вставьте данные из буфера клавишами Ctrl+V (Windows) или 3€+V (Mac). Формула должна выглядеть как редактируемый текст, объединенный в группу (рис. 6.9).

E q u a t i o n -»<=>i ;

, '. V 3 ;

: Е П С ;

6oo€ : А ш б Гц |р | Г"! Г -=-» *-=f | U ;

о а |S|| : с АП«) Рис. 6.8. Математическая формула, созданная в Microsoft Office Equation Editor Перенос сложного форматирования в Flash Рис.

6.9. Уравнение, вставленное в Flash, имеет вид группы редактируемых текстовых объектов В Mac OS X формула, скопированная из документа Word и вставленная в Flash, может содержать неверные символы. Механизм переноса работает надежнее, если скопировать уравнение прямо из Equation Editor (без вставки объекта уравнения в документ Word) и вставить его непосредственно в Flash. Если уравнение будет использоваться часто, преобразуйте группу в символ (клавиша F8). Описанная методика отлично подходит для небольших формул, но для построения более серьезных формул придется основательно потрудиться, особенно если вы создаете набор Flash-слайдов с изложением волновой теории!

Импортирование форматированного текста из других источников Более крупные текстовые блоки с формулами удобнее импортировать в формате HTML или PDF. Если импортируемая формула является стандартной, просто проведите поиск в Веб и найдите ее версию, отформатированную в виде HTML-текста (рис. 6.10). Выделите формулу, скопируйте и вставьте ее из веб-страницы в Word, затем повторно выделите ее в Word, скопируйте и вставьте в Flash. Word гораздо лучше справляется с импортированием большинства видов данных посредством копирования/вставки, чем Flash (и, если уж на то пошло, лучше большинства других приложений). the Лг-Ьаявошс Fotraer series approximafton сщ be wMttea as! x(t) ~a0 -raj cos (&U т GJ т a2cos (2®t + Щ -r... 4- av cos (Nu)jt + бу Рис. 6.10. Отформатированная математическая формула на веб-странице Глава 6. Текст На рис. 6.11 показан текст со сложным форматированием, скопированный из таблицы HTML в Word. )pc(t): = cos (mj -f By) + a cos (2G>J + Рис. 6. 1 1. Сложный текст, скопированный из HTML-страницы в Word, может выглядеть как таблица В Word сложный текст может выглядеть как таблица, но если скопировать его и вставить в Flash, все получается нормально, как показано на рис. 6.12.

x(t) = а0 + а} cos (wj + 9)) + а2 cos (2a>J + &2) +... + a,v cos (№4/ Рис. 6.12. Таблица, скопированная из Word в Flash MX На рис. 6.13 показано, как выглядит группа, созданная Flash в результате операции вставки. Только подумайте, сколько времени потребовалось бы для ручного создания такой формулы в Flash!

Рис. 6.13. Сложная формула, представленная в виде группы текстовых элементов Flash Неважно, откуда копируется отформатированный текст, - если его можно вставить в Word, а затем заново скопировать и вставить в Flash, все пройдет нормально. Более того, описанный трюк подходит не только для формул - если у вас имеются любые данные в формате HTML, которые нужно использовать в Flash (например, если вы хотите перенести в Flash статическое меню HTML), просто скопируйте его в Word с HTML-страницы и вставьте в Flash. В системе Windows такая операция работает идеально (хотя на Macintosh иногда возникают проблемы). ПРИМЕЧАНИЕ Копирование/вставка — удобный способ создания форм Flash на базе существующих форм HTML/JavaScript.

На рис. 6.14 выделяется основной шаблон сайта O'Reilly с боковым меню. Выделенный HTML-код копируется в буфер.

Перенос сложного форматирования в Flash Рис. 6.14. Выделение заголовка и бокового меню на сайте O'Reilly Вставьте данные в формате HTML в Word, как показано на рис. 6.15, скопируйте их из Word в буфер обмена, затем вставьте в Flash : f"V r--v< (Г"? • i;

:*I • ! W ;

Ш :( ;

^ final Showing P ^эд ' Cj v ;

Рис. 6.15. Данные HTML вставляются в Word, затем заново выделяются и копируются обратно в буфер На рис. 6.16 изображен шаблон сайта O'Reilly с боковым меню, выполняемый в виде SWF-ролика после небольшой корректировки. Все элементы являются статическими, но эта заготовка может использоваться для воссоздания некоторых компонентов сайта на базе Flash.

Глава 6. Текст Рис. 6.16. Основной шаблон сайта O'Reilly в виде SWF-ролика Если потребуется импортировать целые страницы технических документов (например, для создания обучающего ролика на техническую тему в стиле Macromedia Breeze), проще всего преобразовать документ Word в формат PDF (или получить документ в формате PDF из другого источника), а затем импортировать PDF в Flash командой File • Import.

Итоги Хотя для публикации технической информации в Веб можно использовать простые электронные документы PDF или отформатированные данные HTML, технология Flash обладает рядом преимуществ (например, она позволяет применять анимацию при выводе диаграмм). Многие физические концепции трудно объяснить на статических моделях, и тогда SWF-ролики Flash с анимацией, поясняющей описанный материал, окажут огромную помощь. Если вы еще не уверены в необходимости использования математических формул в Flash, ознакомьтесь с некоторыми анимированными системами, реализованными на Flash (например, с системой работы с формулами Роберта Пеннера по адресу http://www.robertpenner.com). Автор объясняет основные принципы работы с системой при помощи Flash, и это выглядит в высшей степени уместно! Возможности форматирования текста в Flash весьма ограничены (хотя поддержка CSS в Flash MX 2004 отчасти решает эту проблему). Microsoft Word обладает гораздо лучшими средствами работы с текстом, поэтому текст удобнее отформатировать в Word и перенести в Flash через буфер обмена. Если элементы Flash потребуется вставить в существующую структуру HTML, попробуйте импортировать весь макет (вместе с текстом и растровой графикой) Использование HTML и CSS в Flash п № ТРЮК по цепочке H T M L • Word • Flash. Таким способом даже многие интерфейсные элементы JavaScript (например, поля) импортируются в виде растровой графики!

ПРИМЕЧАНИЕ Flash MX 2004 стал первой версией продукта с проверкой орфографии. Если вы используете более раннюю версию, проверьте правописание текста в Word и скопируйте его в Flash.

Методика, описанная в этом разделе, хорошо работает в системе Windows, но у пользователей Macintosh могут возникнуть проблемы.

Использование H M и CSS в Flash TL Flash MX 2004 обладает расширенными возможностями форматирования HTML, а также поддерживает CSS. Это позволяет создавать страницы, которые по внешнему виду напоминают Flash, но загружаются как обычные HTML-страницы.

В Flash существуют разные способы форматирования текста - например, использование экземпляров класса TextFormat для применения форматирования к экземплярам TextField (см. трюк 42). Для тех, кто привык использовать теги HTML, Flash MX и более поздних версий поддерживает базовые средства форматирования HTML. В Flash MX 2004 появилась поддержка стилевых таблиц CSS, упрощающих применение и изменение текстовых стилей в презентациях Flash. Впрочем, сходство возможностей форматирования текста еще не означает, что Flash ведет себя точно так же, как HTML в браузере. Одна из основных проблем с сайтами Flash состоит в том, что процесс их загрузки не всегда проходит так же, как загрузка простых HTML-страниц. При загрузке HTML-страниц большинство ресурсов отображается сразу же после того, как они становятся доступными;

не требуется ни предварительная загрузка, ни потоковая передача данных, ни другие средства управления пересылкой данных. Flash-сайты превосходят свои аналоги HTML по анимации и интерактивности, но некоторые странности загрузки Flash-сайтов обескураживают многих пользователей: По прошествии одной-двух секунд пользователь не может выяснить, содержит ли страница нужный материал, просто просмотрев начало загруженной страницы. • При загрузке содержания Flash обычно не учитывается «удельный вес» отдельных элементов. Например, многие веб-страницы HTML практически мгновенно отображают текст и пустые таблицы, затем появляется графика, и только потом - прочие данные (например, видео). В Flash дело обстоит иначе: если для первого кадра временной диаграммы нужно загрузить 150 Кбайт, а на втором кадре размещены 3 Кбайт простого текста, этот текст появится лишь после того, как будут загружены первые 150 Кбайт. Хотя хороший Flash-дизайнер способен решить обе проблемы, поддержка форматирования HTML в Flash MX 2004 позволяет приблизить процесс загрузки к традиционному. • 22В Глава 6. Текст Форматирование текста с применением H M TL В текстовых полях текст обычно воспроизводится буквально. Следовательно, для того чтобы текст выводился без интерпретации метаданных, достаточно воспользоваться свойством TextField.text. В следующем примере теги HTML не интерпретируются и выводятся как обычный текст: myText.text = "Enter any < > T L formatted text here";

b HM trace(myText.text);

// Результат: Enter any HTML formatted text here Чтобы содержимое текстового поля интерпретировалось как HTML-код, задайте свойству html значение true и присвойте код HTML свойству htmlText, как показано далее (обратите внимание на жирный шрифт в выходных данных): myText.html = true: myText.html Text = "Enter any HTML formatted text here": trace(myText.text): // Результат: Enter any HTML formatted text here Строка, назначаемая свойству myText.htmlText, может содержать следующие теги H T M L : (с атрибутами href и target), <Ь>,
, (с атрибутами face, color и size), ,

  • ,

    , и . Также поддерживается атрибут class, позволяющий создавать определения классов CSS;

    кроме того, как будет показано далее, вы можете создавать определения стилей CSS. Между реализациями тегов в Flash и HTML существуют некоторые различия. В частности, если заключить блок текста между тегами <а> и (тег гиперссылки) в Flash, стиль текста не изменяется автоматически в соответствии с внешним видом ссылки (подчеркнутый синий текст). Форматирование текста придется задать явно с использованием других тегов. Например, подчеркивание текста ссылки обеспечивается тегом <и>: myText.html = true;

    myText.html Text = "This is a link";

    На рис. 6.17 показано, как будет выглядеть полученный текст;

    слово «link» действует как гиперссылка. T h i s is a link Рис. 6.17. Создание ссылки HTML в Flash с применением тегов подчеркивания и гиперссылки Впрочем, для форматирования данных в стиле HTML существует более удобный способ - поддержка CSS в Flash MX 2004.

    Использование HTML и CSS в Flash Форматирование с использованием C S S Каскадные таблицы стилей (CSS, Cascade Style Sheets) позволяют задавать атрибуты форматирования при помощи таблиц, хранящихся во внутреннем или внешнем представлении (файлы.ess). Изменение таблицы приводит к изменению текстовых стилей во всей презентации. Flash MX 2004 поддерживает атрибут HTML class для определения таблиц стилей, что позволяет использовать форматирование CSS в тексте. Например, можно определить текстовый стиль, обеспечивающий выделение гиперссылок синим цветом (см. трюк 93). Также следует учесть, что при определении CSS во внешних текстовых файлах необходимо позаботиться о том, чтобы таблица была полностью загружена перед использованием - при загрузке стилевых таблиц для HTML-страниц браузер берет эту заботу на себя. Следующий фрагмент кода корректно загружает внешнюю стилевую таблицу myExternalCSS.css и использует ее для форматирования HTML-кода в текстовом поле Flash: // Определение нового объекта Stylesheet var myStyle = new TextField.StyleSheetO;

    // После того как загрузка таблицы будет завершена. // использовать ее для форматирования текста. myStyle.onLoad = function О { myText.stylesheet = t h i s ;

    myText.html = true;

    myText.htmlText = myHTML;

    }: myStyle.1oad("myExternalCSS.ess");

    myHTML = "

    Creating an e f f i c i e n t walk cycle

    " myHTML+= "

    Scribble moves very " + "quickly in the final work, far too quickly for the viewer to see " + "the lack of frames. He also spends a l o t of time in the a i r. thus " + "minimizing the slide walk effect.

    " myHTML+= "

    You can see an example of him moving here.

    " myHTML+= "

    Of course, when two designers get together, easy options " + "always go out of the window...(etc)

    ." Файл myExternalCSS.css представляет собой простой текстовый файл с определениями классов и стилей CSS: body { font-family: Verdana. Arial. Helvetica, sans-serif;

    font-size: 12px;

    font-weight: normal;

    text-decoration: none;

    color:#909090;

    }.emphasis { font-family: Verdana. Arial. Helvetica, sans-serif;

    font-size: 12px;

    font-weight: normal:

    228 t x - e o a i n nn;

    e t d c r t o : oeclr#000 oo:448;

    .

    Глава 6 Текст.

    }.il { tte font-family: Verdana. Arial. Helvetica, sans-serif: font-size: 16px;

    font-weight: bold: text-decoration: none;

    COlor:#8080A0;

    } a:link { font-family: Verdana. Arial. Helvetica, sans-serif: font-size: lOpx: font-weight: none;

    text-decoration: underline;

    color:#8080A0: } a:visited { font-family: Verdana. Arial. Helvetica, sans-serif;

    font-Size: lOpx;

    font-weight: bold;

    text-decoration: underline.: Clr#335 Oo:335:

    a:active { font-family: Verdana. Arial. Helvetica, sans-serif;

    font-size: lOpx;

    font-weight: bold:. text-decoration: underline;

    col or:#444444:

    a:hover { font-family: Verdana. Arial. Helvetica, sans-serif;

    font-size: lOpx;

    font-weight: bold: text-decoration: underline;

    COlor:#C08080;

    } Стоит обратить внимание на ряд обстоятельств: • Flash не поддерживает теги заголовков HTML (

    ,

    и т. д.), однако это ограничение можно обойти посредством определения собственных классов CSS - таких, как класс.title в нашем примере. • Flash не различает единицы определения размеров шрифта рх (пикселы) и pt (пункты). Следовательно, неважно, какая из этих единиц будет использоваться в таблице стилей. Поддержка CSS в Flash позволяет определять ссылки HTML. Текст, представляющий ссылку, находится в одном из состояний link, visited, active или hover, атрибуты которых определяются в таблице.

    • Использование HTML и CSS в Flash • Значения свойства color задаются числовыми литералами - например, #444444. Использование имен цветовых констант, поддерживаемых браузерами, не допускается. По аналогии с внешним определением CSS, код HTML также можно разместить в отдельном текстовом файле и загрузить его функцией LoadVars.load(). Тем не менее при загрузке внешнего кода HTML необходимо проследить за тем, чтобы текстовые файлы загружались в правильном порядке: сначала загружается файл CSS, затем файл с кодом HTML, а затем в текстовое поле заносятся текстовые данные. В противном случае определения CSS окажутся недоступными или код HTML может оказаться недоступным при его размещении в текстовом поле.

    • ПРИМЕЧАНИЕ Если HTML-код имеет относительно небольшой объем, определите его внутри SWF. Однако графику в HTML-коде обычно лучше загружать на стадии выполнения при помощи тега , о котором речь пойдет далее.

    На рис. 6.18 приведен результат выполнения предыдущего кода с файлом CSS. Предполагается, что на сцене создано динамическое текстовое поле с именем myText. Creating an efficient w a l k cycle Scribble moves very quickly in the final work» fartooquickly for the viewer to see the iack o ftam&s. He also spends aforof time in the atr, thus minimizing the slide walk effect.

    You сел see an exampte or him moving here.

    Рис.

    6.18. Форматирование текста в Flash с использованием таблицы стилей Внедренная графика Один из самых замечательных аспектов поддержки HTML в Flash MX 2004 возможность применения атрибута src тега для внедрения графики J P E G в текстовое поле. Например, в следующем фрагменте изображение задается в одном из тегов <р> (изменения выделены жирным шрифтом): myHTML = "<р class = 'titie'>Creating an e f f i c i e n t walk cycle

    " myHTML+= "

    Scribble moves very " + "quickly in the f i n a l work, far too quickly for the viewer to see " + "the lack of frames. He also spends a l o t of time in the a i r. thus " + "minimizing the slide walk effect.

    " myHTML+= "

    You can see an example of him moving here.



    " myHTML+= "

    Of course, when two designers get together, easy options " + "always go out of the window...(etc)

    ." Результат, полученный при выполнении этого кода, показан на рис. 6.19. Изображение загружается во время обработки HTML-кода на стадии выполнения. Сначала на странице появляется текст. После того как изображение будет Глава 6. Текст полностью загружено, оно тоже появляется на странице, и текст автоматически переформатируется, освобождая место для графики... как при отображении HTML в браузере! Creating an efficient walk cycle Scribble moves very quickly in the final work, farroc?quickly for the viewer to see He also spends a tec of time in the sir, thus mirumrzing the slide waik effect. : You ~ \n ?w? -$

    ;

    when two designers gz he?., easy options always, go out D the wind aw,,, (etc) t Рис. 6.19. Загрузка внедренного изображения на стадии выполнения Учтите, что теги <р> и в Flash работают несколько нестандартно. • Блоки < р х / р > не разделяются пропусками, поэтому нам приходится использовать теги
    , как в предыдущем листинге. • Теги весьма своенравны. Например, они не работают, если это единственный тег в текстовом поле. Проблема решается заключением между другими тегами (обычно хватает абзаца, содержащего единственный пробел, или пары тегов
    ). Выбор окружающих тегов зависит от размера текстового поля. • Flash не поддерживает загрузку прогрессивной графики JPEG при помощи тега . Если указать файл JPEG в прогрессивном формате, изображение не появится. • Тег поддерживается только для текстовых полей, у которых свойства TextField.multiline и TextField.wordwrap равны true. • Чтобы внедрить SWF-файл, задайте путь к нему в атрибуте src тега . Чтобы внедрить анимационный клип, задайте атрибуту src идентификатор компоновки символа клипа. • Необязательный атрибут тега задает имя, используемое для управления внедренным содержанием из ActionScript.

    Итоги Flash MX 2004 предоставляет широкие возможности управления текстом за счет поддержки функциональных подмножеств стандартных спецификаций HTML и CSS. Чтобы объем Flash Player оставался небольшим, фирма Macromedia отказалась от полной реализации спецификаций;

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

    Всплывающие подсказки Хотя некоторые дизайнеры были недовольны тем, что Flash не поддерживает таблицы HTML и расширенное блочное форматирование CSS, поддержка HTML/ CSS позволяет легко загружать и размещать большие блоки текста и графики на стадии выполнения - в предыдущих версиях сделать это было непросто. Что еще важнее, поддержка HTML/CSS в Flash MX 2004 позволяет более четко отделить текстовое и графическое содержание от пользовательского интерфейса Flash-сайтов (и даже хранить его отдельно от файла SWF). Данная особенность упрощает обновление материала.

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

    Добавление специальных свойств Чтобы добавить специальные свойства к анимационному клипу, кнопке или нестатическому текстовому полю (то есть к любому графическому объекту), выделите элемент на сцене и введите необходимую информацию на панели Accessibility. На рис. 6.20 вспомогательный текст добавляется к кнопкам из трюка 96.

    * Accessibility #В •С ble j 0 Make Object Access ' \ Г ] Make child objects a xessible •'.'. - Name:! Button A Description::;

    ' ' ••• ••' •• ^i. Shortcut: : A Tab index::

    -:

    Щ '' ш"!шштА Рис.

    6.20. Ввод специальных свойств на панели Accessibility Глава 6. Текст Если экспортировать клип для Flash Player версии 6г65 и выше, вы увидите, что у выделенного объекта появилось свойство accProps (рис. 6.21).

    ;

    JevdO.buttonA 3 ac r p c Po s гмитев shortcut I true Рис. 6. 2 1. Свойство accProps кнопки buttonA Содержимое полей Name, Description и Shortcut на панели Accessibility отображается в виде подсвойств name, description и shortcut свойства _accProps. Конечно, свойство _accProps для элемента можно определить из ActionScript. Данная возможность может использоваться при динамическом связывании контента с временной диаграммой или включении вспомогательного текста в отдельный файл, обрабатываемый на стадии выполнения. Следующая команда создает описание для кнопки buttonA: buttonA._accProps.description = "some text": Зная все это, мы можем легко приспособить вспомогательный текст для решения практически любых задач, в том числе: • организации звукового воспроизведения вспомогательного текста (см. трюк 52) на устройствах с поддержкой звука, но без специализированных программ для слабовидящих, а также в тех случаях, если вывод звуковой информации используется для экономии места на экране;

    • отображения всплывающих подсказок.

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

    Button В Control+B Рис. 6.22. Всплывающая подсказка.

    Взяв за основу код создания сочетаний клавиш (см. трюк 96), мы включим в него три новые функции: • определение событий, управляющих выводом справочного текста. Для этой цели будут использоваться события onRollOver и onRollOut;

    • размещение подсказок на сцене;

    Всплывающие подсказки • удаление подсказок после того, как они станут ненужными. Но сначала нужно создать справочный текст - либо динамическим созданием текстового поля, либо созданием нового символа, динамически связанного со сценой. В данном трюке используется второй способ - на рис. 6.23 показан символ клипа helpText, содержащий многострочное динамическое текстовое поле с именем экземпляра helpText.

    Рис. 6.23. Символ helpText Назначьте текстовому полю бордюр и выберите шрифт _sans с размером 14 пунктов. Код создания простого текстового поля на основании свойств _accProps приводится в следующем разделе. Функция addHelp() настраивает событие onRollOver на вызов функции createHelpText() через 1,2 с. Если пользователь отодвигает указатель мыши от символа, интервальный таймер сбрасывается вместе с текущим текстом подсказки (для этой цели используются события onRollOut/onDragOut). Функция createHelpText() присоединяет новый экземпляр символа клипа helpText и заполняет его информацией _accProps. В этом коде обратите внимание на следующие обстоятельства: • функция должна знать размер поля helpText, при котором оно будет вмещать текст справки. Для этого она создает объект TextFormat, повторяющий атрибуты форматирования текста, и вызывает метод TextFormat.getTextExtent() для определения размеров текста. К сожалению, метод TextFormat.getTextExtent() обычно возвращает заниженный результат. Чтобы преодолеть этот недостаток, мы задаем значение helpFormat.size чуть большим фактического размера шрифта, используемого в текстовом поле;

    • свойства background и backgroundColor приходится задавать средствами Action Script, потому что на панели свойств отсутствуют элементы для их ручного задания.

    Глава 6. Текст Программа Следующий код получает вспомогательный текст и использует его для построения всплывающей подсказки. Предполагается, что на сцене размещены три кнопки с именами buttonA, buttonB и buttonC. Если щелкнуть на кнопке или нажать определенную комбинацию Клавиш, выполняются соответствующие обработчики событий. За кнопками закреплены следующие комбинации клавиш: • • • ButtonA - A;

    ButtonB - Control+B;

    ButtonC - Control+D.

    Обратите внимание: в поле Shortcut слово «Control» должно вводиться полностью, хотя в книге эта клавиша обычно обозначается сокращением «Ctrl». Кроме того, для каждой кнопки должны быть определены свойства, содержащие вспомогательную информацию. Откройте панель Accessibility (Window • Other Panels • Accessibility) и введите для каждой кнопки имя и комбинацию клавиш, как показано на рис. 6.24. В нашем примере заполняются поля Name и Shortcut, но вы можете самостоятельно изменить программу, чтобы в подсказке отображалось содержимое поля Description.

    •-•.•••••• тлссе* sibrfrty г\ 0 Make 01 sjectAccesable ;

    ::Owske:d-|fd objects;

    . 3ccesSbie Name: | Button A и;

    ' ';

    •,•} Description: i С ;

    Shortcut: j A Tab: infer:

    Рис. 6.24. Ввод свойств кнопок на панели Accessibility Следующий фрагмент использует заданные свойства для создания справочного текста и реализации ускоренного вызова комбинациями клавиш. Подробные комментарии помогут разобраться в происходящем: function addHelp(target) { target.onRollOver = functionO { // Отображение подсказки задерживается на 1.2 секунды. helplnterval = setlnterval(createHelpText. 1200. target);

    }: target.onRollOut = target.onDragOut=function 0 { / Кгау а а е ьмш вхдтз пееы к и а / од к з т л ыи ыои а рдл л п. / пдкза срвес. / осак кыатя cerItra ( e p n e v l ;

    la-nevl h l l t r a ) Всплывающие подсказки removeHelpTextO ;

    function createHelpText(target) { // Создание клипа с текстом подсказки. var helpClip:MovieClip = attachMovieC'helpText". t h i s.getNextHi ghestDepth());

    clearlnterval(helplnterval): // Задание атрибутов текста подсказки. var helpText:TextField = helpClip.helpText;

    helpText.background = true;

    helpText.backgrounded or = OxFFFFCC;

    // Форматирование текста подсказки. var helpFormat:TextFormat = new TextFormatO;

    helpFormat.leftMargin = 2;

    helpFormat.rightMargin = 2;

    helpFormat.indent = 0: helpFormat.size = 15;

    helpFormat.font = "_sans";

    // "helpText".

    // Если у целевого клипа задано вспомогательное свойство name. // оно отображается в подсказке. if (target._accProps.name ! undefined) { = helpText.text = target._accProps.name;

    } if (target._accProps.shortcut != undefined) { • // Е л у целевого клипа задано вспомогательное свойство си // shortcut, оно включается в подсказку. helpText.text += "\n"+target._accProps.shortcut;

    } // Задание размеров подсказки. var fieldSize;

    Object = helpFormat.getTextExtent(helpText.text) helpText._height = fieldSize.textFieldHeight;

    helpText._width = fieldSize.textFieldWidth;

    helpClip._x = _xmouse-helpClip._width/2: helpClip._y = _ymouse-helpClip._height-10;

    } •• function removeHelpTextO { helpText.removeMovi eCli p ( ) : } function aHandlerO { // Обработчик события кнопки А traceC'You clicked A");

    } function bHandlerO { // Обработчик события кнопки В traceC'You clicked В");

    } function cHandlerO { / Обработчик события кнопки С / traceC'You clicked С"):

    Глава 6 Текст.

    f n t o down() { ucin / Фнця о н р ж в е кмиаи каи / уки б а у и а т обнцю лвш / и в п л я т с о в т т у щ йс е а и, / ыоне отесвюи цнрй v r a l Keys;

    al / П о е и ь нжт л ве каии в кмиаи, / р в р т, ааы и с лвш обнци f r ( a j - 0 j k y. e g h j++) { o vr :

    a l K y = true;

    l es f r ( a i = 0 i k y [ ] c m o l n t ;

    i++) { o vr ;

    lKy l es & e.sonky[]cmoi) } i (lKy) { f ales / Ел ве каии кмиаи н ж т, прдт ф к с / си с лвш обнци а а ы ееаь о у / кок и вплиь е орбти сбтя Длнйи / нпе ыонт е баочк оыи. аьеше / сбтя боиутя д ммна опсаи нжтх к а и. / оыи лкрюс о оет тукня ааы л в ш Slcio.eFcsky[]: eet nstou(esj) ti.neDw = udfnd hsoKyon neie: t i. n e U = up: hsoKyp ky[]bnoRlae) esj.t.nees(;

    bek ra;

    } function upO { / Ф н ц я в п л я т я пи о п с а и к м и а и к а и. / уки ыонес р тукни обнци лвш ti.neU = udfnd hsoKyp neie: ti.neDw = dw: hsoKyon on v r k y : r a = n w ArrayO: a esAry e v r k y i t n r O j c = n w ObjectO: a eLsee:bet e ky[] = {t:utn. cmo[5} es0 bnbtoA ob:6];

    k y [ ] = { t : u t n. c m o С K y C N R L 66]}: esl bnbtoB ob: e.OTO. k y [ ] = { t : u t n. c m o [ e. O T O. 68]}: es2 bnbtoC ob:KyCNRL btoAoRlae= aade: utn.nees Hnlr btoBoRlae= bade;

    utn.nees Hnlr btoCoRlae = cade;

    utn.nees Hnlr adepbtoA;

    dHl(utn) addHelp(buttonB);

    addHelp(buttonC);

    keyListener.onKeyDown = down;

    Key.addListener(keyListener):

    На рис. 6.25 показан пример выполнения кода. Кнопке В назначено вспомогательное имя «Button В», а в поле Shortcut введена комбинация клавиш Control+B;

    если задержать указатель мыши над кнопкой, на экране появляется подсказка с этой информацией. Если пользователь нажмет Control+B, выполняется обработчик события bHandler(). Учтите: программа не проверяет, находится ли подсказка полностью на сцене и не закрыта ли указателем мыши. Код всего лишь демонстрирует базовую концепцию, которую при необходимости можно легко дополнить новыми возможностями.

    Текстовые эффекты Button 8 Control+B Рис.

    6.25. Текст подсказки для кнопки В Итоги С реализацией этого трюка и определением клавиатурных сокращений для кнопок (см. трюк 96) ваш сайт не только станет более доступным для пользователей, использующих специализированные программы для слабовидящих, но и предоставит ту же справочную информацию пользователям с нормальным зрением. Перемещение служебной информации во всплывающие подсказки экономит место на экране, при этом информация остается доступной в любой момент. Общий дизайн сайта становится более компактным и эстетичным.

    ТРЮК Текстовые эффекты Текстовые эффекты анимируют текст или представляют его в необычном виде. Создать обобщенный генератор текстовых эффектов оказывается на удивление легко.

    № Многие читатели знакомы с текстовыми эффектами по программам для создания презентаций (таким, как Microsoft PowerPoint), в которых текст перемещается или анимируется по несложным правилам. Спектр возможных анимационных текстовых эффектов в Flash куда более разнообразен. Текстовыми эффектами часто злоупотребляют, но они позволяют эффективно и наглядно донести до читателя основную мысль или добавить анимацию к кнопкам и баннерам. Существует немало генераторов текстовых эффектов Flash, написанных сторонними разработчиками. Для примера можно упомянуть SWiSH (http://www.swishzone.com), Flax (http://www.flaxfx.com), Magic Flare (http://magicflare.com) и Anim-FX (http:// www.flashtexteffects.com). Хорошие дизайнеры относительно редко применяют текстовые эффекты, поэтому расходы на покупку генератора ради создания нескольких эффектов могут оказаться неоправданными. С учетом этого обстоятельства я написал следующую программу, позволяющую быстро и легко создавать текстовые эффекты. Программа основана на следующих принципах: • каждая буква в тексте анимируется отдельно от других;

    • анимация букв происходит с небольшой задержкой. Например, если мы хотим анимировать буквы слова «c-a-t», сначала должна появляться буква «с», затем буква «а» и в последнюю очередь - буква «t». Любые другие варианты затрудняют чтение, и применять их не рекомендуется (если, конечно, они не являются частью задуманного эффекта). Одновременное появление всех букв при большом объеме текста замедлит эффект;

    • в конце эффекта текст имеет «нормальную» позицию и ориентацию. Хотя в некоторых случаях это может оказаться нежелательным (например, если Глава 6. Текст вы хотите, чтобы текст сначала проступил, некоторое время оставался на экране, а потом растворился), такое предположение удобно для разработки исходного обобщенного решения.

    Создание текста Хотя пустые текстовые поля можно создавать динамически методом MovieClip.create TextField(), прежде чем анимировать текстовое поле, его необходимо создать в пустом анимационном клипе (поскольку класс TextField не поддерживает события onEnterFrame для покадрового обновления). Кроме того, необходимо проследить за тем, чтобы шрифт, используемый текстовым полем, был правильно внедрен в итоговый SWF-ролик. Самый простой и безопасный способ - создать текстовое поле внутри клипа и вручную внедрить шрифт на стадии разработки. Далее остается лишь воспользоваться ActionScript для размещения символа, созданного вручную, на сцене во время выполнения. Создайте на сцене динамическое текстовое поле при помощи инструмента Text. Введите в нем текст «mm», чтобы быть уверенными в том, что поле вместит один произвольный символ выбранного шрифта. Выберите на панели свойств тип текста Dynamic Text (рис. 6.26), выберите простой шрифт без засечек (например, Arial или Helvetica) размером 24 пункта. Наконец, задайте текстовому полю имя экземпляра field. D n m Text ya c i "field' imrn \ Sn l Ln i ge i e Рис.

    j^J Jill Arial ШШФ \ %:•' f Ш;

    v;

    <.U E 0 ° H 6.26. Задание свойств текстового поля ПРИМЕЧАНИЕ Выбор простого шрифта без засечек предотвращает использование сложных шрифтов с большим количеством векторных элементов. Тем самым гарантируется быстрая анимация итогового эффекта и незначительный объем лишних данных, обусловленных внедрением шрифта. Не используйте системные шрифты (такие, как _sans), потому что текстовые эффекты работают только при внедрении шрифта.

    Внедрение шрифта Чтобы внедрить шрифт в SWF, не снимайте выделения с текстового поля и щелкните на кнопке Character в правой части панели свойств (если кнопка Character не отображается, значит, вы забыли выбрать тип текста Dynamic Text). В открывшемся диалоговом окне Character Options (рис. 6.27) установите переключатель Select Ranges и выделите первые 4 строки списка, щелкая на них с нажатой клавишей Shift.

    Текстовые эффекты E b d font outlines for: me Japanese Капа {318 glyphs) Japanese Kanji -Level l{3174glv|i Japanese (АИ) (7517glyphs) Basic HangiJ (3454 glyphs) : Hangul (All) (11772 glyphs) t~:~ Traditional.Chinese -Level 1C5609JV Indude these characters:

    Basic Latin (95 glyphs) !

    !

    Рис.

    6.27. Диалоговое окно Character Options Инкапсуляция поля в клипе Не снимая выделения с текстового поля, нажмите клавишу F8, чтобы преобразовать его в символ анимационного клипа (а точнее, инкапсулировать текстовое поле в клипе). Задайте символу клипа имя letter. Дважды щелкните на нем, чтобы войти в режим редактирования, и переместите текстовое поле (при помощи инструмента Selection) так, чтобы его левый нижний угол был совмещен с точкой регистрации клипа (рис. 6.28). Выйдите из режима редактирования, щелкнув на строке Scene 1 в области навигации панели Timeline, и удалите экземпляр letter со сцены.

    Рис.

    6.28. Совмещение левого нижнего угла текстового поля с точкой регистрации клипа Остается задать клипу идентификатор символа компоновки, чтобы его можно было динамически размещать на сцене средствами ActionScript. Выделите символ letter в библиотеке, щелкните на нем правой кнопкой мыши (Windows) или щелкните с нажатой клавишей Н (Мае) и выберите в контекстном меню !> команду Linkage. Установите флажки Export for ActionScript и Export in First Frame. Убедитесь в том, что в поле Identifier выбран символ letter, и щелкните на кнопке ОК.

    Глава 6. Текст Динамическое размещение текста Чтобы разместить текст на сцене с соразмерным распределением пробелов, свяжите следующий сценарий с кадром 1 временной диаграммы: // Код ActionScript 2.0 function placeTextCtarget:MovieClip. x:Number. y:Number. banner:String. tFormat:TextFormat):Void { // Для каждого знака... for (var i = 0;

    i

    char.field.text = banner.substr(i, 1): char._x = x: char._y = y: // Прибавить ширину текущего знака к позиции х следующего знака, х += tFormat.getTextExtent(char.field.text).width;

    } var format:TextFormat = new TextFormatO;

    format.font = "Arial": format.size = 24;

    placeText(this, 100. 100. "This is a text effect", format);

    Функция placeText() создает надпись, текст которой задается аргументом banner, в позиции (х, у) временной диаграммы timeline. Межсимвольные интервалы определяются объектом tFormat класса TextFormat. Если вместо Arial используется другой шрифт или размер шрифта отличен от 24, внесите соответствующие изменения в две строки, выделенные жирным шрифтом. Чтобы использовать шрифт другого размера, измените размеры текстового поля - выделите его инструментом Text и перетащите ограничивающий прямоугольник до нужных размеров. При использовании значений, заданных в последней строке листинга, текст выводится с правильными межсимвольными интервалами, как показано на рис. 6.29. T h i s is a t e x t e f f e c t Рис. 6.29. Выходные данные генератора с пропорциональными интервалами Если экземпляр TextFormat не используется, а знаки текста выводятся на фиксированных расстояниях, результат будет выглядеть примерно так, как показано на рис. 6.30.

    ТЫ s j s a text effect • Рис. 6.30. Текст, выведенный без пропорциональных интервалов Пропорциональные интервалы обеспечиваются следующей строкой: х += tFormat.getTextExtent(char.field.text).width;

    Эффект пишущей машинки Если заменить выражение в правой части константой, (например, х+=12;

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

    Итоги В настоящее время существует целый ряд генераторов текстовых эффектов, разработанных независимыми фирмами, но базовый код текстового эффекта всегда остается одним и тем же. Стоит разобраться в основополагающих принципах, и вы сможете легко создавать собственные эффекты. Возможности написания текстовых переходов ограничены только вашим воображением. Хотя некоторые знаменитые текстовые эффекты (см. трюк 31) можно реализовать разными способами, универсальная основа, приведенная в этом трюке, поможет вам генерировать собственные текстовые эффекты (см. трюк 50). Если вам нужен исходный творческий импульс, посмотрите на начальные титры в таких фильмах, как «Звездные войны», «Семь» или любой фильм Хичкока.

    ТРЮК Эффект пишущей машинки Создание классического текстового эффекта пишущей машинки без применения ручной анимации.

    № Эксперименты с заготовкой для создания текстовых эффектов обычно начинаются с классического эффекта пишущей машинки. Этот эффект прекрасно подходит для оформления начальных титров в триллерах, криминальных драмах и фильмах о писателях (таких, как «Адаптация»). Мы реализуем эффект пишущей машинки вместе со звуковым сопровождением. Программа предполагает, что Flash-ролик содержит звуковые данные с идентификатором компоновки typeClick (импортируйте звуковой файл в Flash и задайте идентификатор компоновки в диалоговом окне Linkage Properties, вызываемом из раскрывающегося меню Options панели Library). Естественно, в файле typewriter.fla, находящемся на сайте книги, используется звук нажатия клавиш механической пишущей машинки.

    Программа Приведенный далее код написан на базе заготовки для построения текстовых эффектов (см. трюк 48). Изменения выделены жирным шрифтом. Предполагается, что динамическое текстовое поле letter находится в клипе с именем экземпляра field, а в библиотеке существует звуковой клип typeClick.

    Глава 6. Текст function typewriter(target:MovieClip, del ay:Number):Void { target.interval = functionO {. target._visible = true: keyHit.start(0, 1);

    clearlnterval(target.interval ID);

    }: target.interval ID = setlnterval(target, "interval", delay): target._visible = false;

    } f n t o p a e e t t r e : o i C i. x N m e, у:Number, b n e : t i g ucin lcTx(agtMvelp :ubr anrSrn. tomtTxFra)Vi { Fra:etomt:od // Д я к ж о о з а а. л адг нк.. f r ( a i = 0 i b n e. e g h i++) { o vr ;

    // С з а ь к и и п м с и ь т к щ й с м о в т к т в е поле. одт лп оетт еуи ивл есоо vrca:oiCi =tre.tahoi(lte" "hr+. • a hrMvelp agtatcMve"etr. ca"i t r e. e N x H ghestDepth());

    agtgteti c a. i l. e t = b n e. u s r i 1);

    hrfedtx anrsbt(. c a. x = x;

    hr_ c a. y = y;

    hr_ // П и а и ь ш р н т к щ г з а а к п з ц и х с е у щ г з а а рбвт ииу еуео нк оии лдюео нк. х + tomtgtetxetca.il.et.it: = Fra.eTxEtn(hrfedtx)wdh // // В з в э ф к а ыо фет. vr tmr =i20Mt.on(ahrno(*0) a ie *0+ahrudMt.adm)20;

    t p w i e ( h r timer);

    yertrca, } var keyHit = n w Sound(this);

    e keyHit. attachSoundf typeCl i ck");

    var format:TextFormat = n w TextFormatO;

    e format.font = "Aria!": format.size = 24;

    placeTexttthis. 100, 100. "This is a text effect.", format);

    В конце функции placeTextQ задается задержка timer от 200 до 300 мс на каждый знак. Указанный интервал должен пройти перед выводом текста (и воспроизведением соответствующего звука) функцией typewriter(). Тем самым имитируется задержка между нажатиями клавиш в процессе ввода текста. Любой текстовый эффект строится по тому же принципу: • определяется задержка на вывод одного знака и изменяются одного или несколько свойств каждой буквы;

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

    • происходит переход к следующей букве. Для создания эффекта пишущей машинки свойству visible задается значение false, в результате чего все буквы изначально невидимы. При истечении задержки код typewriter) делает текст снова видимым. На рис. 6.31 показан эффект пишущей машинки в действии. Программа с небольшой задержкой открывает каждую букву в последовательности.

    Текстовые эффекты, контролируемые по времени This This This Рис.

    is is is a a a text text ef effect.

    6. 3 1. Эффект пишущей машинки в действии Итоги Эффект пишущей машинки наглядно показывает, что многие эффекты строятся по одному образцу. Кроме того, в программе продемонстрированы важные аспекты любых текстовых эффектов - задержка, выбор шрифта и звуковое сопровождение. Без звука и задержки между выводом букв эффект будет выглядеть отнюдь не так убедительно. Кстати говоря, моноширинный шрифт сделает иллюзию еще более полной. Реализация многих текстовых эффектов требует тщательного подбора временных интервалов, звуков и шрифтов. Например, скрип мела по доске в сочетании с подходящим шрифтом может использоваться для создания «рукописного» эффекта (каждая буква может представлять собой анимированный клип, рисующий букву несколькими штрихами).

    Текстовые эффекты, контролируемые №50 по времени ТРЮК Создание различных эффектов за счет изменения размеров и позиции букв с течением времени. Ранее было показано, как на основе заготовки для создания текстовых эффектов (см. трюк 48) создается эффект пишущей машинки (см. трюк 49). В этом трюке рассматриваются еще три текстовых эффекта, построенных на базе того же универсального кода.

    Эффект поднимающихся букв В этом эффекте текст постепенно «поднимается» из горизонтального положения. Как и в других текстовых эффектах, задача решается постепенным изменением свойств клипа. В данном случае изменяется свойство _yscale (масштаб по вертикальной оси). Изначально свойство равно 0, то есть текст остается невидимым (не имеет высоты). Вместо немедленного изменения свойства, как это делалось при реализации эффекта пишущей машинки (см. трюк 49), переход осуществляется постепенно с применением обработчика onEnterFrame(). Когда свойство _yscale достигает окончательного значения (100%), обработчик onEnterFrame удаляет себя.

    Глава 6 Текст.

    Программа Следующий листинг показывает, как реализовать плавный эффект «вырастания» букв посредством постепенного изменения их свойств в обработчике onEnterFrame. Функция placeText() тоже была модифицирована по сравнению с предыдущим трюком (см. трюк 49): в новом варианте ей передается имя выполняемой функции и величина задержки, что упрощает ее повторное использование для- других эффектов. Предполагается, что динамическое текстовое поле letter находится в клипе с именем экземпляра field. Итоговая версия находится в файле standup.fla на сайте книги. Важные фрагменты выделены жирным шрифтом, function standUpCtarget :Movi eCl ip. del ay: Number)-.Void { target.interval = functionO { clearInterval(target.interval ID);

    this.onEnterFrame = functionO { target._yscale += 10;

    if (target._yscale > 95) { delete this.onEnterFrame;

    } target.interval ID = setlnterval(target, "interval", delay);

    target._yscale = 0;

    } function placeText(target:MovieClip, x:Number, y:Number. banner:String. tFormat:TextFormat. effectFunction:Function, del ay:Number):Void { II Д я к ж о о з а а. л адг нк.. f r ( a i = 0 i b n e. e g h i++) { o vr :

    // С з а ь к и и п м с и ь т к щ й с м о в т к т в е поле, одт лп оетт еуи ивл есоо v r chanMovi e l i = t r e. t a h o i C l t e " " h r +. a Cp agtatcMve'etr, ca"i target.getNextHighestDepthО);

    c a. i l. e t = b n e. u s r i 1);

    hrfedtx anrsbt(. c a. x = x;

    hr_ c a. y = y;

    hr_ // П и а и ь ш р н т к щ г з а а к п з ц и х с е у щ г знака. рбвт ииу еуео нк оии лдюео х + tomtgtetxetca.il.et.it;

    = Fra.eTxEtn(hrfedtx)wdh // // В з в ф н ц и э ф к а п р д в е о в в д п р м т а ыо уки фет, ееаамй ие ааер. e f c F n t o ( h r i*delay);

    fetucinca, узг format:TextFormat = new TextFormatO;

    format.font = "Aria!": format.size = 24;

    placeTextUhis. 100. 100. "This is a text effect", format. standUp. 100);

    На рис. 6.32 показан эффект поднимающихся букв в действии. Эффект изменяет высоту каждого символа от 0 до 100 % от исходного размера.

    Текстовые эффекты, контролируемые по времени This is T h i s is a text e f f _ T h i s is Рис.

    a text effect 6.32. Эффект поднимающихся букв в действии Эффект падения Изменяя другие свойства (и/или сразу несколько свойств одновременно), можно создавать переходы, визуально отличающиеся друг от друга, но работающие на сходном коде. Чтобы создать эффект падения, мы постепенно изменяем свойство _у - создается впечатление, что буквы падают на свое место в последовательности. Также в начале падения каждой буквы свойство visible задается равным true, чтобы буква была видна на экране. Чтобы падение выглядело более естественно, выделенная жирным шрифтом строка создает иллюзию инерции. Функция placeTextQ в листинге не приводится она не изменилась по сравнению с предыдущим примером. Как и прежде, предполагается, что динамическое текстовое поле letter находится в клипе с именем экземпляра field. Итоговая версия находится в файле drop.fla на сайте книги. // Код ActionScript 2.0 function dropCtarget :MovieCl i p. del ay: Number)-.Void { target.interval = functionO { target._vi sible = true: clearInterval(target.interval ID);

    target.onEnterFrame = functionO { target._y -= (target._y-target.startY)/3: i f (Math.abs(target._y-target.startY)

    } target.interval ID = setlnterval(target, "interval", delay): target.startY = target._y: target._y = 0;

    target._visible = false: } var format:TextFormat = new TextFormatO;

    format.font = "Arial": format.size = 24;

    placeText(this. 100. 100. "This is a text effect", format, drop. 100);

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

    24G Глава 6. Текст X T h i s is a t e T h i s is a t e x t T h i s is a t e x t e f f e c t Рис. 6.33. Эффект падения в действии Проявление с масштабированием Вероятно, наибольшую известность из всех текстовых эффектов получил эффект постепенного проявления с масштабированием. Он прославились благодаря сайту theVoid (http://www.thevoid.co.uk). Этот эффект основан на постепенном изменении свойств _xscale, _yscale и _alpha, но программная реализация остается практически такой же, как прежде. При изменении всех свойств имитируется эффект инерции (соответствующий фрагмент листинга выделен жирным шрифтом). Функция placeTextO в листинге не приводится - она не изменилась по сравнению с предыдущим примером. Как и прежде, предполагается, что динамическое текстовое поле letter находится в клипе с именем экземпляра field. Итоговая версия находится в файле fadein.fla на сайте книги. function fadeZoom(target:MovieClip. del ay:Number):Void { target.interval = functionO { target._visible = true;

    clearlnterval(target.interval ID);

    target.onEnterFrame = functionO { target._xscale -= (target._xscale-100)/3;

    target._yscale -= (target._yscale-100)/3;

    target._alpha -= (target._alpha-100)/3: i f (Math.abs(target._xscale-100)

    target._yscale = 100;

    target.alpha = 100: delete target.onEnterFrame: } target.interval ID = setlnterval(target, "interval", delay);

    target._xscale = 2000: target._yscale = 2000;

    target.„alpha = 0;

    Текстовые эффекты, контролируемые по времени var format:TextFormat = new TextFormatO;

    format.font = "Arial";

    format.size = 24;

    placeText(this. 100. 200. "This is a text effect", format. fadeZoom. 100);

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

    Thisj This is a text T h i s is a t e x t e f f e c t Рис. 6.34. Эффект проявления с масштабированием в действии Чтобы эффект был симметричным, переместите текстовое поле в клипе letter (при помощи инструмента Selection) так, чтобы точка регистрации клипа находилась в середине левой стороны текстового поля, как показано на рис. 6.35.

    m m Рис. 6.35. Перемещение точки регистрации делает эффект проявления симметричным Итоги После того как мы написали универсальную заготовку для построения текстовых эффектов, в дальнейшем разнообразные текстовые эффекты строятся по принципу изменения свойств во времени. Либо придумайте свой эффект и реализуйте его, либо выберите свойство (или комбинацию свойств), попробуйте изменить его и посмотрите, что из этого выйдет. В интерактивном генераторе текстовых эффектов пользователю нужно предоставить возможность ввода текста и изменения параметров - таких, как амплитуда Глава 6. Текст или скорость эффекта. Попробуйте создать пару библиотек: умеренные эффекты для деловых презентаций, а эксцентричные - для модных веб-сайтов.

    Текстовые эффекты с применением №81 морфинга ТРЮК Некоторые текстовые эффекты реализуются только с применением морфинга. Для создания эффектов такого рода применяется редко используемый, но очень полезный инструмент Envelope. Ранее уже рассматривались способы создания сценарных текстовых эффектов (см. трюк 50). Тем не менее, текстовые эффекты ActionScript ограничиваются созданием анимации за счет изменения свойств клипа со временем. Данная разновидность анимации позволяет изменять позицию, прозрачность, цвет, ориентацию и масштаб текста, но ActionScript не способен создавать сложные анимации с изменением геометрической формы текста. Чтобы решить эту задачу, необходимо преобразовать текст в низкоуровневые векторные фигуры и работать с ними, как с графическими примитивами. Перспектива выполнения низкоуровневых операций с множеством фигур выглядит устрашающе, но в этой ситуации нам пригодится очень полезный инструмент Envelope. Большинство дизайнеров забывает о нем, однако этот инструмент позволяет быстро применять эффекты к набору букв способом, который не удастся легко реализовать на сценарном уровне.

    Разбиение текста Прежде чем приступать к редактированию текста в виде векторных фигур, его необходимо преобразовать в векторную форму - в Flash этот процесс называется разбиением (breaking apart). Создайте текст при помощи инструмента Text, a затем, не снимая выделения с текста, дважды выполните команду Modify • Break Apart. Первая команда Break Apart разбивает текстовое поле на несколько текстовых полей (по одному на каждую букву), а вторая разбивает буквы на векторные контуры.

    ПРИМЕЧАНИЕ После того как текстовое поле будет преобразовано в серию векторных контуров, отредактировать текст напрямую уже не удастся. Проверьте правописание перед тем, как осуществлять разбиение!

    Инструмент Envelope Выделите все буквы в тексте инструментом Selection, активизируйте инструмент Free Transform. В области параметров этого инструмента (в нижней части панели Tools) выберите значок Envelope. Примерный вид текста показан на Текстовые эффекты с применением морфинга рис. 6.36;

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

    Рис. 6.36. Разбитый текст выделен при помощи инструмента Envelope Возможно, вы не сразу разберетесь в том, как работать с ограничивающим прямоугольником, потому что по его периметру расположено множество непонятных маркеров. В действительности маркеры делятся на два типа: квадратные представляют контрольные точки, а круглые - концы управляющих векторов, определяющих угол входа огибающей в контрольную точку. Получается, что каждому квадратному маркеру соответствуют два круглых. Чтобы лучше разглядеть контрольные точки, попробуйте временно затемнить фон (рис. 6.37). Цвет фона задается командой Modify • Document (выделение с огибающей при этом не снимается).

    Рис. 6.37. Затемнение фона помогает различить два типа маркеров на огибающей Перемещение контрольных точек изменяет общую форму огибающей, при этом внутренний текст деформируется в соответствии с новой формой, как показано на рис. 6.38., Рис. 6.38. Перемещение контрольной точки Изменение направления или длины управляющих векторов, связанных с контрольной точкой, влияет на направление и крутизну периметра огибающей при прохождении через контрольную точку. Как и при перемещении контрольных Глава 6. Текст точек, форма текста автоматически подгоняется под форму огибающей, как показано на рис. 6.39.

    Рис. 6.39. Перемещение управляющего вектора Модификация огибающей придает тексту желаемую форму. Хотя текст состоит из множества отдельных фигур, огибающая позволяет быстро изменять их как единое целое и при этом достаточно точно управлять формой фигуры, в которую вписывается текст (рис. 6.40).

    Рис. 6.40. Изменение формы и/или ориентации текста применением инструмента Envelope Пара замечаний о работе с инструментом Envelope: • • если щелкнуть в любой месте, кроме контрольной точки или управляющего вектора, выделение огибающей снимается;

    при снятии выделения форма огибающей не запоминается. Например, если снять выделение с огибающей, показанной на рис. 6.40, то повторное выделение не вернет ее к прежней криволинейной форме. Вместо этого огибающая будет выглядеть как прямоугольник, ограничивающий изогнутый текст. Иногда это сильно раздражает, потому что даже отмена операции (Ctrl+Z или §€+Z) не восстанавливает исходную форму огибающей.

    Несмотря на эти недочеты, инструмент Envelope позволяет очень быстро реализовать морфинг текста (см. трюк 34), как показывает серия изображений на рис. 6.41. Определяя в ключевых кадрах измененные формы текста, мы почти мгновенно создаем естественную «пульсирующую» анимацию.

    Текстовые эффекты с применением морфинга 1 0 1;

    23 • •.:

    - :' •• :!

    ]J S •I S ;

    1 2 S Г ЪШШ Ш$ Рис. 6. 4 1. Создание морфинга с использованием инструмента Envelope Итоги Некоторые анимации не удается легко создать.средствами ActionScript - в таких случаях лучше всего прибегнуть к редактированию текста в векторной форме. Если править форму каждой буквы по отдельности, задача окажется весьма трудоемкой. Мощный (хотя и не прощающий ошибок пользователя) инструмент Envelope позволяет работать с несколькими буквами, как с единым целым. В этом трюке показано, как организовать постепенное изменение формы текста. Если вам потребуется создать более сложный морфинг, попробуйте отредактировать текст во внешнем векторном редакторе (таком, как Freehand или Illustrator или даже в одной из последних версий Photoshop) и импортировать графику в Flash командой File • Import.

    ГЛАВА Работа со звуком Трюки № 52- На собственном опыте знаю, что многие веб-дизайнеры разделяют распространенное заблуждение по поводу звука. Это заблуждение можно сформулировать примерно так:«Я не профессиональный художник, но это не мешает мне рисовать картинки и строить симпатичные веб-сайты. Я не музыкант, и это мешает мне создавать звуки и музыку для моих сайтов». Такой подход годится для дизайнера HTML-сайта, которому практически не приходится работать со звуком, но когда вы имеете дело с анимацией в Веб, отсутствие звукового сопровождения оборачивается крупным недостатком. Звук является одним из важнейших аспектов анимации и интерактивности. Попробуйте поработать на Flash-сайте с отключенным звуком или поиграть в Quake на 20% громкости. Получается совсем не то! Помимо создания собственных звуковых файлов есть и другой путь - приобрести компакт-диск с готовыми звуковыми материалами. Однако содержимое таких дисков обычно делится на две категории: «используется повсеместно и всем надоело» или «настолько дико, что никто не захочет слушать». К сожалению, поддержке звука в области веб-дизайна еще не уделяется должного внимания. Все мы знаем, как оптимизировать растровое изображение для Веб без создания лишних неровностей контуров или нежелательной зернистости/ цветового шума, но оптимизация звука редко выходит за пределы назначения частоты оцифровки МРЗ при экспортировании с целью уменьшения размеров файла. Однако в технологии оптимизации звука тоже присутствуют свои «неровности» и «шумовые эффекты» (шум оцифровки). Вы должны знать о них, чтобы добиться оптимального соотношения «размер файла/качество».

    ПРИМЕЧАНИЕ Звуковые данные загружают канал связи интенсивнее, чем остальные составляющие ролика (за исключением разве что видеоданных), поэтому очень важно, чтобы звук был как можно лучше оптимизирован в любом веб-содержании;

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

    Создание синтезатора речи Также мы рассмотрим некоторые проблемы, из-за которых звук в Flash работает не так, как описано в документации (в прошлом эти проблемы отбили у многих дизайнеров всякое желание экспериментировать со звуком). Заодно будут представлены некоторые трюки из области работы со звуком. Собственно, эти приемы названы «трюками» только из-за своей нестандартности например, методика голосового ввода и вывода на базе Flash. Во многих функциях создания сложных звуковых эффектов задействованы последние усовершенствования Flash (например, класс Microphone и более тонкие возможности вроде повышения точности хронометража и общей стабильности Flash Player). А это означает, что некоторые из представленных звуковых трюков будут работать только в последних версиях Flash.

    ТРЮК Создание синтезатора речи Синтез речи повышает гибкость реализации без увеличения объема передаваемых данных — отпадает необходимость в предварительной записи или приеме заранее записанных звуков.

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

    Проблема лазера В основу многих трюков заложено нестандартное применение стандартных приемов и технологий. История науки полна примеров неожиданного применения технологий - например, лазеров. Мало кто мог предположить, что лазеры будут использоваться во всех областях, от военного дела до хирургии, от прослушивания музыки и просмотра фильмов до ведения международных телефонных переговоров. Давайте посмотрим, как использовать тривиальное на первый взгляд событие onSoundComplete для построения синтезатора речи в Flash.

    Событие Sound.onSoundComplete Как только в Flash MX появился метод Sound.onSoundComplete(), я сразу же подумал: «Здорово! Теперь звуки можно легко и точно синхронизировать, и я смогу создать виртуальный микшерный пульт». И это действительно так - точность события onSoundComplete на порядок превышает частоту смены кадров, поэтому оно гораздо точнее решения с ключевыми кадрами и onEnterFrame, применявшегося в Flash 5. События onSoundComplete, как и любые другие события, могут задерживаться из-за большого количества параллельных вычислений, особенно анимации, Здесь и далее под «фрагментами» имеются в виду samples. — Примеч. перев.

    Глава 7. Работа со звуком интенсивно расходующей ресурсы процессора. Чрезмерная нагрузка на Flash Player приведет к задержкам при воспроизведении, так что не перестарайтесь! Взгляните на следующий фрагмент, позаимствованный из файла groovyL.oop.fla, размещенного на веб-сайте книги: function nextSoundO { myLoop.start О;

    } myLoop = new Sound(this);

    myLoop.attachSound("groovy"): myLoop.start О;

    myLoop.onSoundComplete = nextSound: Чтобы этот код работал, на панели Library должен присутствовать файл с идентификатором компоновки groovy. Данное требование является стандартным при работе со звуком на сценарном уровне, однако именно с его нарушением связано большинство неудач при воспроизведении звука. Выполните следующие действия: 1) после импортирования звукового файла в Flash (команда File • Import • Import to Library) щелкните на ресурсе на панели Library правой кнопкой мыши (Windows) или щелкните с нажатой клавишей §€ (Мае). Выберите в открывшемся контекстном меню команду Linkage;

    2) в диалоговом окне Linkage Properties (рис. 7.1) введите в поле Identifier идентификатор компоновки groovy. Вообще говоря, идентификатор может быть произвольной строкой, но не выбирайте его слишком длинным, сложным или трудно запоминаемым, потому что точно такой же текст нужно будет повторить в программе (заключив его в кавычки);

    E p r infiist frame x ot Рис. 7. 1. Окно Linkage Properties с определением идентификатора компоновки groovy 3) установите флажок Export for ActionScript. При этом флажок Export in First Frame автоматически устанавливается и становится доступным. Оставьте его установленным. В процессе компиляции SWF Flash проводит поиск по всем временным диаграммам и проверяет порядок присоединения всех символов. На основании полученных результатов упорядочивается содержимое SWF-файла. Далее при пересылке SWF через Веб символы загружаются в Flash Player в порядке использования.

    Создание синтезатора речи Символы, подключаемые к временным диаграммам только на сценарном уровне, на стадии компиляции не видны, поэтому по умолчанию Flash не включает их в SWF, предполагая, что они нигде не используются. Установка флажков Export for ActionScript и Export in First Frame отменяет это правило по умолчанию;

    фактически, вы говорите Flash: «Эти символы будут использоваться в сценариях, поэтому их нужно включить в SWF». Однако при этом Flash Player вынужден загружать звук еще до того, как кадр 1 появится на экране. Более грамотное решение - поместить звук в анимационный клип и запретить его немедленное воспроизведение командой Sound.stop(). Затм клип помещается в кадр главной временной диаграммы, в который требуется экспортировать звук (то есть кадр, предшествующий использованию звука). Впрочем, не будем отвлекаться - предварительная загрузка звука выходит за рамки основной темы трюка. В предыдущем листинге groovyLoop.fIa звук с идентификатором компоновки groovy присоединен к экземпляру Sound с именем myLoop. По завершении воспроизведения текущего звука при обработке события onSoundComplete вызывается функция nextSound(), которая снова включает воспроизведение. Так чего же мы добились? Того же эффекта можно было добиться и проще: myLoop = new Sound(this): myLoop.attachSound("groovy");

    myLoop.start(0. 1000);

    Метод Sound.start() в цикле воспроизводит звук groovy 1000 раз. Однако главным преимуществом события onSoundComplete является его динамический характер. Функция обратного вызова (в данном случае nextSound()) может выбрать другой звук и запустить его после воспроизведения текущего звука. Таким образом создаются динамические звуковые дорожки, содержимое которых изменяется в интерактивном режиме или на основании результатов обработки других событий. Мы не будем слишком подробно рассматривать этот процесс, так как он вполне стандартен и не может считаться частью трюка. Для достижения желаемой цели будет использовано несколько неожиданное свойство хорошо известного процесса.

    Синтез речи и Flash Так уж получилось, что я впервые узнал о событии onSoundComplete в то время, когда занимался специализированными программами для слабовидящих (в частности, преобразующими веб-содержимое в голосовой поток). Программы были действительно замечательные, но «весили» более 10 Мбайт - а ведь в те времена, когда мы возились с приставками Commodore 64 и Atari, программа синтеза речи занимала около 32 Кбайт. Фокус был основан на использовании отдельных фонетических единиц, называемых аллофонами, - таких, как звук «ои» в слове «you» или «th» в «the». Я заподозрил, что программы синтеза речи на старых 64-килобайтных компьютерах каким-то образом комбинировали аллофоны при помощи чего-то наподобие onSoundComplete. И уж во всяком случае, для решения этой задачи 10 Мбайт было слишком много. Так мне пришла в голову мысль о создании этого трюка.

    Глава 7. Работа со звуком Хотя сейчас мало у кого остались 8-разрядные компьютеры, в Интернете можно найти множество программных эмуляторов. В результате поиска по ключевым словам «8-bit emulation» или «8-bit emulation allophone» в моей любимой поисковой системе (http://vivisimo.com) обнаружилось множество сайтов, посвященных эмуляторам. Многие эмуляторы позволяют эмулировать устройства речевого синтеза, существовавшие для тех систем.

    С точки зрения фонетики Импортировать аллофоны в Flash было проще простого. При помощи Adobe Audition (звуковой редактор) я: • удалил все пропуски, не содержащие звука, в начале и конце каждого фрагмента;

    • удалил щелчки в начале и конце фрагментов (применяя эффекты нарастания и затухания звука);

    • нормализовал все фрагменты, чтобы они имели одинаковую громкость и мощность сигнала;

    • оптимизировал фрагменты для использования в Веб. В результате образовалась библиотека синтезированных голосовых фрагментов, каждому из которых были присвоены имя и идентификатор компоновки, идентичный одному из аллофонов (рис. 7.2). Если вы не готовы повторить этот труд, загрузите файл speechfinal.fla с импортированными аллофонами с сайта книги.

    *?ЩШШШ Mm ae Sound Sound Sound Sound Export: a Ш Export: aa Export: aer Export: ar Export;

    b Export: bb Export: с Export: ch Export: dc •J;

    a y Sud on Sud on Sud on Sud on Sud on 4$ c k Рис.

    7.2. Панель Library со звуковыми файлами аллофонов Создание синтезатора речи Старые 8-разрядные синтезаторы речи не преобразовывали традиционное написание в фонетический текст. Например, чтобы синтезатор произнес слово «knowledge», надо было запросить у него фонетический эквивалент - например, «nnolej» или нечто похожее. Программа писалась в демонстрационных целях, поэтому я ограничился написанием фонетического синтезатора речи. Если хотите прославиться, попробуйте создать программу преобразования традиционного написания в фонетическое произношение (начните с технических статей по лингвистике, которые можно найти в Веб). Итак, я присоединил простой код обработки строк в приведенному ранее коду вывода звука. Полученная программа берет строку, образованную из аллофонов, и преобразует ее в простую очередь, обслуживаемую функцией косвенного вызова onSoundCompleteQ: makePhrase = function () { i f (soundCount

    speech.attachSound(aPhones[soundCount]);

    speech. startO: } else { delete speech.onSoundComplete;

    } function say(phrase) { var i = j=0: aPhones = new ArrayO: aPhones[0] = "": for (i=0;

    i

    i++) { i f (phrase.charAt(i) != "|") { aPhones[j] += phrase.charAt(i) i f (phrase.charAt(i) == " ") { aPhones[j] = "space";

    } } else { a Phones[++j] = "";

    speech.attachSound(aPhones[0]);

    speech. startO;

    speech.onSoundComplete = makePhrase: soundCount = 0;

    soundMax = j - 1 : } function soundlnitO { speech = new Sound(this): } soundlnitO;

    say("h|e|ll|oo| | | | | |h|ow| |ar| |y|ouu| | | | |tt|u|d|ay|");

    stopO;

    К сожалению, имена некоторых аллофонов слишком похожи, что затрудняет их выделение из строки. Например, сочетание «ооо» можно записать в виде «о о о», «о оо», «оо о», и все варианты будут звучать по-разному. В программе аллофоны Глава 7. Работа со звуком разделяются символом |. «Чистый» программист переименовал бы аллофоны в «ol» и «о2», чтобы эта проблема вообще не возникала, но мой внутренний дизайнер воспротивился такому решению, потому что оно затрудняет ручное построение фонетических строк - «у|оо» выглядит понятнее, чем «у|о2». Предположим, программа должна произнести слово «hello». Первая строка приводит синтезатор в движение: она передает произносимый текст в виде строкового аргумента с фонетическим произношением функции say(): say("h|e|ll|oo|");

    Функция say() создает новый массив, который заменяет существующий массив с тем же именем, поэтому стирать данные, оставшиеся от предыдущих вызовов функции, не нужно. По переданной строке массив аллофонов заполняется следующим образом: aPhonesCO] = "h" aPhones[l] = "е" aPhones[2] = "11" aPhones[3] = "oo" Затем мы связываем первый звук «h» с экземпляром Sound, после чего при помощи события onSoundComplete последовательно присоединяем звуки «е», «11» и «оо» по мере завершения очередного аллофона. Задача решается функцией makePhrase(), которая подключает следующий звуковой файл к последовательности аллофонов aPhones до тех пор, пока не будут озвучены все элементы массива. Просто, не правда ли? У нас получился классный эффект «компьютерного голоса» из старого научно-фантастического фильма. Чтобы прослушать результат, запустите ролик speech_final.fla. Напоследок стоит упомянуть об одном «трюке внутри трюка»: обратите внимание - мы используем всего один экземпляр Sound вместо того, чтобы использовать по одному экземпляру на каждый звуковой файл, что привело бы к увеличению объема кода и появлению лишних циклов for. Это возможно благодаря тому, что метод Sound.attachSoundQ можно вызывать столько раз, сколько потребуется, а работает он довольно быстро. Программист, имеющий опыт работы со звуком в Flash, увидит два интересных побочных эффекта: • достаточно создать только одну функцию обратного вызова для onSoundComplete вместо того, чтобы создавать по одной функции для каждого экземпляра Sound;

    • Flash поддерживает восемь звуковых каналов, но в обычной ситуации работать с отдельными каналами невозможно. Flash распределяет каналы автоматически, но при сложном управлении звуком из сценария это может оказаться нежелательно. Вместо этого можно создать восемь экземпляров Sound (channelO- channel7), а затем перераспределить звуки для динамического воспроизведения на каждом экземпляре методом Sound.attachSoundQ. В результате вы получите восемь экземпляров Sound, напрямую соответствующих восьми звуковым каналам.

    Итоги Синтезатор речи на базе Flash выглядит особенно впечатляюще, потому что весь механизм синтеза реализован в SWF-ролике - никакие внешние модули им не Говорящий аватар используются. Хотя на рынке представлен целый ряд коммерческих программ синтеза речи (например, Windows-Eyes от GW Micro - http://www.gwmicro.com), для их работы необходим класс Accessibility, использующий Windows ActiveX. Наш синтезатор прекрасно работает в любой системе с полноценной поддержкой звуковых возможностей Flash Player. Более того, в написанной вами программе пользователь вообще может не смотреть на экран (представьте себе карманный компьютер, который говорит: «Напоминаю: вы записаны на прием к зубному врачу на 10 часов»). Наконец, даром речи можно наделить устройства с маленькими экранами, чтобы вторичная информация вроде справочного текста не загромождала полезную площадь. Не стоит полагать, что синтез речи пригодится только пользователям с дефектами зрения, - он открывает новые горизонты в организации диалога Flash с пользователем. Сколько новых областей применения вы найдете на этом горизонте?

    № ТРЮК Говорящий аватар Синхронизация анимации головы с синтезатором речи.

    Завершив работу над синтезатором речи (см. трюк 52), я показал его Адаму Филипсу. Через несколько дней Адам нарисовал подходящего персонажа-робота по имени Чарли (рис. 7.3).

    Рис.

    7.3. Робот Чарли Глава 7. Работа со звуком Адам также предоставил полный набор изображений рта для синхронизации изображения со звуком (рис. 7.4). Многие изображения используются сразу несколькими аллофонами. Например, символ JShCh используется при отображении трех аллофонов: «j», «sh» и «ch».

    Рис. 7.4. Полный набор форм рта для английского языка На следующем этапе каждому из 77 аллофонов ставится в соответствие одна из 13 форм рта;

    при наличии этой информации сценарий после распознавания аллофона сможет отобразить нужное изображение. Сначала я разместил все 13 изображений в виде ключевых кадров на экземпляре клипа с именем mouth (рис. 7.5). Затем был создан массив, устанавливающий соответствие между номерами кадров клипа mouth и именами аллофонов. Вместо того чтобы создавать отдельный элемент для каждого аллофона, я создал отдельный элемент для каждой формы рта. Почему? Да потому что форм рта гораздо меньше, чем аллофонов (13, а не 77). При этом использовалась методика ускоренного поиска в массиве (см. трюк 79).

    Говорящий аватар Рис. 7.5. Временная диаграмма клипа mouth Сначала мы создаем массив строк, по одной для каждой формы рта. Каждая строка содержит все аллофоны, связанные с данной формой. Аллофоны дополняются пробелами с обеих сторон, чтобы «аег» молено было отличить от «г».

    var shapes = new АггауО;

    / Определение массива ф р р а с соответствующими аллофонами. / ом т shapesCO] = " space " ;

    ;

    shapes[l] = " b bb m p " y r i;

    shapes[2] = " a aer a ее e err i i " a;

    shapes[3] = " a " ;

    shapes[4] = " г " shapes[5] = " о " ;

    shapes[6] = ' or ow o " y: shapes[7] = ' 00 o ouu w w " u h;

    shapes[8] = ' c d d d h g g h h n n n s t tt z z " k dt g h gn h;

    shapes[9] = ' с e ear k у уу " ;

    shapes[10] = " f u u " h;

    shapes[ll] = 1 C sh j ";

    h 1 shapes[12] = 1 1 11 ";

    shapes[13] = th ";

    Функция mouthAnim() ищет строку аллофона (например, «th») в массиве shapes. Затем по номеру найденного элемента происходит переход к кадру клипа mouth, содержащего наиболее подходящую форму рта. Первая форма находится в кадре 10, вторая - в кадре 20 и т. д. Чтобы лучше понять, как работает алгоритм, снимите комментарии с команды трассировки (выделенной жирным шрифтом) при запуске FLA.

    262 function mouthAnim(phone) { for (var i = 0;

    i

    i++) { i f (shapes[i].indexOf(" "+phone+" ") != -1) { // trace(phone + " found in "+ shapes[i]);

    mouth.gotoAndStop((i+l)*10);

    break;

    Глава 7. Работа со звуком Изменения программного кода по сравнению с синтезатором речи (см. трюк 52) выделены жирным шрифтом: makePhrase = function О { i f (soundCount < soundMax) { soundCount++;

    speech.attachSound(aPhones[soundCount]);

    mouthAnim(aPhones[soundCount]);

    speech. startO;

    } else { delete speech.onSoundComplete;

    } function say(phrase) { var i = j = 0;

    aPhones = new ArrayO;

    for (i = 0 ;

    i < phrase.length;

    i++) { i f (phrase.charAt(i) != "|") { aPhones[j] += phrase.charAt(i);

    i f (phrase.charAt(i) == " ") { aPhones[j] = "space": } } else { speech.attachSound(aPhones[0]);

    mouthAnum(aPhones[0]);

    speech.startO;

    speech.onSoundComplete = makePhrase: soundCount = 0;

    soundMax = j-1;

    } function mouthAnim(phone) { for (var i = 0 ;

    i

    i++) { if (shapes[i].indexOf(" "+pnone+" ") !- -1) { // trace(phone + " found in "+ shapes[i]);

    mouth.gotoAndStop((i+l)*10);

    break;

    Синхронизация событийных звуков var speech = new Sound(this): var shapes = n w ArrayO;

    e shapes[0] = " space ";

    shapes[l] = b bb m p ";

    a aer ay ее er err i i i ";

    shapes[2] = aa ";

    shapes[3] = г ": shapes[4] = shapes[5] = о ";

    shapes[6] = or ow oy ";

    shapes[7] = 00 ou ouu w wh ";

    shapes[8] = ck d dd dth g gg h hh n ng nn s t t t z zh shapes[9] = с e ear к у yy ";

    1 shapes[10] = " f u uh ";

    1 shapes[ll] = " ch sh j ";

    1 shapes[12] = " 1 11 ";

    1 shapes[13] = " t h ";

    say("h1e111 |oo |h|ow| |a r| |y|ouu| |tt|u|d|ay| stopO;

    I"):

    Синхронизировать движения рта с анимацией можно в приложении Poser (см. трюк 32). Вероятно, вам придется приобрести для этого отдельное приложение - Mimic от фирмы Daz (http://www.daz3d.com). При наличии такого инструментария вы сможете создавать анимированных говорящих персонажей/аватаров или опорные изображения, упрощающие работу над ключевыми кадрами анимации. Хорошим примером профессионального приложения с говорящими аватарами служит Oddcast (http://www.oddcast.com).

    ТРЮК Синхронизация событийных звуков Исправление ошибки синхронизации в Flash.

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

    но предсказать, на каком кадре они закончатся, очень трудно. Например, если запустить звук продолжительностью 1 с на временной диаграмме с частотой 12 fps, то вероятность завершения звука ровно через 12 кадров близка к нулю. Данная «особенность» создает основательные трудности, если вы хотите создать непрерывную серию звуков, связанных с ключевыми кадрами. Если точный номер кадра, в котором закончится звук, является переменной величиной, вы не сможете определить, с какого кадра должен начинаться следующий звук. Предположим, имеются два звуковых файла, song01.wav и song02.wav, которые при последовательном воспроизведении создают единую музыкальную тему. Для точного слияния фрагментов продолжительность звуков должна быть кратна частоте смены кадров. В противном случае продолжительность звука следует Глава 7. Работа со звуком изменить (см. трюк 57) в каком-либо звуковом редакторе (например, Sony Acid, Adobe Audition или Audacity). Чтобы слияние звуков происходило без пауз и наложений, необходимо как избавиться от ошибки синхронизации, так и сделать звуки кратными частоте смены кадров. Если разместить на временной диаграмме два звуковых файла так, чтобы один файл останавливался непосредственно перед началом другого, можно предположить, что переход между звуками в Flash будет плавным. Однако в действительности этого не происходит из-за упомянутой ошибки.

    Рис. 7.6. Смежное размещение двух звуков не гарантирует слитности их воспроизведения Хотя левый звук завершается до того, как начнется воспроизведение правого, они разделяются паузой из-за отсутствия реальной синхронизации. Flash гарантирует синхронизацию только при работе с потоковым звуком (то есть звуком, воспроизведение которого начинается еще до его полной загрузки). Но в некоторых отношениях у потоковых звуков имеются недостатки по сравнению с событийными. В частности, потоковый звук приходится загружать заново при каждом воспроизведении, тогда как событийные звуки остаются в памяти. Прием, представленный в этом трюке, обеспечивает синхронизацию событийных звуков. В сущности, мы обманываем Flash и заставляем его думать, что временная диаграмма содержит потоковые звуки, тогда как в действительности на ней размещены событийные звуки. Создайте ключевой кадр на кадре 5 временной диаграммы и свяжите с ним звук (рис. 7.7). 1;

    io S К п У~1 » Рис. 7.7. Размещение потокового звука на временной диаграмме для обеспечения синхронизации Удалите с этого слоя все кадры, следующие за кадром 5. Не снимая выделения с ключевого кадра, сделайте этот звук потоковым (выберите строку Stream в раскрывающемся списке Sync на панели свойств). Наконец, щелкните на кнопке Edit на панели свойств и уменьшите громкость потокового звука до нуля при помощи контрольных точек Volume Envelope (рис. 7.8). В результате получается потоковый звук с нулевой громкостью, продолжительность которого составляет 1 кадр. Благодаря ему механизм обработки звука Flash Player считает, что временная диаграмма содержит потоковый звук, и начинает Преобразование монофонического звука в стереофонический синхронизировать все звуки (в том числе и событийные) на временной диаграмме. Тестирование показывает, что прежде не синхронизированные звуки воспроизводятся практически безупречно. Это позволяет создавать более предсказуемые и надежные звуковые переходы.

    Effect: Cs m ut o O K Cne acl Рис. 7.8. Управление громкостью звука Итоги Из-за невозможности синхронизации событийных звуков многие дизайнеры считают, что в Flash со звуком вообще невозможно сделать что-то серьезное (особенно до выхода Flash MX и появления события Sound.onSoundComplete). Создание SWF-ролика со потоковым звуком-«катализатором» и его загрузка функцией loadMovieNum() позволяют легко создать загружаемую звуковую дорожку, которая сочетает преимущества многократного использования событийных звуков с преимуществами потоковых звуков. Если вам потребуются более совершенные средства синхронизации, воспользуйтесь якорными точками (см. трюк 59).

    Преобразование монофонического №55 звука в стереофонический ТРЮК Создание стереозвука посредством разбиения монофонического звука на два канала без увеличения объема пересылаемых данных.

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

    2ВВ Глава 7. Работа со звуком Если звук является стереофоническим, левый канал направляется на один динамик, а правый канал - на другой. Громкость двух каналов изменяется при помощи звуковой огибающей (вызывается кнопкой Edit на панели свойств) или из кода ActionScript (метод Sound.setVolumeQ). Также существует возможность изменения баланса, то есть относительной громкости каналов (см. трюк 60), с использованием методов Sound.setPan() и Sound.setTransformQ. Преобразование монофонического звука в стереофонический с использованием звуковой огибающей начинается с импортирования звука в Flash командой File • Import • Import to Library. Тип импортированного звукового файла (моно или стерео) определяется по количеству форм сигнала, отображаемых в библиотеке, одна форма для монофонического сигнала, две - для стереофонического. На панели Library щелкните на импортированном звуковом файле правой кнопкой мыши (Windows) или щелкните с нажатой клавишей §€ (Мае). Выберите в контекстном меню команду Properties. На экране появляется диалоговое окно Sound Properties. Выберите в списке Compression строку МРЗ (рис. 7.9). Compression::1мРЗ Bit fate: ;

    ••;

    . ! 16 kbps \^}\Шт • v \yf.

    '-Preprocessing;

    >\:Х:даУа1 $Щтщ::тт Quaiity: ;

    Best ( 2.7 k8 f 1.1% of original Рис. 7. 9. Параметры экспортирования звука в диалоговом окне Sound Properties На практике почти всегда используется алгоритм сжатия МРЗ, поскольку он существенно превосходит своих конкурентов по соотношению «размер файла/ качество звука». Недостатком формата МРЗ можно считать то, что он требует восстановления сжатых данных на стадии выполнения, а эта работа может оказаться непосильной для старых компьютеров. Если объем пересылаемых данных не важен (например, при создании автономных приложений) и если вам приходится поддерживать старые компьютеры, попробуйте использовать формат RAW он не требует восстановления на стадии выполнения, а следовательно, использует меньше вычислительных мощностей. Экспортируемый звук может быть либо монофоническим, либо стереофоническим. При сжатии МРЗ с частотой более 20 Кбит/с лучше выбрать стереофонический формат, так как алгоритм МРЗ хорошо сжимает стереосигналы. Для частот ниже 20 Кбит/с стереофонический формат не поддерживается. Низкие частоты дискретизации хорошо подходят для озвучивания пользовательского интерфейса и заметно уменьшают общий объем звуковых данных;

    и все же было бы неплохо иметь возможность экспортирования в стереофоническом формате и на частоте 16 Кбит/с. Чтобы стереофонический формат был доступен на низких частотах дискретизации, следует создать звуковую огибающую. Выделите ключевой кадр на временной диаграмме. На панели свойств выберите звуковой файл в раскрывающемся списке Sound. Убедитесь в том, что в группе Sync выбраны параметры Event/Repeat/1 (рис. 7.10).

    Преобразование монофонического звука в стереофонический А.

    •Sud i a l on: p d Eet Csm f c:.u o t Sn:.vn vtfiBitpa vi 1 yc Eet R L3s236.0kB eet 44k№Stereo Рис. 7.10. Параметры синхронизации звука Щелкните на кнопке Edit. На экране появляется окно Edit Envelope (рис. 7.11).

    Effect: i C so ut m •!>!

    Рис. 7. 1 1. Окно Edit Envelope Два графика формы сигнала в этом окне представляют два звуковых канала, а линия представляет уровень громкости. Если два канала имеют одинаковую форму огибающей (по умолчанию), в динамиках будет воспроизводиться исходный монофонический звук. Изменение огибающих создает различия между громкостью двух каналов. Подача двух уникальных сигналов на динамики создает стереофонический эффект. Звуковая огибающая содержит до восьми контрольных точек (маркеров, которые можно перетаскивать мышью). Чтобы создать новую контрольную точку, щелкните на любом участке огибающей, не содержащем контрольной точки. Чтобы удалить контрольную точку, перетащите ее мышью за пределы панели. На многих сайтах для управления звуком используется ActionScript. Чтобы использовать представленную методику для звуков, присоединяемых на стадии выполнения методом MovieClip.attachSoundO, создайте клип с ключевыми кадрами, к которым присоединены звуки. Для каждого ключевого кадра с ассоциированным Глава 7. Работа со звуком звуком также определите операцию stop(). Кроме того, определите операцию stop() для первого кадра (рис. 7.12).

    Рис. 7.12. Клип со звуками и операции stop() на временной диаграмме Код ActionScript для управления звуком должен выглядеть примерно так (предполагается, что клипу со звуками на панели свойств было задано имя экземпляра soundHolder): mySound = new Sound(soundHolder): // Определение объекта Sound soundHolder.gotoAndPlayC'soundl");

    // Запуск звука mySound.stopO;

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

    Звуковые эффекты в реальном времени Реализация звуковых эффектов в реальном времени на стороне клиента снижает объем пересылаемых данных. Реверберация и другие эффекты сделают звуковое оформление вашего ролика более разнообразным. Метод Sound.start() позволяет воспроизводить звук с заданным смещением: Sound.start(cwe/z/ewtfe. количество): Звук начинается с заданного смещения и воспроизводится заданное количество раз, однако не существует простых средств для воспроизведения звука с начальным и конечным смещением. Эта задача решается методом Sound.startEnd(startTime, endTime) из следующего фрагмента: Sound.prototype.startEnd = function(startTime. endTime) { var duration = (endTime - startTime)*1000;

    this.startCstartTime. 1);

    this.endSound = setlntervaKendTimer, duration, this);

    • } endTimer = function (arg) { arg.stopO;

    Звуковые эффекты в реальном времени clearlnterval(arg.endSound):

    }: mySound = new Sound(this);

    mySound. attachSoundC"UlSound");

    mySound.startEnd(0.5, 0.7);

    Метод Sound.startEndQ позволяет выделять небольшие фрагменты из существующих звуков, уже включенных в библиотеку, избавляя вас от необходимости создавать их отдельно. Возможность выделения подобных фрагментов может использоваться при создании интерактивных пультов микширования. Кроме того, это хороший способ имитации режима быстрой перемотки, реализованной в некоторых проигрывателях компакт-дисков, - проигрыватель воспроизводит односекундный образец для каждых 10 секунд звукового материала, позволяя быстро найти нужную точку. Еще один трюк, маскирующий факт использования одних и тех же базовых материалов, - добавление эффектов реального времени. В следующем фрагменте эффект реверберации создается воспроизведением двух версий одного звука с небольшим смещением по времени: mySound = new Sound(this);

    mySoundEcho = new Sound(this);

    mySound.attachSoundC"UlSound");

    mySoundEcho.attachSoundC'UISound");

    mySound.start(0. 1);

    mySound.start(0.1. 1);

    Если последняя строка имеет вид mySound.start(0.001. 1);

    возникает эффект фазового сдвига. Повышение громкости до уровня выше 100% создает эффект дисторсии: mySound = new Sound(this);

    mySoundEcho.attachSoundC"UlSound");

    mySound.start(0. 1);

    mySound.setVolume(200);

    Flash позволяет задавать отрицательные уровни громкости. При этом создается версия исходного сигнала с фазовым сдвигом на 180°, которая может использоваться для создания фазовых эффектов, особенно в сочетании с эффектом реверберации. Тем не менее, восприятие таких эффектов требует хорошего звукового оборудования и грамотной расстановки динамиков (что на практике встречается гораздо реже, чем вы думаете). Как видите, несложные приемы позволяют с максимальной эффективностью использовать один-два звуковых файла, входящих в SWF, за счет обработки звука в реальном времени. Это особенно важно при написании звукового Flash-содержания для приложений с крайне жесткими ограничениями по объему пересылаемых данных - особенно для рекламных баннеров, которые часто ограничиваются объемом 12 Кбайт.

    270 ТРЮК Глава 7. Работа со звуком Быстрое создание звукового №57 сопровождения для пользовательского интерфейса Звуки щелчков на кнопках и другие звуковые эффекты пользовательского интерфейса сможет создавать даже тот, кто не имеет музыкального слуха, сильно занят, просто ленив... или сочетает все эти качества. К числу важнейших ресурсов в любом Flash-ролике относятся звуки, воспроизводимые при взаимодействии с элементами пользовательского интерфейса. Вебдизайнеры традиционной школы не особенно беспокоятся о звуковом сопровождении пользовательского интерфейса, поскольку браузер имеет стандартное озвучивание для щелчков, но на Flash-сайтах звуковой дизайн играет более важную роль. Внимательное изучение хороших Flash-сайтов показывает, что звук является одним из важнейших факторов в общем впечатлении от сайта. Попробуйте просмотреть заставку сайта Mondo (http://www.mondo.pl) со звуковыми эффектами и без них. Этот пример наглядно показывает, до какой степени небольшое звуковое сопровождение меняет пользовательский интерфейс. Однако большинство дизайнеров не умеют создавать звуки пользовательского интерфейса «на пустом месте» (в отличие от других базовых ресурсов Flash). Как правило, они используют одни и те же общедоступные звуковые эффекты, потому что создать хороший эффект без профессионального звукового оборудования довольно трудно. Видимо, многие дизайнеры не обладают музыкальным слухом, предпочитают использовать готовые звуки из бесплатных источников или еще хуже - заимствовать их из малоизвестных тем Windows. А впрочем, дело скорее не в лени, а в расстановке приоритетов. В настоящем трюке представлено руководство по ускоренному созданию звукового оформления пользовательского интерфейса для занятых и ленивых. Поиски веб-ресурсов с информацией о звуке лучше всего начать с сайта Sonify.org (http://www.sonify.org), посвященного интерактивному аудио для Веб и беспроводных устройств. На сайте имеются актуальные ссылки для тех, кто захочет больше узнать о звуке в Flash. К сожалению, многие звуки, распространяемые на коммерческой основе, применяются слишком часто. Количество предлагаемых звуковых файлов огромно, но самые полезные из них встречаются в Веб на каждом шагу! У веб-дизайнера со средней музыкальной подготовкой, не отличающего контрапункт от контрабаса, есть два выхода: • • искать там, где еще не искали другие;

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

    Устаревшие программы Устаревшими программами (abandonware) называются программные продукты, коммерческий жизненный цикл которых уже завершился. На такие продукты Создание звукового сопровождения для пользовательского интерфейса еще распространяются соглашения об авторских правах, но никто не следит за их соблюдением, потому что у продукта нет платежеспособной клиентской базы. В поисковой системе Google вы найдете множество сайтов с устаревшими программами - выполните поиск по ключевому слову «abandonware» и загляните в подраздел «games» на найденных сайтах. Речь идет о действительно старых играх, 10- и 20-летней давности, работающих в DOS и не использующих аппаратное ускорение. Для нас эти игры представляют интерес по следующим причинам: они разрабатывались до широкого распространения формата МРЗ, поэтому их звуковые ресурсы обычно хранятся в более простых форматах - например, WAV. WAV-файлы очень легко импортируются в Flash (в отличие от файлов МРЗ, разнообразие форматов которых часто сбивает с толку фильтр импортирования Flash). Попробуйте заглянуть в подкаталог Sound и поискать в нем звуки для пользовательского интерфейса;

    • хотя с момента издания первых устаревших игр игровые технологии прошли огромный путь, звук щелчка на кнопке так и остался звуком щелчка на кнопке, да и технология создания звука тоже не претерпела особых изменений. Вероятно, вы уже поняли мою мысль - если игра отнесена к категории устаревших продуктов, скорее всего, звуковое сопровождение ее пользовательского интерфейса тоже не защищается на коммерческой основе, и никто не будет возражать, если вы им воспользуетесь. Конечно, всегда остается вероятность того, что звуки в старых играх были позаимствованы по лицензии из библиотек, существующих и в наши дни, несмотря на прошедший срок. Авторское право не перестает действовать только потому, что его объект утратил коммерческую привлекательность, и его владельцы имеют законное право защищать свои продукты. Так что в вашем распоряжении остается еще один вариант: создание собственных звуков. • Растяжение времени Современные настольные системы способны на серьезную обработку цифрового звука, но не стоит удивляться, если время обработки большого звукового файла будет измеряться в минутах, а не в секундах. Методика растяжения (и сжатия) звуков по времени позволяет изменять продолжительность звука при сохранении тональности тона или темпа. Этот прием используется при звукозаписи для модификации сэмплов, чтобы они лучше соответствовали общей композиции. В нашем трюке используется тот факт, что музыкальное произведение, воспроизводимое за несколько минут, можно преобразовать в звук продолжительностью в доли секунды с сохранением тональности. Даже простые, бесплатные звуковые редакторы способны творить настоящие чудеса. Тем не менее, для общего редактирования звука я обычно использую Adobe Audition (формально - CoolEdit). В настоящее время этот продукт существует только на платформе Windows. Фирма Adobe предлагает 30-дневную полноценную пробную версию. За это время вы успеете создать все звуковые эффекты пользовательского интерфейса, которые вам когда-либо понадобятся. После этого созданные звуки можно будет использовать много лет.

    Глава 7. Работа со звуком Бесплатный альтернативный звуковой редактор Audacity (http://audacity.sourceforge.net) содержит все функции, которые вам могут понадобиться. Audacity распространяется с открытыми исходными текстами и работает на платформах Windows, Mac OS 9/X и Linux/Unix. Название Audacity не зря напоминает Audition - сходство не ограничивается именами и распространяется на функциональность! Далее приводятся краткие инструкции по работе с Audacity и Audition. Конечно, на рынке существует множество других звуковых редакторов, но эти две программы особенно хорошо приспособлены для редактирования звука, предназначенного для использования в Веб. Чтобы создать собственную коллекцию звуков пользовательского интерфейса, загрузите любой музыкальный фрагмент с секциями, не содержащими ударных. На рис. 7.13 показано, как выглядит форма сигнала с такой секцией в Audition. i tnf-T! r-----'-цдщ ЩЩ:

    «U Щ •s m • Г гШМШМШ;

    ШШМ Ш Щ 1J ЯШ! :!,, jib,, 0:00. Рис, 7. 1 3. Редактирование звука в окне Organizer редактора Adobe Audition Выделите нужную секцию музыкального фрагмента (длиной примерно 10 с или более) и удалите остальные звуковые данные, выделив их и нажав клавишу Delete. Если вы работаете в Audition, выделите в окне Organizer (левая панель на рис. 7.13) вкладку Effects и найдите эффект Real Time Effects • Time/Pitch • Stretch (если окно Organizer отсутствует на экране, откройте его клавишами Alt+9). Дважды щелкните на слове Stretch, чтобы открыть вкладку Constant Stretch окна Stretch (рис. 7.14). Задайте параметру Precision значение High Precision, а параметру Stretching Mode значение Time Stretch (Preserves Pitch). В группе Pitch and Time Settings установи Создание звукового сопровождения для пользовательского Интерфейса те флажок Choose Appropriate Defaults. Справа от бегунка Stretch % задайте параметру Length значение 3 с (или около того). Щелкните на кнопке ОК.

    C n t n Stretch j Gi i g Stietch ) o sa t ldn Stretch* F se Tmo at r e p R t L n t Ta s oe ai o e gh r np s J 5 8 8 [1 329 joe j j nn Presets Cutting Power Double Speed Fast Talker Helium Lower Pitch Raise Pitch Slow Down Speed Up Add J. :•;

    ::. j ;

    Pe i i n :r;

    ~ r cso ;

    СLow Precision •;

    • • • Г Medium Precision & High Precision::;

    Pit.:hand Типе settings Г <^ Time Stretch (preserves pitch] :

    ~~ Hz. I ^ Г pitch Shift (presefves temfKjf •.: С Resampte (preserves neiiheij riate defaults Рис. 7.14. Окно Stretch в редакторе Audition Если вы работаете в Audacity, найдите нужную 10-секундную секцию, удалите все остальное и выделите полученный участок. Выполните команду Effect • Change Tempo. На экране появляется диалоговое окно Change Tempo (рис. 7.15). В поле Length (seconds) этого окна введите значение около 3 с. Щелкните на кнопке ОК.

    | Length (seconds) (тот to к!

    В Cancel Рис. 7.15. Окно Stretch в редакторе Audacity Если новая продолжительность звука меньше исходной, фактически, происходит сжатие звуковых данных по времени. При этом происходит следующее: • звук становится неузнаваемым, а в процессе сжатия теряется достаточно информации, чтобы возврат к оригиналу стал невозможным;

    Глава 7. Работа со звуком • благодаря сохранению тональности результат звучит не хуже оригинала. Наверное, вы уже догадались, почему я предложил выбрать фрагмент без звучания ударных - при сжатии не сохраняется темп;

    • полученный звук «отдаленно напоминает» оригинал, но отличается от него по звучанию. Теперь вы можете выделить весь результат (или его часть) и восстановить его. После завершения процесса у вас появляется фрагмент, который звучит так, словно он был создан профессиональным музыкантом (в общем-то, так оно и есть - только этим музыкантом были не вы!). Если повторить тот же трюк с другим фрагментом исходного произведения, вы получите другой звук, достаточно близкий к первому. Таким способом можно создать набор звуков для оформления пользовательского интерфейса, следующих общей музыкальной теме. На первый взгляд кажется, будто прием растяжения/сжатия (а также связанный с ним эффект изменения тональности при сохранении продолжительности звука) является чем-то узкоспециализированным, однако разработке звука Flash он приносит огромную пользу. После знакомства с ним становится непонятно, как же вы раньше работали со звуком в Flash. Например, если продолжительность созданных вами звуков превышает один кадр Flash (1/12 с по умолчанию) и вы хотите, чтобы другой звук начался сразу же после окончания предыдущего звука (см. трюк 54), растяните или сожмите его до ближайшей величины, кратной частоте смены кадров Flash. Небольшое изменение продолжительности остается незаметным для слушателя. А вот еще несколько ситуаций, в которых применяется растяжение/сжатие: • Объединение звуков из разных источников. Вполне естественно предположить, что все звуки пользовательского интерфейса должны иметь одинаковую продолжительность, а растяжение лучше простого отсечения, создающего явное впечатление незавершенности звука. • Создание голосов для «мультяшных» персонажей. В результате преобразования происходит либо изменение тональности с сохранением продолжительности, либо наоборот. В обоих случаях полученный звук звучит более разборчиво и профессионально, чем при простом ускорении. • Изменение комментария в соответствии с продолжительностью анимации. Допустим, имеется 12-секундная анимация и комментарий к ней, который продолжается 15 с. Первое побуждение - изменить продолжительность анимации, поскольку кажется, будто изменить продолжительность комментария будет гораздо сложнее. Но стоит овладеть методикой растяжения/сжатия звуков, и все становится очень просто. • Длинная анимация синхронизирована со звуковой дорожкой. Включение новых кадров в анимацию приводит к нарушению синхронизации изображения со звуком. Просто выделите часть звуковой дорожки и слегка растяните ее. Аниматоры будут долго гадать, почему звуковая дорожка так хорошо синхронизируется с анимацией, хотя они удалили 5 кадров из начала ролика и еще 30 кадров из середины. • Новый звук формируется из нескольких существующих звуков, но результат слияния звучит странно, потому что исходные звуки находятся в разной то Оптимизация звука нальности или различаются в других музыкальных аспектах. Проблема решается подгонкой тональности одного звука под тональность других. Наконец, данная возможность сильно поможет веб-дизайнеру, который воображает себя великим певцом, но не может взять высокую ноту.

    Итоги Вероятно, из всего контента Flash звуки используются наименее эффективно. Коммерческие звуковые библиотеки качественно звучат, но дорого стоят. Нет полной уверенности в том, что они идеально впишутся в дизайн вашего сайта, зато велика вероятность их использования на множестве других сайтов. Конечно, вам не хотелось бы идти на подобный риск с графикой, так стоит ли делать то же самое со звуком? Выберите фрагмент музыкального произведения, соответствующий общему настроению вашего сайта, а затем посредством растяжения/сжатия его фрагментов создайте уникальные звуки, которые дополнят графику сайта подходящим звуковым сопровождением. Если вам не хочется заниматься этим, попробуйте воспользоваться звуковыми ресурсами устаревших программ. Хотя эти звуки не являются абсолютно общедоступными и свободными от авторских прав, такой путь все же гораздо лучше «выдирания» звуков пользовательского интерфейса из операционной системы!

    ТРЮК № Оптимизация звука Оптимизация звука в формате МРЗ для Flash.

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

    Устранение шума дискретизации В процессе оцифровки в данные вносится ошибка, называемая ошибкой дискретизации, в результате чего возникает шум дискретизации. Под термином «дискретизация» понимается процесс преобразования аналогового сигнала в цифровой сигнал, принимающий ряд фиксированных значений (называемых уровнями дискретизации). На практике чаще встречается термин «оцифровка», а сигнал, значения которого делятся на уровни дискретизации, называется цифровым сигналом. Именно шум дискретизации создает неприятную пронзительную составляющую в низкокачественных звуковых сигналах и придает неживое, механическое звучание голосу в телефоне.

    Глава 7. Работа со звуком Оцифровка аналогового сигнала дает приближенное представление, состоящее из дискретных уровней, а полученный сигнал имеет ступенчатую форму (рис. 7.16). Точность оцифровки определяется количеством уровней дискретизации. Под шумом дискретизации понимается разность между аналоговой формой сигнала и ее цифровым приближением (цифровой сигнал всегда лишь приближенно представляет исходный аналоговый уровень).

    Рис. 7.16. Аналоговая форма сигнала (кривая) и ее цифровое приближение (темная ломаная линия) Существует два пути снижения шума дискретизации. Стандартный путь основан на снижении размера шага дискретизации за счет увеличения количества уровней. Именно по этой причине 16-разрядный звук (65 536 уровней дискретизации) звучит гораздо лучше 8-разрядного (256 уровней). Однако размер звукового файла также увеличивается вдвое. Второй, нестандартный путь основан на использовании всех доступных уровней дискретизации, обеспечивающем максимально возможную точность оцифрованного сигнала. Кроме того, в отличие от аналогового шума, который может увеличиваться с возрастанием громкости или мощности сигнала, величина шума дискретизации остается постоянной при любой громкости сигнала, поскольку она зависит от расстояния между уровнями дискретизации, а не от амплитуды сигнала. Таким образом, повышение уровня сигнала приводит к заметному снижению соотношения «сигнал/шум». Возьмем две формы сигнала (рис. 7.17). Внизу изображен сигнал, записанный при низкой громкости. Расстояние между уровнями дискретизации относительно велико по сравнению с сигналом, что приводит к снижению разрешения и высокому соотношению «сигнал/шум». На верхнем графике сигнал записан с высокой громкостью, а в его оцифровке задействовано больше уровней;

    такой сигнал обладает гораздо лучшими соотношением «сигнал/шум» и точностью оцифровки.

    Оптимизация звука Чтобы обеспечить максимальный выигрыш, следует увеличить громкость сигнала до такого уровня, чтобы он находился ненамного ниже максимального уровня дискретизации (около 90-95%), представленного пунктирной линией в верхней части рис. 7.17.

    Максимальный уровень дискретизации Рис. 7.17. Улучшение соотношения «сигнал/шум» посредством записи на 90-95% от максимального уровня дискретизации Громкость сигнала увеличивается либо увеличением амплитуды с применением максимизирующего фильтра, либо нормализацией. Мы рассмотрим процесс нормализации на примере Adobe Audition. Максимизация сигнала выполняется при помощи особой разновидности фильтров сжатия, которые динамически повышают уровень мощности на всех частотах к уровню насыщения без его достижения. Данная методика начала активно применяться в 1990-х годах. Любой владелец фонотеки знает, что для записей более раннего периода был характерен относительно низкий уровень басов и меньшая общая выразительность, тогда как более новая музыка (особенно танцевальная) стала более яркой, но не утратила четкости звучания отдельных инструментов. Этот современный стиль стал возможным благодаря применению максимизации. Формат МРЗ хорошо работает с максимизированным звуком, и импортирование максимизированных аудиоданных в Flash обеспечивает наилучшее соотношение «качество/размер файла». Опыт показывает, что экспортирование максимизированного звука позволяет создавать ресурсы МРЗ значительно меньшего объема, чем без применения максимизации, с тем же качеством. Впрочем, у этого решения есть и оборотная сторона: программное обеспечение максимизации дорого стоит и применяется только в профессиональных студиях. Нормализация звука не обеспечивает той же эффективности, что максимизация, но зато она реализуется широко распространенным фильтром, входящим в большинство программ звукового монтажа. Далее приводится описание процедуры нормализации звука в двух основных редакторах.

    278 Adobe Audition 1. Откройте звуковой файл в Adobe Audition.

    Pages:     | 1 |   ...   | 2 | 3 || 5 | 6 |   ...   | 8 |



  • © 2011 www.dissers.ru - «Бесплатная электронная библиотека»

    Материалы этого сайта размещены для ознакомления, все права принадлежат их авторам.
    Если Вы не согласны с тем, что Ваш материал размещён на этом сайте, пожалуйста, напишите нам, мы в течении 1-2 рабочих дней удалим его.