【Swift3.0】サイドメニューもどきを作ってみた

# はじめに
なんかサイドメニューが出るアプリがかっこいいと思ったので作ってみた。
忘れると虚しいので備忘録としてQiitaさんに残す。

# 開発環境
- Xcode8.1
- Swift3.0

# 実装方法
イメージとしては、スクリーン内にメイン画面を表示し、左の画面外にサイドメニューを追加する。
アプリ起動直後はサイドメニューはスクリーン外にあるので、スクリーン内に表示されない。
ボタンを押すことで、スクリーン外のサイドメニューをアニメーション付きでスクリーン内に移動させる。
こんな感じでサイドメニューを実装してみた。
![IMG_3637.PNG](https://qiita-image-store.s3.amazonaws.com/0/108396/d24cf9b8-d67e-8214-975d-2f44717fa42d.png)


# storyboard
- storyboardで**メイン画面**と**サイドメニュー**を作成
- メイン画面にはサイドメニューを出し入れするための**ボタン**をつける
- サイドメニューのstoryboard IDに**sideMenu**と入力する

![image](https://qiita-image-store.s3.amazonaws.com/0/108396/eb6a2be1-cd16-ebfa-7b80-211ddd32edf9.png)


# ViewController.swift

```swift:ViewController.swift
import UIKit

class ViewController: UIViewController {

    //  サイドメニューが表示中かの真偽
    var isDisplayedSideMenu: Bool = false
    
    //  スクリーンサイズを格納するための変数
    var screenWidth: CGFloat = 0
    
    //  storyboard上のサイドメニュー(UIViewController)を格納するためのもの
    var sideMenuVC: UIViewController!
    
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        //  スクリーンの幅を取得して、変数に格納
        screenWidth = getScreenSize().0
        
        //  メインビューにサイドメニューを追加
        addSideMenu()
    }

    
    /*
     *  @IBAction
     */
    //  メイン画面のボタンと紐付ける
    @IBAction func button(_ sender: Any) {
        //  サイドメニューが表示されていない時
        if isDisplayedSideMenu == false {
            //  サイドメニューを出す
            displaySideMenu()
        }
        //  サイドメニューが表示されている時
        else {
            //  サイドメニューを閉じる
            closeSideMenu()
        }
    }
    
    
    /*
     *  メソッド
     */
    // スクリーンのサイズを取得するためのメソッド
    func getScreenSize() -> (CGFloat, CGFloat) {
        
        //  スクリーンサイズを取得
        let screenSize = UIScreen.main.bounds.size
        
        //  スクリーンの幅と高さを変数に格納
        let width: CGFloat = screenSize.width
        let height: CGFloat = screenSize.height
        
        return (width, height)
    }
    
    //  サイドメニューをメインビューに追加するためのメソッド
    func addSideMenu() {
        
        //  サイドメニューをメインビューに追加
        sideMenuVC = (storyboard?.instantiateViewController(withIdentifier: "sideMenu"))! as UIViewController
        self.addChildViewController(sideMenuVC)
        self.view.addSubview(sideMenuVC.view)
        sideMenuVC.didMove(toParentViewController: self)
        
        //  画面外に追加したサイドメニューを移動
        sideMenuVC.view.transform = CGAffineTransform(translationX: (screenWidth * -1), y: 0)
    }
    
    //  サイドメニューをメインビューに出すためのメソッド
    func displaySideMenu() {
        
        //  サイドメニューをアニメーション付きで移動させる
        UIView.animate(withDuration: 0.2, animations: { () -> Void in
            self.sideMenuVC.view.transform = CGAffineTransform(translationX: (self.screenWidth * -1/2), y: 0)
        })
        
        //  サイドメニューが表示されていることにする
        isDisplayedSideMenu = true
    }
    
    //  サイドメニューを格納するためのメソッド
    func closeSideMenu() {
        
        //  サイドメニューをアニメーション付きで移動させる
        UIView.animate(withDuration: 0.2, animations: { () -> Void in
            self.sideMenuVC.view.transform = CGAffineTransform(translationX: (self.screenWidth * -1), y: 0)
        })
        
        //  サイドメニューが表示されていることにする
        isDisplayedSideMenu = false
    }
}
```


起動後
<img width="375" alt="image" src="https://qiita-image-store.s3.amazonaws.com/0/108396/09c78905-0621-f726-d767-6345f1cb0ab2.png">

ボタンを押すと...
<img width="375" alt="image" src="https://qiita-image-store.s3.amazonaws.com/0/108396/8a427c9f-48bf-94a6-66c3-2c38a74935ec.png">