Просмотр полной версии : Прелоадер для картинок извне (XML)
Добрый день. Говорю сразу - не ругейтесь, я во флэше без году неделя, но при этом активно читаю статьи, книги и смотрю готовые примеры.
Есть флэш под управлением AS2.0, который должен отображать несколько картинок (читайте - фотогалерея). Ссылки на картинки содержатся внутри внешнего XML-файла (вроде как админка). XML выглядит стандартным образом:
<data xmlns="http://www.w3.org/1999/xhtml">
<config>
<item id="1">
<big>http://somesite.ru/i/big_1.jpg</big>
<small>http://somesite.ru/i/small_1.jpg</small>
<text>Обаму наконец-то выбрали в президенты</text>
<link>http://somesite.ru/news/?newsid=0812908</link>
</item>
</config>
</data>
Айтемов, понятно, несколько. Так вот. Как делается прелоадер для самого флэша (если в него уже встроены картинки) - мне понятно, делаю это посредством getBytesLoaded(), getBytesTotal() и gotoAndPlay( 3 ). Как делать прелоадер XML - тоже есть куча статей, метод почти идентичный. А как сделать, чтобы прелоадились еще и те картинки, адреса на которые указаны внутри XML-ных тэгов? Первыми двумя способами не прокатывает, поскольку картинки все равно упорно подгружаются на лету по ходу пьесы. Обращение происходит следующим образом: в цикле опрашивается XML, затем делаются два массива, содержащие в себе адреса больших и маленьких картинок. Например, так:
var smallimages = [];
var smallimages[0] = "http://somesite.ru/i/big_1.jpg";
_root.smallimage_mc = loadMovie( smallimages[0] );
Подозреваю, что грузить клипы на страницу надо не через loadMovie. Но куды бечь?
gloomyBrain
01.02.2009, 18:29
Бечь на flasher.ru, куда ж еще =)
Смысл решения таков:
1) создаем объект MovieClipLoader - он понадобится Вам для загрузки картинок, которую легко отследить
var mcLoader:MovieClipLoader = new MovieClipLoader();
2) далее нам потребуется узнать, что и откуда грузить. Для этого, понятное дело, надо разобрать Ваш XML и извлечь необходимые данные:
// создаем объект XML и предписываем ему игнорировать пропуски
var thumbXML:XML = new XML();
thumbXML.ignoreWhite = true;
// задаем действие, которое будет выполнено
// сразу после того как XML загрузился
thumbXML.onLoad = function() {
// в данном примере мы выбираем для
// работы первый нод внутри главного
// то есть для Вашего случая это нод <config>
var thumbMainNode:XMLNode = thumbXML.firstChild;
// то есть теперь объекту thumbMainNode присвоено
// все содержимое нода <config>
// в этой переменной будет число нодов в thumbMainNode
// то есть в Вашем случае - итемов
var nodeCount:Number = thumbMainNode.childNodes.length;
ЗДЕСЬ ДОЛЖЕН БЫТЬ ЦИКЛ (СМ НИЖЕ)
};
// командуем икс ым элю загружаться
thumbXML.load("http://www.theSite.ru/xml/thumbs.xml");
На данном этапе все готово - XML загружен. надо его только перебрать:
for (var i:Number = 0; i<nodeCount; i++) {
// определяем содержимое нода
var picURL:String = thumbMainNode.childNodes[i].value;
// создаем под каждую картинку свой мувик
var thumbClip:MovieClip = scene.createEmptyMovieClip("thumbClip_"+i, scene.getNextHighestDepth());
// задаем этому мувику координаты
thumbClip._x = 100*i;
// заставляем созданный ранее mcLoader грузить картинки !!!
mcLoader.loadClip(picURL, thumbClip);
}
Осталось для полноты ощущений проследить процесс загрузки
Делается это с помощью все того же MovieClipLoader
Честно говоря, я уже клавиатуру в порошок стёр...
вот Вам рабочий исходник, разбирайтесь, там все просто =)
ЗЫ
только картинки конечно... мда...
nOobCrafter
04.02.2009, 12:02
gloomyBrain или я непонял что хочет автор или одно из двух.
А как сделать общий! прелоадер для всех фоток подгружаемых через хмл?
Допустим есть галерея на 30 фоток, и яхочу тчо бы пока они не загрузились, она не показывалась (это без проблем), но вот как корректно отобразить процесс их загрузки ума не приложу, точнее приходит то что в первом посте отписал автор...
То есть вводить доп. массивы...
Еще раз поясню на всякий случай, может есть способ посчитать обьем всех картинок, сложить его и отображать относительно уже загруженного контента.
gloomyBrain
04.02.2009, 13:25
конечно есть
у Вас же есть XML с данными, оттуда можно взять и количество и размер картинок
(размер может быть сгенерирован сервером). А если не получается размер запихнуть в XML... Нужно грузить по одной картинке, доля загруженного будет равна:
число_загруженных_картинок/число_картинок + доля загрузки загружаемой на данный момент картинки
nOobCrafter
04.02.2009, 13:50
число_загруженных_картинок/число_картинок + доля загрузки загружаемой на данный момент картинки
Ну так то оно так, но это общая формула, а хочется точности.
К тому же тут есть один большой минус. Фотки грузятся одновременно, допустим первая фотка самая большая, то есть загрузится последней, просверка по идее с первого номера до последнего, то есть пока первая не загрузится то дальше не идет, допустим первая загрузилась ( а остальные значит уже давно загружены, ведь они меньше, но грузятся парралельно), стало быть имеем резкий скачок с 0-10% до 100%. (в теории)
Как я понял все же узнать заранее размер фоток нельзя? Вариант занесения их размера в хмл и считывания его оттуда неподходит, ибо в дальнейшем планирую раздать исходник друзьям, которые врядли будут так напрягаться, да и вообщем то хочется простоты..
gloomyBrain
04.02.2009, 13:56
общая формула, а хочется точности.
... А по-моему, Вам хочется готовый код
а остальные значит уже давно загружены
Это при поочередной-то загрузке?! интересно, как?..
друзьям, которые врядли будут так напрягаться
напрягается, обычно, сервер, который динамически формирует xml
nOobCrafter
04.02.2009, 14:08
... А по-моему, Вам хочется готовый код
код у меня есть, просто происходит вот что, грузится первая фотка (до 100%) далее отображает загрузку второй (примерно 80% и опять до 100%), потом история повторяется (если есть еще незагруженные фотки)
Так гружу картинки что бы они грузились парралельно:
for (i = 0; i <= total; i++)
{
imageLoader.loadClip(img[i], hmc['loader_' + i].pic); // берем нужную превью из массива и загружаем в нужный мувик
}
сервера нету, пока недорос до таких тонкостей, хмл делается ручками (во всяком случае пока)
loaderListener.onLoadProgress = function(holderClip:MovieClip, loadedBytes:Number, totalBytes:Number):Void
{
var percent:Number = Math.round((loadedBytes / totalBytes) * 100); // вычисляем количество загруженых байт превьюхи
load_tf.text = "Загружено " + percent + "%"; // тековое поле находится в руте и одно, а не для каждой фотки свое.
}
Как видно из скрипта выше, после загрузки первой фотки, значение percent будет равно степени загрузки второй фотки и так далее..
пример можно глянуть тут: rovalantcomplex.com/123
Добавлено через 20 часов 43 минуты
Все получилось сделать, полную загрузку можно отследить так:
....бла бла бла...
loaderListener.onLoadProgress = function (holderClip, loadedBytes, totalBytes)
{
var percent = Math.round((i + loadedBytes / totalBytes) * 100 / total); // тут должна получаться общая загрузка
trace(percent)
};
loaderListener.onLoadInit = function (mc)
{
++i; // когда первая картинка загружена, то увеличиваем значение "счетчика"
imageLoader.loadClip(img[i], hmc["loader_" + i].pic); // и соответственно ему грузим следующую, одна за одной
}
imageLoader.loadClip(img[0], hmc["loader_" + 0].pic); // грузим только первую картинку
i = 0; // обнуляем счетчик
В итоге мы получаем красивые значение процентов общей загрузки и последовательную!! загрузку фоток, если проводить загрузку всех вместе (парралельно, то есть через цикл), то такого эффекта врядли удастся добиться, хотя я могу и ошибаться(( У меня проблема была в том что грузил все парралельно((
Работает на vBulletin ® версия 3.7.3. Copyright ©2000-2026, Jelsoft Enterprises Ltd. Перевод: zCarot
Copyright © 1999-2008 Flasher.ru. All rights reserved.