10

Ich versuche, neue iOS 7-APIs zu behandeln, die interaktive, animierte View Controller-Übergänge ermöglichen, einschließlich Übergängen zwischen UICollectionViewLayout s.UICollectionView interaktiver Layoutübergang mit iOS 7 APIs

ich getroffen habe und Beispielcode geändert von WWDC 2013 „iOS-CollectionViewTransition“, die hier gefunden werden kann: https://github.com/timarnold/UICollectionView-Transition-Demo

Die ursprüngliche Demo, die nicht in einem Arbeitszustand war, als ich es gefunden haben, können mit einem Apple Developer-Konto, hier: https://developer.apple.com/downloads/index.action?name=WWDC%202013

Meine Version der App präsentiert eine Sammlungsansicht mit zwei Layouts, beide UICollectionViewFlowLayout Layouts mit unterschiedlichen Eigenschaften.

Wenn Sie auf eine Zelle im ersten Layout tippen, wird die Animation in der zweiten Ebene aktiviert, einschließlich des abgetippten Objekts, zu dem im neuen Layout gescrollt wird. Zuerst war ich verwirrt darüber, wie die neue Auflistungsansicht ihren Inhaltsversatz einstellen kann, so dass die entsprechende Zelle sichtbar ist, aber ich habe gelernt, dass dies auf der Grundlage der Eigenschaft selected der präsentierenden Sammlungsansicht geschieht.

Das Klicken auf ein Objekt im ersten Layout sollte auch mit dem neuen Layout animiert werden. Verwenden Sie dazu UICollectionViewTransitionLayout, UIViewControllerAnimatedTransitioning und UIViewControllerInteractiveTransitioning. Dies funktioniert, aber die eingeklemmte Zelle ist nicht scrollte in das neue Layout oder das Übergangslayout.

Ich habe versucht, die selected Eigenschaft auf die eingeklemmte Zelle an verschiedenen Orten (um zu versuchen, das beschriebene Verhalten beim Tippen auf ein Element zu drücken, um die neue Ansicht Controller drücken), vergeblich.

Irgendwelche Ideen zur Lösung dieses Problems?

Antwort

19

Sie können die contentOffset selbst während des Übergangs manipulieren, was Ihnen eine feinkörnigere Kontrolle als UICollectionView's integrierte Animation gibt.

Zum Beispiel können Sie Ihr Übergangslayout so definieren, dass es zwischen den Offsets "nach" und "nach" interpoliert. Sie müssen nur die zur Berechnung selbst „auf“ Offset auf, wie Sie wollen die Dinge am Ende:

@interface MyTransitionLayout : UICollectionViewTransitionLayout 
@property (nonatomic) CGPoint fromContentOffset; 
@property (nonatomic) CGPoint toContentOffset; 
@end 

#import "MyTransitionLayout.h" 
@implementation MyTransitionLayout 

- (void) setTransitionProgress:(CGFloat)transitionProgress 
{ 
    super.transitionProgress = transitionProgress; 
    CGFloat f = 1 - transitionProgress; 
    CGFloat t = transitionProgress; 
    CGPoint offset = CGPointMake(f * self.fromContentOffset.x + t * self.toContentOffset.x, f * self.fromContentOffset.y + t * self.toContentOffset.y); 
    self.collectionView.contentOffset = offset; 
} 

@end 

Eine Sache zu beachten ist, dass die contentOffset auf den „von“ Wert zurückgesetzt wird, wenn der Übergang abgeschlossen ist, aber Sie können das negieren, indem sie es zurück in die „auf“ Offset bei der Fertigstellung von Block startInteractiveTransitionToCollectionViewLayout

CGPoint toContentOffset = ...; 
[self.collectionViewController.collectionView startInteractiveTransitionToCollectionViewLayout:layout completion:^(BOOL completed, BOOL finish) { 
    if (finish) { 
     self.collectionView.contentOffset = toContentOffset; 
    } 
}]; 

UPDATE

Einstellung habe ich geschrieben eine Implementierung dieser und eine Arbeitsprüfung ple in einer neuen GitHub-Bibliothek TLLayoutTransitioning. Das Beispiel ist nicht interaktiv und soll eine verbesserte Animation über setCollectionViewLayout:animated:completion demonstrieren. Es verwendet jedoch die interaktiven Übergangs-APIs in Kombination mit der oben beschriebenen Technik. Werfen Sie einen Blick auf die TLTransitionLayout class und versuchen Sie die "Resize" example im Arbeitsbereich Beispiele ausführen.

Vielleicht TLTransitionLayout kann erreichen, was Sie brauchen.

UPDATE 2

Ich habe ein interaktives Beispiel für die TLLayoutTransitioning Bibliothek. Versuchen Sie, den "Pinch" example im Arbeitsbereich Beispiele auszuführen. Dieser kneift die sichtbaren Zellen als eine Gruppe ab. Ich arbeite an einem anderen Beispiel, das eine einzelne Zelle so klemmt, dass die Zelle während des Übergangs Ihren Fingern folgt, während die anderen Zellen dem linearen Standardpfad folgen.

UPDATE 3

ich vor kurzem mehr Inhalt Offset Platzierungsoptionen hinzugefügt haben: Minimal, Mitte, Oben, Links, Unten und Rechts. Und transitionToCollectionViewLayout: unterstützt jetzt 30+ Beschleunigungsfunktionen mit freundlicher Genehmigung von Warren Moores AHEasing library.

+0

Das sieht vielversprechend aus, ich freue mich wirklich darauf zu schauen und zu sehen, ob es meine Probleme löst. Eine Frage: Gibt es in Ihrem Beispielprojekt tatsächlich eine interaktive Komponente (z. B. um zwischen den Layouts hin- und herzuwechseln und den Übergang möglicherweise aufzuheben)? (Ich habe keine offensichtliche gefunden) –

+0

Nein, gibt es nicht. Ich könnte dieses Wochenende ein zweites Beispiel nehmen. –

+0

Das verlinkte Repository ist ausgezeichnet. Danke, dass Sie sich die Zeit genommen haben, es zu erstellen und zu teilen. – jrturton