[初心者向け]Swiftでビューとジェスチャーの追加


LINEのエンジニアが教えてくれる、[超・超・超初心者向けSwiftを始めてみよう勉強会 Vol3](http://swiftstarter.connpass.com/event/11105/)で勉強した内容の復習をしてみます。

## ジェスチャーの追加

先に実行結果を載せます。

![](http://i.gyazo.com/feb8377f35180f0b3548c26e074165d1.gif)

こんな感じで、四角い部分(ビュー)をタップすると色が変わるものを作ります。

###手順

#### 1. ViewControllerにViewを追加

x30, y30の場所に 縦100,横100のサイズの四角(Rect)view1として宣言して、色を赤に設定してViewControllerに追加します。

```ViewControllr.swift
import UIKit

class ViewController: UIViewController {
    
    override func viewDidLoad() {
        
        super.viewDidLoad()

        var view1 = UIView(frame: CGRectMake(30, 30, 100, 100))
        view1.backgroundColor = .redColor()
    
        self.view.addSubview(view1)
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
}
```



![](http://i.gyazo.com/e32d7165e68568999edd9a4eff6075ec.png)

#### 2. ジェスチャー時のアクションを追加

`tapGesture()`という関数を作成しました。
先ほど作ったView1の色を切り替える関数です。

```ViewControllr.swift
import UIKit

class ViewController: UIViewController {
    
    override func viewDidLoad() {
        
        super.viewDidLoad()

        var view1 = UIView(frame: CGRectMake(30, 30, 100, 100))
        view1.backgroundColor = .redColor()
    
        self.view.addSubview(view1)
    }
    
    //追加
    func tapGesture(gestureRecognizer: UITapGestureRecognizer){
        // タップviewの色を変える (Red <=> Blue)
        if(view1.backgroundColor  == .redColor()) {
            view1.backgroundColor = .blueColor()
        }
        else {
            view1.backgroundColor = .redColor()
        }
    }

    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
}
```

#### 3. ジェスチャーイベントを追加する

2で作った`tapGesture()`を発火するイベントを1で作った`view1`に追加してあげます。

view1をtapGesture()関数内で参照したいため

view1の変数をグローバル宣言しておきます。4行目です

```
var view1: UIView!
```

また、今まではviewDidLoad()内でのみ使っていたので

```
       var view1 = UIView(frame: CGRectMake(30, 30, 100, 100))
```

このように宣言していましたが、グローバル宣言してあるので`var`は削除しておきましょう。
↓

```
        view1 = UIView(frame: CGRectMake(30, 30, 100, 100))
```

8~12行目でジェスチャーの生成->tapGestureとの関連付け->view1との関連付けを行っています。

```ViewControllr.swift
import UIKit

class ViewController: UIViewController {
    var view1: UIView!
    
    override func viewDidLoad() {
        
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        
        // Playground - noun: a place where people can play
        self.view.backgroundColor = .whiteColor()
        
        // ビューの生成
        view1 = UIView(frame: CGRectMake(30, 30, 100, 100))
        view1.backgroundColor = .redColor()
        
        // ジェスチャーの生成
        var aSelector = Selector("tapGesture:")
        var tapRecognizer = UITapGestureRecognizer(target: self, action: aSelector)
        // ジェスチャーの追加
        view1.addGestureRecognizer(tapRecognizer)
        self.view.addSubview(view1)
    }

    
    func tapGesture(gestureRecognizer: UITapGestureRecognizer){
        // タップviewの色を変える (Red <=> Blue)
        if(view1.backgroundColor  == .redColor()) {
            view1.backgroundColor = .blueColor()
        }
        else {
            view1.backgroundColor = .redColor()
        }
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
}
```


以上です。

![](http://i.gyazo.com/feb8377f35180f0b3548c26e074165d1.gif)
実行するとこんなのができるはずです！

##まとめ
久しぶりすぎて色々と勉強になりました!