“`html

簡要介紹

在這篇文章中，我們將學習如何使用 Swift 和 UIView.transition 來製作圖片幻燈片效果。這種方法不僅簡單易用，而且能讓你的應用程式界面更加生動。接下來，我們會逐步介紹如何設置兩個 UIImageView，以及如何透過 UIButton 來實現圖片的切換效果。

基本設置

首先，我們需要準備兩個 UIImageView 和一個 UIButton，這樣才能實現圖片的切換。

宣告變數

在你的 ViewController 中，宣告以下變數：

 
let imageView1 = UIImageView(image: UIImage(named: "food1"))
let imageView2 = UIImageView(image: UIImage(named: "food3"))
let button = UIButton(type: .system)
var flag = 0

viewDidLoad 方法

在 viewDidLoad 中，我們將設置 UIImageView 的屬性，並添加到主視圖中。同時也會設置 UIButton 的基本屬性。

 
override func viewDidLoad() {
    super.viewDidLoad()
    imageView2.isHidden = true
    
    [imageView1, imageView2].forEach {
        0.contentMode = .scaleAspectFill0.layer.masksToBounds = true
        0.frame = CGRect(x: 0, y: 0, width: self.view.frame.width, height: self.view.frame.width)
        view.addSubview(0)
    }
    
    view.addSubview(button)
    button.frame = CGRect(x: 0, y: 0, width: self.view.frame.width, height: self.view.frame.width)
    button.setTitle("", for: .normal)
    button.addTarget(self, action: #selector(buttonClicked), for: .touchUpInside)
}

Button 的 Target 方法

在這個方法中，我們將使用 flag 變數來切換圖片。通過 flag % 2，我們可以判斷當前顯示的是哪一張圖片。使用 UIView.transition 來實現轉換效果。

 
@IBAction func buttonClicked(sender: UIButton) {
    let isOne = flag % 2 == 0
    let currentView = isOne ? imageView1 : imageView2
    let toView = isOne ? imageView2 : imageView1
    flag += 1
    
    UIView.transition(from: currentView, to: toView, duration: 0.4, options: [.showHideTransitionViews, .transitionCrossDissolve], completion: nil)
}

Demo 效果
圖片幻燈片效果展示

完成

透過以上的步驟，你已經成功實現了 Swift 中的圖片幻燈片效果。這個效果可以廣泛應用於各種應用程式中，提升用戶體驗。

Q&A（常見問題解答）

Q1: 如何添加更多圖片到幻燈片中？
A1: 你可以增加更多的 UIImageView，並在 buttonClicked 方法中進行相應的邏輯處理，以支持更多的圖片切換。

Q2: UIView.transition 是否支持自定義轉換效果？
A2: 是的，UIView.transition 允許你使用不同的選項來創建自定義的轉換效果，你可以根據需要調整 duration 和 options 參數。

Q3: 如何提升圖片的加載速度？
A3: 可以考慮使用圖片緩存技術，或者使用更小的圖片尺寸來提高加載速度。
“`
—

Categorized in:

swift