[SwiftUI] SwiftUI에서 UIKit View 사용하기

먼저 UIViewPresentable을 생성합니다.

UIViewPresentable 프로토콜은 UIKit 뷰를 나타내는 SwiftUI 뷰입니다.

protocol UIViewPresentable: View where Self.Body == Never

 

위에서 볼 수 있듯이, UIViewPresentable은 View 프로토콜을 준수하기 때문에 SwiftUI에서 뷰로 사용할 수 있습니다.

UIViewPresentable은 UIKit 뷰와 SwiftUI 사이의 브릿지 역할을 하는데, 몇 가지 단계를 수행해야 합니다.

UIViewPresentable을 채택하는 RepresentedMyView를 생성합니다.

import SwiftUI

struct RepresentedMyView: UIViewPresentable {

}

프로토콜은 RepresentedMyView가 어떤 종류의 UIView를 나타낼지 알아야 하는데, typealias UIViewType를 명시적으로 정의함으로써 제공합니다. 이 경우, RepresentedMyView가 MyView를 나타내기를 원합니다.

import SwiftUI

struct RepresentedMyView: UIViewPresentable {
	typealias UIViewType = MyView // MyView는 UIView!
}

 

프로토콜에 어떤 타입의 뷰를 제공할지 알려준 후에는 SwiftUI를 위한 뷰를 준비해야합니다.

2가지 필수 메서드가 필요합니다.

1. makeUIView
2. updateUIView

struct RepresentedMyView: UIViewRepresentable {
    typealias UIViewType = MyView
  
    func makeUIView(context: Context) -> MyView {
        // Return MyView instance.
    }
    
    func updateUIView(_ uiView: MyView, context: Context) {
        // Updates the state of the specified view with new information from SwiftUI.
    }
}

makeUIView 구현하기

makeUIView 메서드는 typealias UIViewType = MyView에 지정한 것처럼 MyView 인스턴스를 반환할 것으로 예상합니다.

여기서

1. 뷰 인스턴스를 생성할 수 있고,
2. 최초 상태를 구성합니다.

현재 뷰는 매우 간단하기 때문에, makeUIView에서 생성하고 바로 리턴할 수 있습니다.

struct RepresentedMyView: UIViewRepresentable {
    typealias UIViewType = MyView
  
    func makeUIView(context: Context) -> MyView {
        let view = MyView()

        // Do some configurations here if needed.
        return view
    }
    
    func updateUIView(_ uiView: MyView, context: Context) {
        // Updates the state of the specified view controller with new information from SwiftUI.
    }
}

updateUIView 구현하기

updateUIView는 SwiftUI에서 업데이트가 있을 때마다 호출되고, 이 메서드 내에서 뷰를 업데이트할 수 있습니다.

다시 말하지만, 지금 우리의 뷰는 간단하기 때문에 이 메서드가 필요하지 않아서 비워두도록 하겠습니다.

사실, Swift는 makeUIView 메서드와 updateUIView 메서드를 통해서 UIView 타입을 추론할 수 있습니다.

그래서 기술적으로 UIViewType = MyView라는 typealias를 지정할 필요가 없습니다.

사실 이 두 메서드를 수동으로 입력하지 않고, UIViewType = MyView라는 typealias를 선언하고 Xcode가 자동으로 두 메서드를 생성하도록 하는 것이 더 쉽습니다.

UIViewPresentable 사용하기

UIKit 뷰를 나타낼 수 있는 새 뷰를 생성하면, 일반적인 SwiftUI 뷰처럼 사용할 수 있습니다.

이 예제에서는 시트의 콘텐츠로 RepresentedMyView를 사용합니다.

struct ContentView: View {
    @State var isPresented = false
    
    var body: some View {
        Button("MyView") {
            isPresented = true
        }
        .sheet(isPresented: $isPresented) {
            RepresentedMyView()

        }
    }
}

SwiftUI에서 UIView를 사용하는 프로세스는 UIViewController를 SwiftUI와 통합하는 방법과 거의 동일합니다. 유일한 차이점은 UIViewControllerRepresentable 대신 UIViewRepresentable로 뷰를 준수한다는 점입니다.