Schlechte UICollectionView-Scrolling-Performance Mit UIImage

Ich habe eine UICollectionView in meiner app, und jede Zelle ist ein UIImageView und einige Beschriftungen. Das problem ist, dass wenn ich die UIImageViews zeigen Ihre Bilder, die Scroll-performance ist schrecklich. Es ist nirgendwo nahe so glatt wie das scrolling Erfahrung einer UITableView oder sogar die gleichen UICollectionView, ohne die UIImageView.

Fand ich diese Frage von vor ein paar Monaten, und es scheint wie eine Antwort gefunden wurde, sondern es ist geschrieben in RubyMotion, und das habe ich nicht verstanden. Ich habe versucht, um zu sehen, wie es zu konvertieren, um Xcode, da ich aber noch nie benutzt NSCache entweder, es ist ein wenig schwer zu. Das poster ist auch darauf zu hier über die Implementierung etwas zusätzlich zu Ihrer Lösung, aber ich bin nicht sicher, wo zu setzen, dass der code entweder. Vielleicht, weil ich nicht verstehen, den code aus dem erste Frage.

Wäre jemand in der Lage zu helfen, übersetzen diese in Xcode?

def viewDidLoad
  ...
  @images_cache = NSCache.alloc.init
  @image_loading_queue = NSOperationQueue.alloc.init
  @image_loading_queue.maxConcurrentOperationCount = 3
  ...
end

def collectionView(collection_view, cellForItemAtIndexPath: index_path)
  cell = collection_view.dequeueReusableCellWithReuseIdentifier(CELL_IDENTIFIER, forIndexPath: index_path)
  image_path = @image_paths[index_path.row]

  if cached_image = @images_cache.objectForKey(image_path)
    cell.image = cached_image
  else
    @operation = NSBlockOperation.blockOperationWithBlock lambda {
      @image = UIImage.imageWithContentsOfFile(image_path)
      Dispatch::Queue.main.async do
        return unless collectionView.indexPathsForVisibleItems.containsObject(index_path)
        @images_cache.setObject(@image, forKey: image_path)
        cell = collectionView.cellForItemAtIndexPath(index_path)
        cell.image = @image
      end
    }
    @image_loading_queue.addOperation(@operation)
  end
end

Hier ist der code aus der zweite Frage, dass der Fragesteller von der erste Frage gesagt das problem gelöst:

UIImage *productImage = [[UIImage alloc] initWithContentsOfFile:path];

CGSize imageSize = productImage.size;
UIGraphicsBeginImageContext(imageSize);
[productImage drawInRect:CGRectMake(0, 0, imageSize.width, imageSize.height)];
productImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

Wieder, ich bin mir nicht sicher, wie/wo und zu implementieren.

Vielen Dank.

Veröffentlichen Sie Ihren code! Was haben Sie versucht? Warum ist die Leistung Ihrer app so langsam? Was ist das Ergebnis von profiling, um zu sehen, was Los ist???
Es ist nicht meine gesamte app ist langsam, es ist nur einen Bildlauf durch die Zellen in der UICollectionView. Der rest der app funktioniert sehr gut. Ich bin derzeit mit cell.cardImageView.image = [UIImage imageWithData:[NSData dataWithContentsOfFile:tempCard]]; um das Bild. Das Bild(s) verwendet wird, ist nicht Teil des app-bundle, sondern in der Regel heruntergeladen und gespeichert in dem Cache-Ordner.

InformationsquelleAutor Nick | 2013-04-03

19

Hier ist das Muster, das ich Folgen. Laden Sie immer asynch und cache das Ergebnis. Machen Sie keine Annahme über den Zustand der Ansicht, wenn der asynch Ladevorgang abgeschlossen ist. Ich habe eine Klasse, die vereinfacht die Lasten wie folgt:
```
//
// ImageRequest.h

//This class keeps track of in-flight instances, creating only one NSURLConnection for
//multiple matching requests (requests with matching URLs).  It also uses NSCache to cache
//retrieved images.  Set the cache count limit with the macro in this file.

#define kIMAGE_REQUEST_CACHE_LIMIT  100
typedef void (^CompletionBlock) (UIImage *, NSError *);

@interface ImageRequest : NSMutableURLRequest

- (UIImage *)cachedResult;
- (void)startWithCompletion:(CompletionBlock)completion;

@end

//
// ImageRequest.m

#import "ImageRequest.h"

NSMutableDictionary *_inflight;
NSCache *_imageCache;

@implementation ImageRequest

- (NSMutableDictionary *)inflight {

    if (!_inflight) {
        _inflight = [NSMutableDictionary dictionary];
    }
    return _inflight;
}

- (NSCache *)imageCache {

    if (!_imageCache) {
        _imageCache = [[NSCache alloc] init];
        _imageCache.countLimit = kIMAGE_REQUEST_CACHE_LIMIT;
    }
    return _imageCache;
}

- (UIImage *)cachedResult {

    return [self.imageCache objectForKey:self];
}

- (void)startWithCompletion:(CompletionBlock)completion {

    UIImage *image = [self cachedResult];
    if (image) return completion(image, nil);

    NSMutableArray *inflightCompletionBlocks = [self.inflight objectForKey:self];
    if (inflightCompletionBlocks) {
        //a matching request is in flight, keep the completion block to run when we're finished
        [inflightCompletionBlocks addObject:completion];
    } else {
        [self.inflight setObject:[NSMutableArray arrayWithObject:completion] forKey:self];

        [NSURLConnection sendAsynchronousRequest:self queue:[NSOperationQueue mainQueue] completionHandler:^(NSURLResponse *response, NSData *data, NSError *error) {
            if (!error) {
                //build an image, cache the result and run completion blocks for this request
                UIImage *image = [UIImage imageWithData:data];
                [self.imageCache setObject:image forKey:self];

                id value = [self.inflight objectForKey:self];
                [self.inflight removeObjectForKey:self];

                for (CompletionBlock block in (NSMutableArray *)value) {
                    block(image, nil);
                }
            } else {
                [self.inflight removeObjectForKey:self];
                completion(nil, error);
            }
        }];
    }
}

@end
```
Nun die Zelle (Auflistung oder Tabelle) update ist ziemlich einfach:
```
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {

    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"Cell" forIndexPath:indexPath];

    NSURL *url = [NSURL URLWithString:@"http://some url from your model"];
    //note that this can be a web url or file url

    ImageRequest *request = [[ImageRequest alloc] initWithURL:url];

    UIImage *image = [request cachedResult];
    if (image) {
        UIImageView *imageView = (UIImageView *)[cell viewWithTag:127];
        imageView.image = image;
    } else {
        [request startWithCompletion:^(UIImage *image, NSError *error) {
            if (image && [[collectionView indexPathsForVisibleItems] containsObject:indexPath]) {
                [collectionView reloadItemsAtIndexPaths:@[indexPath]];
            }
        }];
    }
    return cell;
}
```
- Dank für, die. Ich versuchte, es in mein app, und url immer nil. Irgendwelche Gedanken?
- Haben Sie zu ersetzen, die schreckliche Zeichenfolge, die ich verwendet, als ein Beispiel mit einer realen web-Adresse?
- Ja, ich habe es ersetzen. Allerdings bin ich mir über eine lokale URL auf die Caches-Verzeichnis statt einer web-Adresse. Das sollte nicht sein problem sein, richtig? Core Data verwendet eine NSURL auf den app-store vor Ort.
- Ich habe nie versucht es mit lokalen URL, aber deine Idee hört sich gut an. Vielleicht auch nur Kraft einer web-Adresse, ein Bild in es zu beweisen, es funktioniert und Regel das lokale Sache. Auch vielleicht haben Sie den cache beantworten Sie einfach eine imageNamed: nur um zu beweisen, den code. Es ist, guten code zu -ich benutze es die ganze Zeit - aber ich musste es Bearbeiten, einige zu entfernen, meine app-details.
- Ich fand, was verursacht wurde url zu null. Ich war mit ein Pfad statt url. Im wesentlichen, die mir fehlte, die file:// Teil der Zeichenfolge. Ich bin jetzt in der Lage, um die vollständige URL, die generiert wird, aber es ist immer noch nicht geladen, das Bild. Wenn ich die URL in Safari auf meinem computer, lädt es das Bild perfekt, so weiß ich, dass die URL gültig ist. Jedoch, laden Sie das Bild von meinem server und nicht lokal funktioniert, und das scrollen ist erstaunlich glatt. Indem Sie die folgenden Schritte aus, sowohl lokale als auch remote-URLs, die sich ähnlich Verhalten, so bin ich nicht sicher, wo das Problem ist.
- So ist es Ihr design, das Bilder aus dem lokalen Dateisystem? Wenn das der Fall ist, sollten wir einfach optimieren, um und vergessen Sie machen web-Anfragen. Ich baute mir dieser code alle über die remote-Bilder. Den einheimischen sollte es einfacher sein. Ich kann das Pflaster etwas zusammen, wenn rein lokale ist, was du vorhast.
- Nun, ja und Nein. In der Regel, durch die Zeit, die der Benutzer erhält zu diesem Teil der app, es wird schon gespeichert, eine lokale Kopie des Bildes. Ich habe allerdings gerade modifiziert Ihren code hier ein, so kann es auch speichern Sie eine lokale Kopie des Bildes. Ich bin nur nicht sicher, wie zu sagen, es zu laden Sie die lokale version (falls es da ist), anstatt entweder auf der Suche aus der Ferne oder laden aus (ich nehme an) die Cache.db - Datei. Es scheint, dass es tut halten eine lokale Kopie des Bildes irgendwo, weil nach dem ausführen der app einmal, es ging nie zurück - (void)startWithCompletion:(void (^)(UIImage *, NSError *))completion
- hoffentlich für Sie -- oder, wenn du bist alles für jemand zu finden, diese später-ich reparierte es und testete es, in einigen schwierigen Situationen, einschließlich Datei-urls, darunter auch viele passende Datei oder web-Anfragen.
- Sie sind die besten!!! Dieser code funktioniert perfekt! Meine UICollectionView Schriftrollen so reibungslos mit den Bildern funktioniert es ohne. Vielen, vielen Dank!
- ERSTAUNLICH! Vielen Dank!
- verbessert werden kann mit collectionView:didEndDisplayingCell:forItemAtIndexPath: ich nehme an,
- Vielen Dank so viel für diese! Es funktioniert großartig! Aus irgendeinem Grund, wenn ich scrolle durch meine collectionview schnell (nur wenn ich nach rechts scrollen, wenn die app zu öffnen), bekomme ich eine exception: zu viele aktualisieren Sie Animationen auf einen Blick - Grenze 31 im Flug zu einem Zeitpunkt. Irgendeine Idee was könnte sein die Ursache dafür? Nochmals vielen Dank! 🙂
- Ich gegoogelt, und es sieht aus wie ein echtes Phänomen im Zusammenhang zu viele individuelle Aktionen, die auf eine Sammlung anzuzeigen. Der Konsens, der fix scheint zu sein, die Gruppe, aber ich werde darüber nachdenken müssen, wie man diese hier.
- Nicht sicher, ob Sie haben könnte, dieses problem mit, wie es aufgebaut ist, aber falls Sie asynchron laden des Bildes in der Ansicht Sammlung Zelle code, Sie können auf eine Fehlermeldung, wenn das Bild noch geladen wird, wenn die UICollectionView verschwunden ist (vielleicht wurde spontan aus a navigation stack). Um es zu beheben, verwenden Sie die schwachen/starken Tanz auf dem collectionView variable und rufen nur die reloadItemsAtIndexPaths wenn der collectionView die variable ist nicht null.
- Danke @MichaelMcGuire. Dies ist ein gutes Beispiel, wenn nicht eine schwache Kopie der block-Variablen. Es ist der block auf den Eigentumsvorbehalt der collectionView (und selbst das vc) das schützt uns vor Ihnen, immer freigegeben ist, bevor die Anforderung beendet ist. In dem Szenario, das Sie erwähnen, einige navigation-controller release könnte die vc (und daher die Sammlung), und die Anforderungen werden gerade fertig gut, harmlos Aktualisierung der jetzt unsichtbar Ansichten.
- Nur ist das nicht was überhaupt passiert. Wenn die UICollectionView wurde, tauchte aus dem navigation-controller, und Sie versuchen, führen Sie die reloadItemsAtIndexPaths, Sie bekommen am Ende ein EXC_BAD_ACCESS KERN_INVALID_ADDRESS vom UICollectionView. Es ist nicht in einem Zustand, wo Sie können aktualisieren Sie die Zeilen. Wieder, dies kann gewesen, weil I war die Durchführung dieser code innerhalb der UICollectionViewCell sich selbst über eine Methode, die sich bis. Einer der Parameter übergeben wird, war die UICollectionView selbst.
- Ich habe gerade überprüft, und Sie sind richtig. Wenn Sie diese direkt in der view-controller, die Sie nicht bekommen, eine retain-Zyklus (offensichtlich). Allerdings, in meinem Fall, wo ich den Aufruf in der Zelle, übergeben Sie eine Instanz der UICollectionView, ich war immer eine retain-Zyklus, die verursacht wurde, mein Fehler.
- In meinem Fall die app stürzt ab, wenn Sie versuchen zu Holen einen remote-Bild, das nicht auf dem server vorhanden sein. Also ich habe die folgende Bedingung innerhalb ImageRequest.m innerhalb der completion-handler-Zeile ~47. if (!Fehler && [(NSHTTPURLResponse*)response-statusCode] == 200) { [...] cheers
- Was ist Los in dieser Zeile if (image) return completion(image, nil);. Die Linie gibt einen block innerhalb eines void Methode, was ist also der block zurück?
- Dass nicht wieder der block, der ruft den block, was der Anrufer (wer hat den block) das versprochene Bild. Die Rückkehr Teil halte die Ausführung der Funktion.
InformationsquelleAutor danh
5

Im Allgemeinen schlecht scrolling-Verhalten für UICollectionViews oder UITableViews geschieht, weil die Zellen werden aus der Warteschlange entfernt und gebaut in den Haupt-thread von iOS. Es gibt wenig Freiheit, um zu precache-Zellen oder bauen Sie in einem hintergrund-thread, statt Sie aus der Warteschlange entfernt und gebaut, da Sie einen Bildlauf Blockierung der Benutzeroberfläche. (Ich persönlich finde, dass schlechtes design von Apple obwohl es nicht der Einfachheit halber, weil Sie nicht haben, um sich bewusst sein über mögliche threading Probleme. Ich denke, Sie sollte ein Haken, obwohl, um eine benutzerdefinierte Implementierung für eine UICollectionViewCell/UITableViewCell pool, die mit dem entfernen/wiederverwenden von Zellen).

Den wichtigsten Ursachen für den Leistungsabfall sind in der Tat im Zusammenhang mit Bild-Daten und (in Abnehmender Größenordnung) sind meiner Erfahrung:
- Synchrone Aufrufe zum download von Bilddaten: immer asynchron, und rufen Sie [UIImageView setImage:] mit den konstruierten Bild, wenn Sie bereit sind, in den Haupt-thread
- Synchrone Aufrufe zu konstruieren Bilder von Daten auf dem lokalen Dateisystem, oder aus anderen serialisierten Daten: tun Sie dies asynchron als gut. (z.B. [UIImage imageWithContentsOfFile:], [UIImage imageWithData:], etc).
- Aufrufe [UIImage imageNamed:]: das erste mal, dieses Bild ist geladen, es wird serviert von der Datei-system. Möchten Sie vielleicht vorab Zwischenspeichern von Bildern (nur durch laden [UIImage imageNamed:] bevor die Zelle ist eigentlich so konstruiert, dass Sie bedient werden können, aus dem Speicher sofort statt.
- Berufung [UIImageView setImage:] ist nicht die Schnellste Methode, aber können oft nicht vermieden werden, es sei denn, Sie verwenden statische Bilder. Für statische Bilder ist es manchmal schneller eingesetzt, verschiedene Bild-Ansichten, die Sie ausgeblendet oder nicht, je nachdem, ob Sie angezeigt werden soll anstelle der änderung der Bild auf das gleiche Bild anzeigen.
- Ersten mal eine Zelle aus der Warteschlange entfernt ist es entweder geladen, aus einer Feder oder konstruiert mit alloc-init und einige erste layout oder Eigenschaften gesetzt sind (wahrscheinlich auch Bilder, wenn man Sie verwendet). Dies bewirkt, dass schlechten Blättern Verhalten das erste mal, wenn eine Zelle verwendet wird.
Da bin ich sehr wählerisch, smooth-scrolling (auch wenn es nur das erste mal, wenn eine Zelle verwendet wird) konstruierte ich eine ganze framework zu precache-Zellen, indem bilden von Unterklassen UINib (dies ist im Grunde der einzige Haken erhalten Sie in der abarbeiten der Warteschlange Prozess von iOS). Aber das ist vielleicht über Ihre Bedürfnisse.

InformationsquelleAutor Werner Altewischer
0

Ich hatte Fragen über UICollectionView scrollen.

Was funktioniert (fast) wie ein Charme für mich: ich aufgefüllt, die Zellen mit png-thumbnails 90x90. Ich sage fast, denn die erste vollständige schriftrolle ist nicht so glatt, aber noch nie abgestürzt ist nicht mehr.

In meinem Fall, die Größe der Zellen ist 90x90.

Hatte ich viele original-png-Größen vor, und es war sehr abgehackt beim png-original Größe war größer als ~1000x1000 (viele Abstürze auf den ersten Blättern).

So, ich wähle 90x90 (oder ähnliches) auf die UICollectionView und Anzeige die original png ' s (unabhängig von der Größe). hoffe, es kann anderen helfen.

InformationsquelleAutor Paulo Souto

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.