БОЛЬШОЙ ИЗОБРАЖЕНИЙ Загрузка для формирования галереи миниатюр - PullRequest
0 голосов
/ 18 ноября 2011

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

Например, если бы я щелкнул по папке A, она загрузит всеизображений в массив, который будет установлен как dataProvider в моем Списке для создания тайла.

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

Есть ли способ загрузить все мои изображения в первую очередь, прежде чем их отобразить?Или любой способ сделать его менее медленным

<s:List id="list" includeIn="initialScreen,thumbnailState" x="372" y="25" width="600"
        height="750"  dataProvider="{imageList}"
        itemRenderer="spark.skins.spark.DefaultComplexItemRenderer"
        click.thumbnailState="list_clickHandler(event)">
    <s:layout>
        <s:TileLayout horizontalGap="15" orientation="rows" verticalGap="15"/>
    </s:layout>
</s:List>

Ответы [ 3 ]

1 голос
/ 18 ноября 2011

http://www.wastedpotential.com/?p=38
http://code.google.com/p/bulk-loader/
http://tutorials.flashmymind.com/2009/02/loading-multiple-images/

Использование AS3 QueueLoader - это позволило мне добавить ресурсы в очередь и при этом сохранить предварительную загрузку как один процесс.

Вот некоторый код, который добавляет изображения в очередь.

private function init():void {
_oLoader = new QueueLoader();
_oLoader.addItem(PATH+cssURL, css, {title:'cssContent'});
_oLoader.addItem(PATH+"xml/copy.xml", pageXML, {title:'pageXML'});

_oLoader.addEventListener(QueueLoaderEvent.ITEM_PROGRESS, onItemProgress, false, 0, true);
_oLoader.addEventListener(QueueLoaderEvent.ITEM_COMPLETE, onItemComplete, false, 0, true);
_oLoader.addEventListener(QueueLoaderEvent.QUEUE_PROGRESS, onQueueProgress, false, 0, true);
_oLoader.addEventListener(QueueLoaderEvent.QUEUE_COMPLETE, onQueueComplete, false, 0, true);

_oLoader.execute();
}
private function onItemComplete(evt:QueueLoaderEvent):void {
if (evt.title == 'cssContent')
{
    css = StyleSheet(evt.content);
}
if(evt.title == 'pageXML'){
pageXML = XML(evt.content);

processXML(); // creates page objects based on XML

for(var i:int=0; i<pageXML.PARENT.length(); i++){
     //loops through XML for background images and adds them to various
     //sprite layers for simple turning on and off
    numSubPages = pageXML.PARENT[i].PAGE.length();

    var pageImgHolder = new Sprite();
    pageImgHolder.name = 'page'+i;
    pageImgHolder.x = 0; pageImgHolder.y = 0;
    bgImgHolder_mc.addChild(pageImgHolder);

    for(var j:int=0; j<numSubPages; j++){
        if(String(pageXML.PARENT[i].PAGE[j].@IMAGE) !== ''){
        bgImg = new Sprite();
        bgImg.name = 'page'+i+'img'+j;
        bgImg.alpha = 0;

        pageImgHolder.addChild(bgImg);

        _oLoader.addItem(PATH+'images/'+pageXML.PARENT[i].PAGE[j].@IMAGE, bgImg, {title:'page'+i+'img'+j})
        trace(pageImgHolder.parent.name+'/'+bgImg.parent.name+'/'+bgImg.name+' = '+pageXML.PARENT[i].PAGE[j].@IMAGE);
        }
    }
    }
xmlLoaded = true;
} 
}    
private function onQueueComplete(evt:QueueLoaderEvent):void {
trace("** "+evt.type);
imgHolderLoaded = true;

Preloader.instance.spinnerDone();
startMovie();

bgImgHolder_mc.turnOnImg(0, 0);
//turns on image for page 0, subpage 0 (i have a very complicated architecture)
}

Надеюсь, это поможет вам.

1 голос
/ 18 ноября 2011

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

0 голосов
/ 18 ноября 2011

У меня есть сайт с ~ 500 нечетными фотографиями в одном каталоге. Я сделал простую страницу HTML, которая загружает все ~ 500 нечетных миниатюр одновременно. Загрузка только миниатюр занимает более 15 мегабайт HTTP-трафика.

Это будет за пределами возможностей некоторых браузеров и некоторых подключений на долгие годы. (Мне подходит.)

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

...