Swift 2 iOS開發 - 動畫

動畫是任何應用程式的重要組成部分，因為它會吸引使用者對應用程式的注意。動畫只是一系列以快速速度重複的影像。它還可以使您的應用程式與眾不同。

製作動畫專案 - 小貓動畫

這將是一個簡單的專案，我們將在點選按鈕時執行動畫。我們將使用多張圖片來建立 GIF，因此請下載任何 GIF 並將其轉換為圖片，這將為您提供該 GIF 的多個幀。

在本節中，我們將使用以下影像。

這些影像一起播放時，會建立動畫。因此，我們將建立一個單檢視應用程式。然後，我們將一個影像檢視選項、一個標籤和一個按鈕拖到主檢視控制器中。完成後，我們將影像檢視和按鈕連線到我們的 Swift 檔案。

（如果您不想使用這些影像，請搜尋任何 GIF 並使用一些 GIF 到影像轉換器線上將其轉換為影像。）

在按鈕操作內部，我們將插入以下命令以在按下按鈕時顯示影像。

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

這就是我們以程式設計方式將影像分配給影像檢視的方式。現在檢視應如下所示：

當我們執行應用程式時，將顯示第一個檢視。當我們點選“動畫”按鈕時，影像將出現。

這不是動畫，而只是一張圖片。我們現在將建立動畫 -

在影像出口下方新增一個變數：var counter = 1。

請注意，我們的影像具有共同的名稱，只有一個字元不同。更改動畫按鈕的程式碼，如下所示：

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

現在，當您按下動畫按鈕時，影像每次都會更改。下一步是建立以下內容：

建立一個變數 - isAnimating 併為其分配 False。
建立一個計時器變數，併為其分配Timer()函式。

完成上述兩個步驟後，建立一個名為 animate 的函式，並將以下程式碼貼上到其中。

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

其中，counter 是我們在上一個檔案中建立的計數器變數。現在，在 animate 按鈕函式內部，新增以下程式碼：

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 
}

嘗試執行應用程式，我們將看到您的裝置上正在執行動畫。

挑戰 - 新增一個停止按鈕來停止動畫。

列印頁面