나의 플랫폼/iOS

[iOS] @IBDesignable, @IBInspectable 활용

GsBOB 2017. 9. 8. 10:38

블로그 내용과 소스는 '꼼꼼한 재은 씨의 스위프트 실전편' 에 나오는 예제 입니다.



CustomView를 만들고, 그 View를 StoryBoard에 올리면 디자인 그대로 보이지 않는다.


만약, StoryBoard에서 CustomView 형태 그대로 보고 싶다면


@IBDesignable, @IBInspectable 어노테이션을 이용하면 된다.



## @IBDesignable


@IBDesignable

public class CSStepper: UIView {

    public var leftBtn = UIButton(type: .system)

    public var rightBtn = UIButton(type: .system)

    public var centerLabel = UILabel()


위 소스를 보시면 UIView를 상속 받아 CSStepper라는 CustomView를 만들었다.

그리고 Class에 @IBDesignable Annotation을 추가하면 

StoryBoard에 디자인이 표시 됩니다.



## IBInspectable


    @IBInspectable

    public var value: Int = 0 {

        didSet{

            self.centerLabel.text = String(value)

        }

    }

    @IBInspectable

    public var leftTitle: String = "⬇︎" {

        didSet {

            self.leftBtn.setTitle(leftTitle, for: .normal)

        }

    }

    @IBInspectable

    public var rightTitle: String = "⬆︎" {

        didSet {

            self.rightBtn.setTitle(rightTitle, for: .normal)

        }

    }

    @IBInspectable

    public var bgColor: UIColor = UIColor.cyan {

        didSet {

            self.centerLabel.backgroundColor = bgColor

        }

    }

    @IBInspectable

    public var stepValue: Int = 10


CustomView  전역 변수에 @IBInsepectable 이라는 Annotation을 붙이면 

StoryBoard에 속성으로 출력 되어 할당이 가능 하게 됩니다.




이렇게 하면 CustomView를 StoryBoard에서 언제든지 할당 해서 확인하고 속성 변경이 가능 하게 되죠.

참고하세요.