【Swift】丸いボタンを設置する方法

iOSアプリで丸いボタンを作るにはどうすれば良いのか調べてみました。

コードを追加する

以下のコードを適当なファイル名でプロジェクト内に保存します。

RoundButtonクラスというUIButtonをカスタマイズしたクラスになります。

cornerRadiusという値が設定できるようになっており、以下のクラスを使えば角の丸みを設定できるようになります。

import UIKit

@IBDesignable class RoundButton : UIButton{

    override init(frame: CGRect) {
        super.init(frame: frame)
        sharedInit()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        sharedInit()
    }

    override func prepareForInterfaceBuilder() {
        sharedInit()
    }

    func sharedInit() {
        refreshCorners(value: cornerRadius)
    }

    func refreshCorners(value: CGFloat) {
        layer.cornerRadius = value
    }

    @IBInspectable var cornerRadius: CGFloat = 15 {
        didSet {
            refreshCorners(value: cornerRadius)
        }
    }
}

ストーリーボード

ストーリーボードでボタンを配置します。

Constrainsで高さと横幅を50に設定します。

CustomClassでクラスを先ほど作成したRoundButtonクラスに指定します。

Attribute InspectorでCornerRadiusが設定できるようになるので、高さの半分である25を指定します。以上。