UIViewControllerRepresentable in SwiftUI

Updated:

UIViewControllerRepresentable in SwiftUI

UIViewRepresentable used to take a view in UIKit convert it into SwiftUI. The only difference between UIViewRepresentable and UIViewControllerRepresentable to control entire controller. Controller essentially a screen and UIKit instead of just a sub view

struct UIViewControllerRepresentableBootCamp: View {
// MARK: -  PROPERTY
@State private var showScreen: Bool = false
// MARK: -  BODY
var body: some View {
VStack {
  Text("Hi")

  Button {
    showScreen.toggle()
  } label: {
    Text("Click Here")
  }
  .sheet(isPresented: $showScreen) {
    BasicUIViewControllerRepresentalbe(lableText: "New Screen!!")
  }
}
}
}

// MARK: -  PREVIEW
struct UIViewControllerRepresentableBootCamp_Previews: PreviewProvider {
static var previews: some View {
  UIViewControllerRepresentableBootCamp()
}
}

// MARK: -  UIViewControllerRepresentable
struct BasicUIViewControllerRepresentalbe: UIViewControllerRepresentable {

let lableText: String

func makeUIViewController(context: Context) -> some UIViewController {
  let vc = MyFirstViewController()
  vc.lableText = lableText
  return vc
}

func updateUIViewController(_ uiViewController: UIViewControllerType, context: Context) {

}
}

class MyFirstViewController: UIViewController {

var lableText: String = "Starting value"
override func viewDidLoad() {
  super.viewDidLoad()

  view.backgroundColor = .blue

  let label = UILabel()
  label.text = lableText
  label.textColor = UIColor.white

  view.addSubview(label)
  label.frame = view.frame
}
}

스크린샷

Example of UIImagePickerController move to SwiftUI

struct UIViewControllerRepresentableBootCamp: View {
// MARK: -  PROPERTY
@State private var showScreen: Bool = false
@State private var image: UIImage? = nil
// MARK: -  BODY
var body: some View {
VStack {
Text("Hi")

if let image = image {
  Image(uiImage: image)
    .resizable()
    .scaledToFit()
    .frame(width: 200, height: 200)
}

Button {
  showScreen.toggle()
} label: {
  Text("Click Here")
}
.sheet(isPresented: $showScreen) {
  UIImagePickerControllerRepresentable(image: $image, showScreen: $showScreen)
}
}
}
}

// MARK: -  PREVIEW
struct UIViewControllerRepresentableBootCamp_Previews: PreviewProvider {
static var previews: some View {
  UIViewControllerRepresentableBootCamp()
}
}

struct UIImagePickerControllerRepresentable: UIViewControllerRepresentable {
@Binding var image: UIImage?
@Binding var showScreen: Bool

func makeUIViewController(context: Context) -> UIImagePickerController {
  let vc = UIImagePickerController()
  vc.allowsEditing = false
  vc.delegate = context.coordinator
  return vc
}

// from SwiftUI to UIKit
func updateUIViewController(_ uiViewController: UIImagePickerController, context: Context) {

}

// from UIKit to SwiftUI
func makeCoordinator() -> Coordinator {
return Coordinator(image: $image, showScreen: $showScreen)
}

class Coordinator: NSObject, UIImagePickerControllerDelegate, UINavigationControllerDelegate {
@Binding var image: UIImage?
@Binding var showScreen: Bool

init(image: Binding<UIImage?>, showScreen: Binding<Bool>) {
  self._image = image
  self._showScreen = showScreen
}
func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any]) {
  guard let newImage = info[.originalImage] as? UIImage else { return }
  image = newImage
  showScreen = false
}
}
}

스크린샷


🗃 Reference

SwiftUI Thinking - https://youtu.be/wqa1hCu8yCI

Categories:

Updated:

Leave a comment