iOS-Entwicklung mit Swift 2 - Animationen

Animation ist ein wichtiger Bestandteil jeder Anwendung, da sie den Benutzer auf die Anwendung aufmerksam macht. Animation ist nur eine Sammlung von Bildern, die sich schnell wiederholen. Dadurch unterscheidet sich Ihre Anwendung auch von anderen.

Erstellen eines Animationsprojekts - Kitty Animation

Dies wird ein einfaches Projekt sein, bei dem wir eine Animation ausführen, wenn auf eine Schaltfläche geklickt wird. Wir werden mehrere Bilder verwenden, um ein GIF zu erstellen. Laden Sie also ein beliebiges GIF herunter und konvertieren Sie es in Bilder, wodurch Sie mehrere Frames dieses GIF erhalten.

In diesem Abschnitt werden die folgenden Bilder verwendet.

Wenn diese Bilder zusammen abgespielt werden, wird eine Animation erstellt. Daher werden wir eine Einzelansicht-Anwendung erstellen. Anschließend ziehen wir eine Bildansichtsoption, eine Beschriftung und eine Schaltfläche in den Hauptansichts-Controller. Sobald dies erledigt ist, verbinden wir die Bildansicht und die Schaltfläche mit unserer schnellen Datei.

(Wenn Sie diese Bilder nicht verwenden möchten, suchen Sie nach einem GIF und konvertieren Sie es online in ein Bild, indem Sie einen GIF-zu-Bild-Konverter verwenden.)

Innerhalb der Schaltflächenaktion fügen wir den folgenden Befehl ein, um das Bild anzuzeigen, wenn eine Schaltfläche gedrückt wird.

imageView.image = UIImage(named: "frame_0_delay-0.1s.gif") 
// frame_0_delay-0.1s.gif, is the name of image

Auf diese Weise weisen wir einer Bildansicht programmgesteuert ein Bild zu. Die Ansicht sollte nun wie folgt aussehen:

Die erste Ansicht wird angezeigt, wenn wir die Anwendung ausführen. Wenn wir auf die Schaltfläche Animieren klicken, wird das Bild angezeigt.

Dies ist keine Animation, sondern nur ein Bild. Wir werden jetzt die Animation erstellen -

Fügen Sie eine Variable unter dem Bildausgang hinzu: var counter = 1.

Achten Sie darauf, dass unsere Bilder einen gemeinsamen Namen haben und nur ein Zeichen unterschiedlich ist. Ändern Sie den Code Ihrer Animationsschaltfläche wie unten gezeigt -

@IBAction func animatePressed(_ sender: Any) { 
   imageView.image = UIImage(named: "frame_\(counter)_delay-0.1s.gif") 
   counter += 1 
   if counter == 9 { 
      counter = 0 
   } 
}

Nun, wenn Sie die Taste drücken animateSchaltfläche ändert sich das Bild jedes Mal. Der nächste Schritt besteht darin, Folgendes zu erstellen:

Variable erstellen - isAnimating und weisen Sie ihm Falsch zu.
Erstellen Sie eine Timer-Variable und weisen Sie eine zu Timer() Funktion dazu.

Wenn Sie die beiden oben genannten Schritte ausgeführt haben, erstellen Sie eine animierte Funktion und fügen Sie den folgenden Code ein.

func animate() { 
   imageView.image = UIImage(named: "frame_\(counter)_delay-s.gif") 
   counter += 1 
   if counter == 9 { 
      counter = 0 
   } 
}

Wobei Zähler unsere Zählervariable ist, die wir in der vorherigen Datei erstellt haben. Fügen Sie nun in der Funktion zum Animieren der Schaltfläche den folgenden Code hinzu:

if isAnimating { 
   timer.invalidate() 
   isAnimating = false 
} else { 
   timer = Timer.scheduledTimer(timeInterval: 0.1, target: self, selector: 
   #selector(ViewController.animate), userInfo: nil, repeats: true) 
   isAnimating = true 
}

Versuchen Sie, die Anwendung auszuführen, und wir werden sehen, dass eine Animation auf Ihrem Gerät ausgeführt wird.

Challenge - Fügen Sie eine Stopp-Schaltfläche hinzu, mit der die Animation gestoppt wird.