[Swift入門]UI部品のOutletとAction（接続）の違いをざっくりと

# [Swift超入門]UI部品のOutletとActionをボタンによる動作で確認する

##使用UI部品
buttonとlabelのみ

##OutletとActionの違いについて
　ドキュメントアウトラインからコードに接続する際に（controlキーを押しながらドラック＆ドロップの作業）、写真のようなダイアログが出てくるかと思います。
![スクリーンショット 2018-08-31 22.05.47.png](https://qiita-image-store.s3.amazonaws.com/0/285361/b1b153f4-3b06-d118-03f7-77b8ba42a5a6.png)
　この際、Connectionの部分でOutletまたはActionを選択することになります。この２つの違いを理解していない場合に起こるエラーを実体験とともに書き下して行こうと思います。
　まずその前にOutletとActionの違いを文面的に書くと、
　Outlet: UI部品を**プロパティ**として接続する。
　Action:UI部品を**メソッド**として接続する。
　つまり、
**Outlet**はその部品に関して他の関数やメソッドなどで行われる動作をコードに書く時に
**Action**はその部品が行う処理の内容を書く時に
それぞれ接続、定義する必要があります。
　例を挙げます。ボタンで考えると、そのボタンを押すことで行われる動作の定義は**Action**で、他のボタンを押したりすることで特定のボタンに影響を与える（ボタンを押すことを不可能にする、そのボタンを見えなくさせる）などと言った動作の定義には**Outlet**を用いることになるのです。
　文章ではよくわからないかと思いますので、実際の処理を見ていきましょう。

##ボタンのOutletを接続しなかった場合
```Swift:sample.swift
import UIKit

class ViewController: UIViewController {
    
    @IBOutlet weak var time: UILabel!
    var selectedTime = 0
    var count = 0
    
    //１秒追加する
   
    @IBAction func timer1(_ sender: Any) {
        selectedTime += 1
        time.text = "\(selectedTime)" //変数展開を行い、時間を表示する
    }
    
    //10秒追加する
    @IBAction func timer10(_ sender: UIButton) {
        selectedTime += 10
        time.text = "\(selectedTime)"
    }
    
    //設定された時間によるタイマーをスタートさせる
    @IBAction func timeStart(_ sender: UIButton) {
        
     //スタートボタンを押すと時間追加ボタンを触れなくする
        count += 1
        if count % 2 == 1{
            timer1.isEnabled = false
            timer10.isEnabled = false
     //ストップを押した時に時間追加ボタンを触れるようにする
        }else{
            timer1.isEnabled = true
            timer10.isEnabled = true
        }
       
    }
    override func viewDidLoad() { 
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}
```
　このようなコードを書くことで、１秒ボタン、１０秒ボタンを押した際に計測時間に数値が加算されています。（実際のタイマーの作成に関してはまだ未完成です。）　
　ですが、今のままでは、

```Swift:sample.swift
//スタートボタンを押すと時間追加ボタンを触れなくする
        count += 1
        if count % 2 == 1{
            timer1.isEnabled = false
            timer10.isEnabled = false
     //ストップを押した時に時間追加ボタンを触れるようにする
        }else{
            timer1.isEnabled = true
            timer10.isEnabled = true
        }
```
の部分に関して、次のエラーが生じます。（本来はここで、スタートストップボタンを押すことで、タイマーの動作中は他の二つのボタンが機能しなくなることを目的としています。）
![スクリーンショット 2018-09-01 2.13.08.png](https://qiita-image-store.s3.amazonaws.com/0/285361/7c2a7c76-29ad-05c8-f444-0a726169f6c0.png)
　これは、現状では１秒追加ボタン、１０秒追加ボタンともに定義しているのは**Action**のみであり、**Actionではそのボタンを押すことで行う動作を記入ことを可能にしているものだからです。**
　そこで、それぞれのボタンで**Action**だけではなく、**Outlet**を接続し直すことで、これらのエラーを解除することができました。

###動作確認
<img src ="https://qiita-image-store.s3.amazonaws.com/0/285361/dea92343-fc41-b869-ff13-c69bfa947aa9.png", width =40%> <img src = "https://qiita-image-store.s3.amazonaws.com/0/285361/76893a23-bd30-c786-dc67-5cbf6f10c5af.png" width = 42%>


##今回用いたコード全体
```Swift:sample.swift
import UIKit

class ViewController: UIViewController {
    
    @IBOutlet weak var time: UILabel!
    @IBOutlet weak var timer1: UIButton!
    @IBOutlet weak var timer10: UIButton!
    
    var selectedTime:Int = 0
    var count = 0
    
    //１秒追加する
   
    @IBAction func timer1(_ sender: Any) {
        selectedTime += 1
        time.text = "\(selectedTime)"
    }
    
    //10秒追加する
    @IBAction func timer10(_ sender: UIButton) {
        selectedTime += 10
        time.text = "\(selectedTime)"
    }
    
    //設定された時間によるタイマーをスタートさせる
    @IBAction func timeStart(_ sender: UIButton) {
        
     //スタートボタンを押すと時間追加ボタンを触れなくする
        count += 1
        if count % 2 == 1{
            timer1.isEnabled = false
            timer10.isEnabled = false
     //ストップを押した時に時間追加ボタンを触れるようにする
        }else{
            timer1.isEnabled = true
            timer10.isEnabled = true
        }
       
    }
    override func viewDidLoad() {
        
            
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}
```

##まとめ
　**Action**と**Outlet**をうまく使い分けることで、今回のようにボタンとラベルの連動、ボタン同士の連動を可能にすることができました。