언제나 보고 있을 뿐이므로 처음 게시합니다.

1, 처음

iOS 앱을 Swift로 개발을 시작하여 꾸준히 만들어 온 가운데,
웹에 가까운 UI 디자인을 만들어야했습니다.

밑줄·언더 바입니다.

처음에는
UIView・・・언더바용(언더바의 색을 지정)
└UIView・・・마진용(bottom에 1px의 마진을 넣습니다)
└UILabel···(UIView를 한 장 넣을 수 있는 것은, 언더 바와의 위치 조정을 위해)
로 UIView에서 여백을 만들고 backgroundColor 지정하여 만들었습니다.
Storyboard의 외형을 볼 수는 있지만 복잡해지기 때문에 다른 방법을 생각했습니다.

2, 했던 일

우선 조사했지만, 좀처럼 이미지에 맞는 것이 없고,
자기 앞에서 만들어 보기로 했습니다.

3, 무엇을 만들었는가

Storyboard에서는 확인할 수 없지만 사용자 정의 UIView를 만들었습니다.
스토리 보드에서 맞춤 클래스를 지정하고,
User Defined Runtime Attributes에서 색상을 지정할 수 있습니다.

4, 어떤 커스텀 클래스

class BottomBorderView : UIView {

    var borderLayer: CALayer!

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

        self.borderLayer    = CALayer()
        self.layer.addSublayer(self.borderLayer)
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        self.borderLayer.frame  = CGRectMake(0, self.frame.height - 1, self.frame.width, 1)
    }

    var borderColor: UIColor? {
        get {
            return UIColor(CGColor: self.borderLayer.backgroundColor!)
        }
        set {
            if let val = newValue {
                self.borderLayer.backgroundColor    = val.CGColor
            }
        }
    }
}

layoutSubviews에서 조정하는 것은
그 외의 타이밍에서는 AutoLayout이 반영되어 있지 않은 상태가 되어 버리기 때문입니다.

5, 사용법

이런 느낌으로 사용할 수 있습니다.
Storyboard에서는 볼 수 없지만 런타임에 언더바가 표시됩니다.

6, 마지막으로

이 구현 방법이 좋은지 전혀 모릅니다.
그래서 츳코미 부탁드립니다. 공부를 위해서도.

그리고, 지금은 색 지정만이므로, 높이 지정도 할 수 있도록 해 보고 싶습니다.