Sviluppo iOS con Swift 2 - Animazioni

L'animazione è una parte importante di qualsiasi applicazione poiché attira l'attenzione dell'utente sull'applicazione. L'animazione è solo una raccolta di immagini che si ripetono a una velocità elevata. Inoltre, rende la tua applicazione diversa dalle altre.

Realizzazione di un progetto di animazione - Kitty Animation

Questo sarà un progetto semplice, in cui eseguiremo un'animazione quando si fa clic su un pulsante. Useremo più immagini per creare una GIF, quindi scarica qualsiasi GIF e convertila in immagini, che ti daranno più fotogrammi di quella GIF.

In questa sezione, utilizzeremo le seguenti immagini.

Queste immagini, se riprodotte insieme, creano un'animazione. Pertanto, creeremo un'applicazione a vista singola. Trascineremo quindi un'opzione di visualizzazione dell'immagine, un'etichetta e un pulsante all'interno del controller della visualizzazione principale. Fatto ciò, collegheremo la visualizzazione dell'immagine e il pulsante al nostro file swift.

(Se non si desidera utilizzare queste immagini, cercare qualsiasi GIF e convertirla in immagine online utilizzando un convertitore da GIF a immagine.)

All'interno dell'azione del pulsante, inseriremo il seguente comando per mostrare l'immagine quando viene premuto un pulsante.

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

Questo è il modo in cui assegniamo in modo programmatico un'immagine a una visualizzazione immagine. La vista dovrebbe ora apparire come segue:

La prima visualizzazione apparirà quando eseguiremo l'applicazione. Quando facciamo clic sul pulsante Animate, apparirà l'immagine.

Questa non è un'animazione, ma solo un'immagine. Creeremo l'animazione ora -

Aggiungi una variabile sotto l'uscita dell'immagine: var counter = 1.

Guarda che le nostre immagini hanno un nome comune e solo un carattere è diverso. Cambia il codice del tuo pulsante animato come mostrato di seguito -

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

Ora, quando premi il pulsante animate, l'immagine cambia ogni volta. Il passaggio successivo consiste nel creare quanto segue:

  • Crea una variabile - isAnimating e assegnagli False.

  • Crea una variabile timer e assegna un file Timer() funzione ad esso.

Una volta completati i due passaggi precedenti, creare una funzione animata e incollare il codice seguente.

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

Dove, counter è la nostra variabile counter creata nel file precedente. Ora, all'interno della funzione del pulsante di animazione, aggiungi il seguente codice:

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 
}

Prova a eseguire l'applicazione e vedremo che un'animazione è in esecuzione sul tuo dispositivo.

Challenge - Aggiungi un pulsante di arresto che interromperà l'animazione.