[Swift] UIBezierPathで簡単なアイコンサンプルを作成する

# はじめに
アプリ開発をしていて簡易的にアイコンを設定したいと思ったときに、
単純なものならUIBezierPathを使用してサックっと作成してしまうのも良いかもと思いサンプルを作成しました。

# 対象バージョン
- Xcode ver.11.6
- iOS ver 13.5.1

# 完成サンプル
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/99869/d6def07e-607a-0529-9654-4d746cc5c7ec.png)

```swift:UIBezierPathView.swift
import UIKit

class UIBezierPathView: UIView {
    private var type: Int = 0
    
    init(frame: CGRect, type: Int) {
        super.init(frame: frame)
        self.type = type
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    override func layoutSubviews() {
        backgroundColor = UIColor(red: 88/255, green: 149/255, blue: 223/255, alpha: 1)
        super.layoutSubviews()
        layer.cornerRadius = frame.width / 2
        layer.masksToBounds = true
    }
    
    override func draw(_ rect: CGRect) {
        switch type {
        case 1:
            // プラス
            let verticalPath = UIBezierPath();
            verticalPath.move(to: CGPoint(x: rect.midX, y: 15));
            verticalPath.addLine(to: CGPoint(x: rect.midX, y: rect.maxY - 15));
            verticalPath.close()
            UIColor.white.setStroke()
            verticalPath.lineWidth = 4
            verticalPath.stroke();
            
            let horizontalPath = UIBezierPath();
            horizontalPath.move(to: CGPoint(x: 15, y: rect.midY));
            horizontalPath.addLine(to: CGPoint(x: rect.maxX - 15, y: rect.midY));
            horizontalPath.close()
            UIColor.white.setStroke()
            horizontalPath.lineWidth = 4
            horizontalPath.stroke();
        case 2:
            // バツ
            let rightPath = UIBezierPath();
            rightPath.move(to: CGPoint(x: 18, y: 18));
            rightPath.addLine(to: CGPoint(x: rect.maxX - 18, y: rect.maxY - 18));
            rightPath.close()
            UIColor.white.setStroke()
            rightPath.lineWidth = 4
            rightPath.stroke();

            let leftPath = UIBezierPath();
            leftPath.move(to: CGPoint(x: rect.maxX - 18, y: 18));
            leftPath.addLine(to: CGPoint(x: 18, y: rect.maxY - 18));
            leftPath.close()
            UIColor.white.setStroke()
            leftPath.lineWidth = 4
            leftPath.stroke();
        case 3:
            // 四角
            let squarePath = UIBezierPath(rect: CGRect(x: 15, y: 15, width: 18, height: 18))
            UIColor.white.setStroke()
            squarePath.lineWidth = 4.0
            squarePath.stroke()
        case 4:
            // 三角
            let trianglePath = UIBezierPath();
            trianglePath.move(to: CGPoint(x: rect.maxX - 15, y: rect.midY));
            trianglePath.addLine(to: CGPoint(x: 20, y: 15));
            trianglePath.addLine(to: CGPoint(x: 20, y: rect.maxY - 15));
            trianglePath.close()
            UIColor.white.setStroke()
            trianglePath.lineWidth = 4.0
            trianglePath.stroke();
        case 5:
            // 三本線
            let lineOnePath = UIBezierPath();
            lineOnePath.move(to: CGPoint(x: 15, y: 18));
            lineOnePath.addLine(to: CGPoint(x: rect.maxX - 15, y: 18));
            lineOnePath.close()
            UIColor.white.setStroke()
            lineOnePath.lineWidth = 4
            lineOnePath.stroke();

            let lineTwoPath = UIBezierPath();
            lineTwoPath.move(to: CGPoint(x: 15, y: 25));
            lineTwoPath.addLine(to: CGPoint(x: rect.maxX - 15, y: 25));
            lineTwoPath.close()
            UIColor.white.setStroke()
            lineTwoPath.lineWidth = 4
            lineTwoPath.stroke();
            
            let lineThreePath = UIBezierPath();
            lineThreePath.move(to: CGPoint(x: 15, y: rect.maxY - 18));
            lineThreePath.addLine(to: CGPoint(x: rect.maxX - 15, y: rect.maxY - 18));
            lineThreePath.close()
            UIColor.white.setStroke()
            lineThreePath.lineWidth = 4
            lineThreePath.stroke();
        default:
            // 円
            let circlePath = UIBezierPath(arcCenter: CGPoint(x: rect.midX, y: rect.midY), radius: 10, startAngle: 0, endAngle: CGFloat(Double.pi) * 2, clockwise: true)
            UIColor.white.setStroke()
            circlePath.lineWidth = 4.0
            circlePath.stroke()
        }
    }
}
```

```swift:UIBezierPathViewController.swift
import UIKit

class UIBezierPathViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        self.view.backgroundColor = .white
        
        let circleView = UIBezierPathView(frame: CGRect(x: 0, y: 50, width: 50, height: 50), type: 0)
        circleView.center.x = view.center.x
        view.addSubview(circleView)
        
        let plusView = UIBezierPathView(frame: CGRect(x: 0, y: 150, width: 50, height: 50), type: 1)
        plusView.center.x = view.center.x
        view.addSubview(plusView)
        
        let closeView = UIBezierPathView(frame: CGRect(x: 0, y: 250, width: 50, height: 50), type: 2)
        closeView.center.x = view.center.x
        view.addSubview(closeView)

        let squareView = UIBezierPathView(frame: CGRect(x: 0, y: 350, width: 50, height: 50), type: 3)
        squareView.center.x = view.center.x
        view.addSubview(squareView)
        
        let triangleView = UIBezierPathView(frame: CGRect(x: 0, y: 450, width: 50, height: 50), type: 4)
        triangleView.center.x = view.center.x
        view.addSubview(triangleView)
        
        let threeLineView = UIBezierPathView(frame: CGRect(x: 0, y: 550, width: 50, height: 50), type: 5)
        threeLineView.center.x = view.center.x
        view.addSubview(threeLineView)
    }
}
```

# まとめ
シンプルなものなら簡単に描画できるので、忘れたときに参考にしてもらえればと思います。