XCode-인터페이스 빌더에 boder, corner를 추가해보자.

XCode-인터페이스 빌더에 boder, corner를 추가해보자.

View에 broder와 corner값을 줘야할때 소스로 구현한다면 이런 모양이 된다.

뷰가 하나여서 지금 모양새가 괜찮지만

만약 설정해야 하는 뷰가 여러개라면?

소스의 반이상이 border와 corner관련 소스가 될 것이다.

UI관련을 인터페이스 빌더에서 처리한다면 좋을것 같다.

다음 소스를 추가하여 UIView의 기능을 확장해주자.

@IBDesignable extension UIView {
    @IBInspectable var borderWidth: CGFloat {
        set {
            layer.borderWidth = newValue
        }
        get {
            return layer.borderWidth
        }
    }

    @IBInspectable var cornerRadius: CGFloat {
        set {
            layer.cornerRadius = newValue
        }

        get {
            return layer.cornerRadius
        }
    }

    @IBInspectable var borderColor: UIColor? {
        set {
            guard let uiColor = newValue else { return }
            layer.borderColor = uiColor.cgColor
        }

        get {
            guard let color = layer.borderColor else { return nil }
            return UIColor(cgColor: color)
        }
    }
}





/*
@IBDesignable > 해당 클레스가 구현하는 것들이 스토리보드에 나타나게끔 함
스토리보드에 나타나지 않을시 직접 빌드하여 확인하자.
@IBInspectable > 인터페이스 빌더에 요소를 추가할수 있게끔 함.
*/

위 소스를 추가해 주면

  

인터페이스 빌더 쪽에 별표친 부분이 생겼다!

 저 부분에 값을넣어 빌드완료시 다음과 같은 화면이 나타나는것을 확인할수 있다!