[ios] Storyboard를 사용하여 UIView를 마스킹하고 둥근 모서리를 제공 하시겠습니까?

이와 같은 많은 질문 은 프로그래밍 방식으로 마스크를 만들고 UIView에 둥근 모서리를 제공하는 방법을 설명합니다.

Storyboard에서 모든 작업을 수행 할 수있는 방법이 있습니까? 스토리 보드에서 둥근 모서리를 만드는 것처럼 보이기 때문에 묻는 것만으로 프레젠테이션과 논리 사이의 명확한 경계를 유지할 수 있습니다.

답변

네, 많이 사용하지만 이와 같은 질문은 이미 여러 번 답변되었습니다.

그러나 어쨌든 Interface Builder에서. 다음과 같은 사용자 정의 런타임 속성을 추가해야합니다.

layer.masksToBounds Boolean YES
layer.cornerRadius Number {View's Width/2}

및 활성화

Clips subviews

결과 :

답변

사용자 정의 속성을 사용하여 스토리 보드에서 수행 할 수 있습니다. 반올림 할보기를 선택하고 해당 ID 검사기를 엽니 다. 에서 런타임 정의 사용자 속성 섹션, 다음 두 가지 항목을 추가 :

키 경로 : layer.cornerRadius, 유형 : 숫자, 값 : (원하는 반경)
키 경로 : layer.masksToBounds, 유형 : 부울, 값 : 선택됨

QuartzKit뷰의 해당 클래스 파일 (있는 경우) 을 가져와야 할 수도 있지만 그렇게하지 않고 작동하도록했습니다. 결과는 다를 수 있습니다.

편집 : 동적 반경의 예

extension UIView {

    /// The ratio (from 0.0 to 1.0, inclusive) of the view's corner radius
    /// to its width. For example, a 50% radius would be specified with
    /// `cornerRadiusRatio = 0.5`.
    @IBDesignable public var cornerRadiusRatio: CGFloat {
        get {
            return layer.cornerRadius / frame.width
        }

        set {
            // Make sure that it's between 0.0 and 1.0. If not, restrict it
            // to that range.
            let normalizedRatio = max(0.0, min(1.0, newValue))
            layer.cornerRadius = frame.width * normalizedRatio
        }
    }

}

나는 이것이 놀이터에서 작동하는지 확인했습니다.

답변

보기 선택

extension UIView {

    @IBInspectable var cornerRadiusV: CGFloat {
        get {
            return layer.cornerRadius
        }
        set {
            layer.cornerRadius = newValue
            layer.masksToBounds = newValue > 0
        }
    }

    @IBInspectable var borderWidthV: CGFloat {
        get {
            return layer.borderWidth
        }
        set {
            layer.borderWidth = newValue
        }
    }

    @IBInspectable var borderColorV: UIColor? {
        get {
            return UIColor(cgColor: layer.borderColor!)
        }
        set {
            layer.borderColor = newValue?.cgColor
        }
    }
}

답변

스토리 보드를 모두 변경 한 후에도 Woraphot의 답변 이 작동하지 않습니다.

이것은 나를 위해 일했습니다.

layer.cornerRadius = 10
layer.borderWidth = 1
layer.borderColor = UIColor.blue.cgColor

긴 대답 :

UIView / UIButton 등의 둥근 모서리

customUIView.layer.cornerRadius = 10

테두리 두께

pcustomUIView.layer.borderWidth = 1

테두리 색상

customUIView.layer.borderColor = UIColor.blue.cgColor