iOS - Wie man eine Animationsspur anfasst

8

Was ist der beste Weg, um eine sanfte Umkehr-Animation zu implementieren, die Berührungen verfolgt? Ich beziehe mich auf jene Animationen, in denen zum Beispiel, wenn der Benutzer eine Wischgeste ausführt, einige Elemente sanft auf dem Bildschirm animieren und andere ausschalten, aber , wenn der Benutzer stattdessen langsam eine Schwenkgeste vor und zurück zieht Die gleichen Objekte bewegen sich in Prozent entsprechend der Berührungsposition vorwärts / rückwärts. Dies ist in vielen App-Intros und auch in Übergängen zu sehen. Ich habe

gefunden
  • Ein Tutorial, das die integrierte Funktion dafür erklärt, aber es ist nur zwischen View Controller-Übergängen, die nicht die volle granulare Kontrolle bieten, die ich in vielen Apps sehe ( Ссылка )
  • Jazzhands, das ist ein Kit von IFTTT, aber dies ist eine Paketlösung, die möglicherweise nicht deckt, wie die Lösung am besten auf einer niedrigeren Ebene implementiert wird ( Ссылка )
  • Hier eine Frage, für welche eine Antwort zeigt, wie Sie eine Animation nach dem Ende einer Geste ausführen können ( iOS Touch , Gesten, Animation )

Was ich nicht verstehe - und ich fühle mich wohl in der Verwendung von CAAnimationen und Gesten - ist, wie etwas sowohl animiert als auch interaktiv sein kann .

Wenn ich eine Animation erstelle, bewerbe ich mich normalerweise für die Animation und sie geht von Anfang bis Ende. Während ich die Animation unterbrechen konnte, während die Berührungen fortgesetzt werden, scheint es, als wäre sie gestelzt.

Auf der anderen Seite ist es einfach, Dinge als Reaktion auf Benutzereingaben zu verschieben, aber das ist nicht animiert.

Wie wird der Effekt erreicht, wo sich etwas gemäß einer Animation ändern kann, aber auch genau die gleiche Animation an Berührungen geknüpft, und doch auch hat, damit obwohl die Animation sie vollendet wird nicht wirklich "beendet" (unumkehrbar), es sei denn, der Benutzer gibt die Berührung frei, während zu irgendeinem Zeitpunkt während der Interaktion der Benutzer die Schwenkbewegung freigibt, kehrt die Animation je nach der letzten Berührungsposition und Geschwindigkeit zu ihrer Ausgangsposition zurück . Diese Anforderungen sind verwirrend.

Die Einblicke in diese Technik, die ich sehe, betreffen alle Keyframe-Animationen, aber was ich nicht verstehe, ist wo die Berührungsereignisse sich mit einer Animation überschneiden, um diese glatten Effekte zu erzeugen, die ich sehe.

Alle Tipps, Beispiele oder Anleitungen sind sehr willkommen.

    
SG1 27.03.2014, 02:33
quelle

1 Antwort

12
  

Was ich nicht verstehe - und ich fühle mich wohl bei CAAnimationen und Gesten - ist, wie etwas sowohl animiert als auch interaktiv sein kann.

Es liegt daran, dass Sie, nachdem Sie eine Animation eingerichtet haben, diese auf einen beliebigen "Rahmen" einstellen können. So können Sie die Animation in Übereinstimmung mit der Bewegung einer Geste verfolgen.

Dies funktioniert so, dass eine Animation eine Eigenschaft des Renderbaums ist, der zu einem CALayer gehört. CALayer implementiert das CAMediaTiming-Protokoll. Der timeOffset eines CALayers bestimmt somit, welcher "Rahmen" einer Animation, die dieser Layer anzeigt. Wenn eine komplexe Animation viele verschiedene Ebenen umfasst, kein Problem; Setzen Sie einfach timeOffset ihres gemeinsamen Superlayers, um den Frame der gesamten Animation zu steuern.

Genau so funktioniert die neue benutzerdefinierte iOS 7-Übergangsfunktion (auf die Sie in Ihrer Frage zu Recht verweisen). In diesem Beispiel beispielsweise:

Ссылка

... Ich aktualisiere den UIPercentDrivenInteractiveTransition, um zu sagen, wie weit die Geste des Benutzers ist, und die Animation verfolgt daher die Geste. Nun frag dich: Wie zum Teufel ist das möglich ???

Nun, der UIPercentDrivenInteractiveTransition, wiederum hinter den Kulissen, passt die timeOffset der Ebene an, um die Animation im entsprechenden Frame darzustellen. (Sie können meinem Beispiel tatsächlich Protokollierungscode hinzufügen, um zu sehen, dass dies zutrifft.)

Wenn ich die Geste an einem unvollständigen Punkt beende, eilt die Animation entweder zu ihrem Ende oder läuft rückwärts bis zu ihrem Anfang - wieder wegen des CAMediaTiming-Protokolls, mit dem Sie die speed der Animation ändern können einschließlich eines negativen Werts, um es rückwärts auszuführen.

    
matt 27.03.2014, 02:45
quelle

Tags und Links