[IOS/Swift] Custom Button 만들기

UIButton을 커스터마이즈하고, StoryBoard에서 Custom Button을 적용시켜보자!

본 포스팅은  MacOS 10.11.5, Xcode Version 7.3.1 (7D1014), Swift 2 기준으로 작성되었습니다.

1. Custom UIButton Class 만들기

Xcode 프로젝트에 New File - Swift 로 새 스위프트 파일을 추가합니다.

그리고 다음과 같은 UIButton Class로 만들어줍니다.

// UIButton Class 생성
import UIKit

class UIRoundPrimaryButton: UIButton{
    required init(coder aDecoder: NSCoder){
        super.init(coder: aDecoder)!
        
    }
}

2. Button 속성 추가하기

self.layer.cornerRadius: 모서리 둥글기를 결정합니다. 값이 커질 수록 모서리가 둥글둥글해집니다.

self.backgroundColor: 버튼의 배경색을 결정합니다.

self.tintColor: 버튼의 TextColor를 결정한다고 생각하시면 됩니다.

self.layer.borderColor: 버튼의 외곽선 컬러를 결정합니다.

self.layer.borderWidth: 버튼의 외곽선 두께를 결정합니다. 값이 커질 수록 외곽선이 두꺼워집니다.

위에서 만든 클래스에 자신이 원하는 속성을 적절히 추가하면 됩니다.

// UIButton Class 속성 추가
import UIKit

class UIRoundPrimaryButton: UIButton{
    required init(coder aDecoder: NSCoder){
        super.init(coder: aDecoder)!
        self.layer.cornerRadius = 5.0;
        self.backgroundColor = UIColor(red: 255/255, green: 132/255, blue: 102/255, alpha: 1)
        self.tintColor = UIColor.whiteColor()
       
    }
}

3. StoryBoard에 적용하기

스토리보드에 Button 하나를 만들고 Custom Class에 아까 만든 클래스를 입력해줍시다.

버튼의 다른 값들은(text color, background 등) 디폴트로 두도록 합시다. 

4. 실행하여 결과확인

맨 아래 있는 '등록' 버튼이 예제의 커스텀 클래스가 적용 된 모습입니다.