Wie kann ich ein UIScrollView mit einem großen Bild erstellen, das schnell angezeigt wird (wie Photos.app)?

Question

Ich versuche, einen einfachen Bildbetrachter zum Betrachten des Bildes mit voller Auflösung einer ALAssetRepresentation zu machen. Es stellt sich heraus, dass es nicht so einfach ist.

Mein erster Ansatz war, einfach ein großes UIImageView innerhalb des UIScrollView zu erstellen. Während das funktionierte, war es sehr langsam.

Wenn Sie die Fotos App verwenden, wird beim Tippen auf ein Bild die größere Version sofort geöffnet. Zuerst wird ein Bild mit sehr niedriger Auflösung gezeichnet. Aber in Kürze erscheint ein Bild mit höherer Auflösung. Wenn ich heranzoome, ist das Bild zuerst eine niedrigere Auflösung und dann die Auflösung.

Ich überprüfte die WWDC 2010 Keynote # 104, wo beschrieben wird, wie Photos.app funktioniert. Aber wie soll ich das umsetzen? In der Keynote verwendet die Demo vorgekachelte Bilder, etwas, das ich von einer ALAssetRepresentation einfach nicht bekommen kann. Ich habe versucht, nur die Version mit voller Auflösung zu laden und nur mit CATiledLayer zu zeichnen, und während es nicht langsam ist, um et.c zu zoomen, ist es beim Zeichnen der Kacheln viel zu langsam.

Speichert Photos.app eine niedrigere Auflösung aller Bilder irgendwo oder was ist los? Einige Hinweise darauf, was zu tun wäre, wären hilfreich.

Answer 1

Ja, Photos.app speichert Bilder mit niedrigerer Auflösung. Die gute Nachricht ist, dass Sie auch diese zwischengespeicherten Versionen bekommen können. Sie kennen wahrscheinlich die fullScreenImage-Eigenschaft von ALAssetRepresentation und die thumbnail-Eigenschaft von ALAsset. Diese sollten viel schneller geladen werden.

Was ich mit hochauflösenden Bildern gefunden habe, ist, dass das Laden nur 1-2 Sekunden dauern kann, also denke ich, dass das Laden des Bildes mit hoher Auflösung im Hintergrund das Richtige für dich ist.

So, wie Sie die Low-Res-Version des Bildes laden und dann auf die High-Res-Version wechseln, wenn Sie ich habe ?. Es kann ein bisschen kompliziert sein, aber hoffentlich sollte dir das helfen. Da Sie AssetsLibrary verwenden, müssen Sie iOS 4 verwenden, was eine gute Nachricht ist, da Sie dies relativ einfach mit Blöcken und GCD/libdispatch durchführen können. Ich bin froh, dass du dir die WWDC-Videos anschaust - schau dir die Sessions 206 und 211 für viele tolle Informationen zu GCD an.

Die Grundidee ist, dass Sie die Version mit niedrigerer Auflösung im Hauptthread anzeigen, dann einen Hintergrundthread zum Laden des Bildes mit voller Auflösung anfragen und dann CATiledLayer anweisen, zum Vollauflösungsbild zu wechseln.

- (void)displayAsset:(ALAssetRepresentation *)asset { 
    UIImage *lowresImage = [UIImage imageWithCGImage:asset.fullScreenImage 
           orientation:asset.orientation scale:asset.scale]; 
    // Add code here to display the lowresImage 

    dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), 
    ^{ 
     // Load the full resolution image from the asset 
     UIImage *highresImage = [UIImage imageWithCGImage:asset.fullResolutionImage 
            orientation:asset.orientation 
            scale:asset.scale]; 

     // Once done, tell the main thread to display the tiles 
     dispatch_async(dispatch_get_main_queue(), 
     ^{ 
      // Code to swap out the lowresImage for highresImage 
     }); 
    }); 

}