Создаем таймер обратного отсчета в программе Sothink SWFQuicker

Воскресенье, 26 Февраля 2012 г. 01:15 + в цитатник

Цитата сообщения novprospekt

Прочитать целиком В свой цитатник или сообщество!

Для создания таймера обратного отсчета будем использовать динамический текст, созданный в программе и сценарий (скрипт), написанный на языке ActionScript.

Динамический (или изменяемый текст) Dynamic Text - это такое текстовое поле, содержимое которого изменяется в процессе воспроизведения флешролика с помощью сценария.
Таймер обратного отсчета, который мы будем создавать покажет нам сколько дней, часов, минут и секунд осталось до наступления того или иного события. Например, до дня рождения близкого человека или до наступления любимого праздника. После того как отсчет будет завершен, будет выведена фраза, которую вы введете в динамическое текстовое поле и в текст самого скрипта. Например, «С Днем Рождения» или «С Праздником!»
Приступим.

1. Откройте программу Sothink SWFQuicker и создайте новый документ.

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 1

2. Настройте рабочую область программы. Рабочее пространство можно редактировать в палитре Properties (Параметров) или еще, очень часто, в терминологии флеш, эту палитру называют "Инспектор свойств" Отображается она (палитра) по умолчанию внизу окна программы. Давайте дальше для удобства будем называть эту палитру – палитрой Properties (Параметров).
Я даю скрин расположения основных палитр программы, которые мы будем использовать. Если какие-то из них будут отсутствовать в окне вашей программы, их можно восстановить, пройдя в панель Меню, затем вкладка Window и проставить галочку у необходимых для работы палитр.

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 2

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 3

Возвратимся к настройке рабочего пространства.
Впервую очередь, в настройку входит задание размеров рабочей области документа (сцены). Установите эти размеры, например, 500 пикс x 380 пикс

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 4

Цвет рабочего поля (Background) выбирается из соображений удобства работы с вводимым текстом и изображениями, а в дальнейшем, если вы специально не делаете заливку фона или не размещаете фоновое изображение, этот цвет не будет отображаться в готовом флешролике. Заданные же вами размеры рабочего поля будут ограничевать сцену готового ролика и все, что будет выходить за заданные размеры, в готовой флешке видно не будет. Так что, будте внимательны, и следите за тем, чтобы все необходимые элементы по размерам помещались на сцене. В дальнейшем, параметры ширины и высоты рабочего поля(сцены) будут фигурировать, как размеры вашего флешролика. Т. е. в нашем случае, оригинальными размерами флешки будут width=500пкс и height=380пикс.
3. Если вы используете фоновое изображение, то вторым шагом будет его открытие и настройка его параметров. В настройку параметров для открытого фонового изображения могут входить - изменение размеров изображения(трансформация) и выравнивание его положения относительно сцены.
На временной шкале выделен слой Layer1
File - Import
Это будет Layer1 - фон
Если изображение для фона больше чем рабочее поле, то с помощью инструмента Трансформация Создаем таймер обратного отсчета в программе Sothink SWFQuicker 5

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 5

(выбрать на панели инструментов) измените его размеры до необходимых. Чтобы выбрать какой –либо инструмент, достаточно щелкнуть по по нему левой кнопкой мыши (ЛКМ) .

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 6

Если выбрать инструмент трансформации, то вокруг изображения появляются маркеры, двигая которые, можно изменить размер картинки до необходимого. Если у вас есть конкретные размеры фонового изображения и они меньше рабочего пространства их можно внести в соответствующие поля палитры Transform. Здесь же можно задать параметры выравнивания изображения относительно сцены. Для этого необходимо внести числовые значения в графы X и Y. Если, например, для нашего случая ширина сцены задана 500 пикс., а высота 380 пикс., то, соответственно, параметры для выравнивания изображения по центру рабочего пространства (сцены) будут для X=250, а для Y=190

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 7

4. Если вы хотите сделать таймер на прозрачном фоне для того, чтобы потом была возможность вставлять его в другие проекты, то сразу можно перейти к созданию таймера.
Для его создания необходимо сделать два текстовых блока.
Первый текстовый блок может быть как Статический(Static) так и Динамический(Dynamic) текстовый блок, назавем его "Заголовок". Как выбрать тип текста. Если вы планируете применять к заголовку какие- либо эффекты движения или хотите чтобы ваш текст был многострочным, то выбирайте тип - Dynamic. В тексте "Заголовок" пишем - о каком событии пойдет речь. Например, " До дня влюбленных осталось…".
Второй текстовый блок обязательно - Динамический(Dynamic) или собственно сам таймер. Назавем назовем этот текстовый блок "Таймер".
Теперь переходим к созданию этих текстовых блоков. Если открывали фоновое изображение на слое Layer 1 , то для введения текста "Заголовок" в палитре временной шкалы создайте новый слой Layer 2, выше фонового Layer 1.

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 8

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

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 9

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 10

После того как мы выбрали инструмент текст и создали поле для введения текста, становится доступно редактирование параметров текста в палитре Properties (Параметров). Здесь можно установить название шрифта,его размер и цвет.

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 11

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

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 12

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

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 13

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 14

5.Переходим к созданию динамического текста, т.е. непосредственно самого таймера.
Для этого обязательно создаем новый слой поверх всех остальных слоев. У меня это Layer 3, если у вас фона нет, то это будет Layer 2. Но, новый слой для динамического текста должен быть обязательно.

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 15

Снова идем к инструменту "Text" в панеле инструментов, щелкаем по нему для выбора. На рабочем пространстве (сцене) или на фоновом изображении растягиваем новое поле для ввода текста . Следим, чтобы оно полностью находилось в границах рабочей области (сцены). В поле для текста ввожу текст поздравления, который мы условно назвали "Таймер". Я ввожу текст - "С Праздником, влюбленные!".

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 16

Вот, теперь, самое важное! Внимание! Необходимо правильно указать параметры динамического текста, потому, что программа при создании таймера с помощью скрипта будет обращаться именно к указанным параметрам. Далее я приведу скрин с настройками параметров динамического текста. Вы его внимательно изучите. Можно изменять все настройки касательно шрифта. Но выбирайте хорошо читаемый шрифт и не задавайте слишком большого значения размерам шрифта, иначе информационная панель таймера может просто не войти в ваше рабочее поле.
Чего изменять нельзя, так - это тип текста. Тип (Type) текста обязательно должен быть указан Dynamic(выбрать в выпадающем списке).

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 17

В графе Name должно быть вписано: timetxt
В графе Var: time_txt
Тип формата текстового поля : Multiline
Multiline это многострочное текстовое поле в отличие от Single Line (Однострочное). При формате Multiline, текст, если он не умещается на одной строке, переносится на другую, тогда как при формате Single Line (Однострочном).часть текста становится невидимой.
Для того чтобы поля Name и Var стали доступны для введения текста необходимо щелкнуть по инструменту "Выделение" (Selection) и заполнить указанные графы.
6. Когда динамический текст будет введен и заполнена палитра Properties (Параметров), создаем новый слой для скрипта. У меня это Layer 4, если фоновой картинки нет – это будет Layer3.
Вводим скрипт для таймера. Там же где находится панель Properties (Параметров), ниже рабочего пространства, по умолчанию располагается панель Action в качестве вкладки. Перейдите на эту вкладку, щелкнув по ней. Или, если она отсутствует, Меню –Window – поставить галочку против палитры Action.
Расскажу немного о самом скрипте. Это универсальный скрипт адаптированный мною для программы Sothink SWFQuicker. Для того, чтобы его применять достаточно изменить в нем дату до которой будет идти отсчет и текст поздравления, хотя можно на все случае вставить текст "С Праздником!". Откройте приведенный во вложении текст скрипта. Далее в стандартный блокнот копируете этот скрипт и в блокноте редактируете дату, до которой будет идти обратный отсчет и текст поздравления. В каких строчках текста скрипта это сделать смотрите на скрине ниже.

Вложение: 3934379_skript_dlya_taymera_obratnogo_otscheta.txt

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 18

Как правильно ввести дату. Дата вводится в таком формате 2012, 1, 14 - год, месяц, число. Обратите внимание, что месяцы для скрипта начинаются с 0, т.е. январь соответствует нулевому месяцу!!!
январю соответствует - 0,
февраль - 1,
март - 2,
и т д
декабрь - 11
Например, дата "до 1 января 2013 года осталось" будет выглядеть следующим образом: 2013, 0, 1 Дата до 23 февраля 2012 соответственно - 2012, 1, 23
Текст поздравления в скрипт вводится такой же, какой вы вписали, когда создавали динамический текст. Если, как в примере,то "С Праздником, влюбленные!"
Отредактировали текст скрипта в блокноте, скопировали его и вставляете в палитре Action. Нажимаете зеленую галочку применения. Если все отредактировали верно, правильно скопировали и вставили, то появится надпись, что ошибок нет.

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 19

7. Нажимаем ОК и нажимаем кнопочку Preview на панели меню. Смотрим на полученный результат.

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 20

8. Сохраняем полученную флешку в формате .swf. File-Export-Export Movie (Ctrl+E)

Создаем таймер обратного отсчета в программе Sothink SWFQuicker 21

9. Если вы хотите сохранить свою работу, так чтобы была возможность вновь обратиться к ней, и, что-то отредактировать, то сохраните эту работу как проект программы Sothink SWFQuicker. Для этого пройдите в меню File-Save as. Укажите папку для сохранения проекта на вашем компьютере. Проект сохраняется в формате .SQF и может быть открыт программой Sothink SWFQuicker.

Еще раз кратко повторю этапы создания таймера обратного отсчета.
1.Создать новый документ
2.Установить размеры (параметры) рабочего пространства (сцены)
3.Если необходимо, то открыть фоновое изображение File- Import и трансформировать его размеры инструментом Transform.
4.Создать новый слой выше фонового. Выбрать инструмент "Text", создать текстовое поле и ввести статический текст "Заголовок". В палитре Properties (Параметров) указать название, цвет и размер шрифта.
5.Создать новый слой выше. Выбрать инструмент "Text", создать текстовое поле и ввести текст "Таймер-Поздравление". палитре Properties (Параметров) указать тип текста как Dynamic (динамический),заполнить текстовые поля
1. Name,где должно быть вписано: timetxt
2.Var, где должно быть вписано: time_txt
Задать параметры для шрифта. Задать формат текстового поля - Single Line(однострочный) или Multiline(многострочный) и т д.
6.Создать новый слой выше. Открыть вкладку с палитрой Action. Скопировать в стандартный блокнот скрипт и отредактировать в нем дату и текст поздравления. Скопировать из блокнота отредактированный скрипт. Вставить его в блокнот палитры Action. Нажать применение скрипта. Нажать ОК в сообщении о том, что в скрипте ошибок нет.
7.Включить просмотр Preview в панели Меню.
8. Если результат вас удовлетворяет, то сохранить таймер в формате .swf. File-Export-Export Movie (Ctrl+E)
9. Если необходимо, то сохраните файл в формате проекта программы .SQF File-Save as.