UIKitPlus - View

안녕하세요. 그린입니다🟢

이번 포스팅에서는 UIKitPlus에서 View에 대해 학습해보겠습니다🧑🏻‍💻

 

View를 초기화하고 하위뷰를 다루고 설정하는등 뷰로 할 수 있는 부분에 대해 여러 예시를 제시합니다.

 

View

 - 기본적으로 빈 뷰를 생성하기 위해 아래와 같이 선언합니다.

UView()

 - 뷰를 선언하며 하위뷰를 생성합니다.

 UView {
    UView()
    UView()
}

 - inline 키워드로 하위뷰를 상위뷰의 가장자리에 맞출 수 있습니다.

UView(inline: MKMapView())

 - body 키워드를 여러번 사용하여 상위뷰에 하위뷰를 여러번 추가할 수 있습니다.

UView().body {
    UView()
    UVSpace(8)
    UView()
}.body {
    UView()
}.body {
    UView()
    UView()
    UView()
}

 

Vertification Code View

 - 뷰의 설정 조건들을 체이닝처럼 버티컬하게 나열하여 선언할 수 있습니다.

VerificationCodeField().digitWidth(64)
                       .digitsMargin(25)
                       .digitBorder(.bottom, 1, 0xC6CBD3)
                       .digitColor(0x171A1D)
                       .font(.sfProRegular, 32)
                       .entered(verify)

func verify(_ code: String) {
    print("entered code: " + code)
}

 

Visual Effect View

 - 다크/라이트 모드 등 뷰의 비주얼하게 보여주는 설정에 대해 조건을 줄 수 있습니다.

UVisualEffectView(.darkBlur)
UVisualEffectView(.lightBlur)
UVisualEffectView(.extraLightBlur)

// iOS10+
UVisualEffectView(.prominent)
UVisualEffectView(.regular)

// iOS13+ (but can be used since iOS9+)
// 자동으로 동적이게 다크/라이트모드 적용되게함
UVisualEffectView(.darkBlur, .lightBlur) // 자동으로 전환됨

 - 위와 같이 편리하게 설정을 사용하기 위해 아래와 같이 확장을 통해 정의 해줄 수 있습니다.

extension UIVisualEffect {
    public static var darkBlur: UIVisualEffect { return UIBlurEffect(style: .dark) }
}

 

Wrapper View

 - 하위뷰에 대해 간단하게 초기화를 할 수 있습니다.

UWrapperView {
    UView().background(.red).shadow()
}.background(.green).shadow()

 - 하위뷰의 패딩에 대해 선언 시 정의할 수 있습니다.

// 모든 부분 패딩
UWrapperView {
  UView()
}.padding(10)
// 부분에 대한 각각의 패딩
UWrapperView {
  UView()
}.padding(top: 10, left: 5, right: 10, bottom: 5)
// 필요한 부분에 대한 패딩
UWrapperView {
  UView()
}.padding(top: 10, right: 10)

 

[참고자료]

https://github.com/MihaelIsaev/UIKitPlus

MihaelIsaev/UIKitPlus