區分連到同一個 IBAction function 的多個元件

當多個 button 有類似的功能時，我們通常會將它們連到同一個 IBAction function，比方以下的 App Guess The Logo — Logo Quiz，畫面裡有顯示 4 個 logo 的 button，玩家必須點選 button 猜哪一個是麥當勞。由於四個 button 的功能類似，所以我們可以將它們連到同一個 IBAction function，但是這時候要怎麼判斷玩家按的是哪一個 button 呢 ?

以下我們分別介紹三種不同的判斷方法。

方法 1: 比對 IBOutlet

將四個 button 分別拉 outlet。

@IBOutlet weak var optionButton0: UIButton!
@IBOutlet weak var optionButton1: UIButton!
@IBOutlet weak var optionButton2: UIButton!
@IBOutlet weak var optionButton3: UIButton!

利用 if 比對點選的 sender 是哪個 outlet。

@IBAction func selectOption(_ sender: UIButton) {
        
        if sender == optionButton0 {
            
        } else if sender == optionButton1 {
            
        } else if sender == optionButton2 {
            
        } else if sender == optionButton3 {
            
        }
}

也可以用 switch 比對。

@IBAction func selectOption(_ sender: UIButton) {
        switch sender {
        case optionButton0:
            print("optionButton0")
        case optionButton1:
            print("optionButton1")
        case optionButton2:
            print("optionButton2")
        case optionButton3:
            print("optionButton3")
        default:
            break
        }
        
}

方法 2: 判斷 tag

將四個 button 分別設定 tag，比方設為 tag 0，1，2，3。

讀取 tag 數字判斷點選的是第幾個 button。

@IBAction func selectOption(_ sender: UIButton) {
   print(sender.tag)        
}

若要優化程式，可進一步將 tag 的數字定義成 enum，例如以下例子:

enum ButtonTag: Int {
    case option1 = 1, option2 
}

方法 3: 找出元件是 outlet collection 裡的第幾個

將四個 button 連成 outlet collection。

@IBOutlet var optionButtons: [UIButton]!

呼叫 array 的 function firstIndex(of:)，傳入點選的 button，找出它是第幾個。

@IBAction func selectOption(_ sender: UIButton) {
        
        let index = optionButtons.firstIndex(of: sender)!
        print(index)
        
}