Назад в раздел
Делаем: loading 56%... 57%....69%....
div.main {margin-left: 20pt; margin-right: 20pt}
Делаем: loading 56%... 57%....69%....
В этой статье я расскажу, наконец,еще раз КАК ЖЕ СДЕЛАТЬ ЭТОТ ПРЕ-ЛОАДЕР :)
На этом уроке мы создадим универсальный прелоадер, который можно будет пихать пихать пихать пихать во все свои работы после (чего я никогда, вообщем не делаю, а всегда пишу новый).
Предполагается, также, что пользователь уже имеет первоначальное представление об инструментах создания объектов и рисовании в редакторе.
------------------------------------------
Начнем с создания нового документа.
1. Открываем FLASH5 2. Сохраняем новый файл с именем "preloader.fla" 3. Нарисуем прямоугльник, который будет служить нам фоном для текстового поля.
4. Создадим текстовое поле. (для этого выберем в панели инструментов инструмент "text tool", нарисуем им прямоугольник некоторой длины, чтобы в него приблизительно поместился нужный текст шириной в 4-6 символов. После сделаем на поле правый клик мыши и в выпадающем меню выберем panels>text options.
5. Окошке "Text Options" мы заменим в выпадающем меню "static text" на "dynamic text" и в поле "Variable" впишем название - text
пояснения: мы создали динамическое текстовое поле, которому теперь можно задавать свойства для отображения некоторых
переменных и присвоили ему имя-переменную (text) для обращения к этому полю по его имени. 6. Далее выделим все объекты в сцене (CNTR+A) и сделаем их одним символом (F8>Movie CLip, просто Мувик) 7. На полученном Movie Clip-e сделаем правый клик мыши и выберем "Actions"
8. Вписываем код:
примечание: для того, чтобы вводить вручную код, необходи режим эксперта (expert mode) для этого надо щелкнуть мышкой в окно и нажать CNTRL+E.
сам код можно скопировать отсюда: //------------------------------------- onClipEvent (load) { tot = _root.getBytesTotal(); } onClipEvent (enterFrame) { loaded = _root.getBytesLoaded(); percent = loaded/tot*100; text=Math.floor(percent); text=text+"%" if(loaded >= tot){_root.gotoAndStop(2)} } //-------------------------------------
пояснения к коду:
весь код внутри клипа заключается в фигурные скобки { - открывающая, } - закрывающая ------------------------ onClipEvent (load) - событие(event) клипа которое срабатывает в момент его полного появления в сцене tot - объявляем новую переменную ------------------------ _root - означает, что обращение к остальным действиям в строке идет через основную сцену (_root) ------------------------ getBytesTotal() - функция, которая выдаст нам общее количество байтов, где? ...а там где напишем ... если мы пишем _root.getBytesTotal(), значит мы получим общее количество байтов всего _root-а, то есть полный размер нашего ролика.
------------------------ onClipEvent (enterFrame) - событие(event) клипа которое обрабатывается каждый раз когда проигрывается новый кадр (связано с
ФПС, по-умолчанию=12 раз в секунду, изменить можно, нажав CNTRL+M) ------------------------
loaded - создаем переменную, которая будет считать загруженные байты и присваиваем ей значение... _root.getBytesLoaded() - функция, выдаст нам количество уже загруженных байтов ------------------------ percent = - сделаем еще одну переменную, которая будет отвечать за проценты ------------------------ loaded/tot*100; - тут мы просто высчитаем процент уже загруженного от общего количества (школьная формула). ------------------------ text=Math.floor(percent); text - переменная-имя текстового поля, которое уже лежит внутри нашего мувика.
Math.floor(percent) - функция, округляет, заключенное в скобки (percent) значение до ближайшего целого (например: Math.floor(2.5) = 2) ------------------------ text=text+"%" - добавляем к переменной text еще один символ "%" в результате получим круглое число "percent" + "%" ------------------------ и завершит наш код условие
if(loaded >= tot){_root.gotoAndStop(2)}
[ if ] - если
[ loaded ]- уже загруженные байты
[ >= ] - больше-или-равны
[ tot ] - общему количеству байтов
[ gotoAndStop(2) ] - то переходим ко второму кадру
[ _root.gotoAndStop(2) ] - то переходим ко второму кадру в основной сцене. ------------------------
9. Ну, а теперь мы воткнем этот самый 2 кадр в основную сцену (выделим в линейке кадров 2 кадр и нажмем F7)
10. Поместим в него какую-нибудь фотографию, к примеру, для увеличения веса всего ролика.
11. Протестируем прелоадер.
Нажимаем CNTRL+ENTER один раз Нажимаем CNTRL+ENTER второй раз
процесс пошел, ждем...
и теперь, как только прелоадер добежит до 100%, он перепрыгнет на 2 кадр сцены, где нас уже ждет прекрасная муза (см. исходник) :).
в добавок:
Нажимаем CNTRL+B Теперь видим Bandwidth - профиль в котором видно покадрово, сколько всего весит каждый кадр сцены. А также видны бегущие проценты загрузки.
В меню debug>customize выставим подходящую нам скорость загрузки для теста. И полюбуемся немного в тишине.
------------------------ Полученный нами в результате всего, мувик можно просто копировать в другие документы и он должен также исправно работать. ------------------------ Небольшая поправка к коду: для корректной работы прелоадера необходимо все же писать не loaded == tot (как на рисунке) а loaded >= tot (см. код)
------------------------
Успехов. Всегда Ваш, Уильям Брэдберри, мультимедиа-девелопер, Мастер Цифрового Облика.
http://wb.legus.ru http://totemart.newmail.ru
mailto:willyam@newmail.ru |
Автор: © Уильям Брэдберри Источник:
http://www.flasher.ru
|
|
|
|