본문 바로가기
Category/iOS

UIKit와 SwiftUI 사용법

by Corinee 2024. 9. 20.
728x90
반응형

UIKit과 SwiftUI는 iOS 앱 개발에서 자주 사용되는 두 가지 UI 프레임워크입니다. 각각의 사용법은 다소 차이가 있으며, 두 프레임워크를 함께 사용하는 방법도 있습니다. 아래에서 UIKit과 SwiftUI의 기본적인 차이점과 함께, 이 둘을 혼합하여 사용하는 방법을 소개하겠습니다.

UIKit의 기본 사용법

UIKit은 오랫동안 iOS 앱 개발에서 사용된 전통적인 프레임워크로, UIViewController, UIView, UITableView 등의 클래스를 사용하여 사용자 인터페이스를 구성합니다.

예시 코드: UIKit에서 버튼 생성

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        
        let button = UIButton(type: .system)
        button.setTitle("Tap me", for: .normal)
        button.frame = CGRect(x: 100, y: 100, width: 200, height: 50)
        button.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
        
        view.addSubview(button)
    }

    @objc func buttonTapped() {
        print("Button was tapped")
    }
}

SwiftUI의 기본 사용법

SwiftUI는 선언형(Declarative) 방식으로 UI를 구성하는 최신 프레임워크입니다. 상태에 기반하여 UI가 자동으로 업데이트되는 방식으로 동작하며, 보다 간결한 코드로 인터페이스를 구성할 수 있습니다.

예시 코드: SwiftUI에서 버튼 생성

import SwiftUI

struct ContentView: View {
    var body: some View {
        Button(action: {
            print("Button was tapped")
        }) {
            Text("Tap me")
                .padding()
                .background(Color.blue)
                .foregroundColor(.white)
                .cornerRadius(10)
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

UIKit과 SwiftUI 혼합 사용법

SwiftUI와 UIKit은 함께 사용할 수 있습니다. SwiftUI 뷰를 UIKit에 임베드하거나, 반대로 UIKit 뷰를 SwiftUI에 삽입하는 방식으로 혼합할 수 있습니다.

1. UIKit에서 SwiftUI 사용

UIKit 기반 앱에서 SwiftUI 뷰를 사용하려면 UIHostingController를 사용합니다. UIHostingController는 SwiftUI 뷰를 UIKit에서 렌더링하는 컨트롤러입니다.

import UIKit
import SwiftUI

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        
        let swiftUIView = UIHostingController(rootView: ContentView())
        addChild(swiftUIView)
        swiftUIView.view.frame = view.bounds
        view.addSubview(swiftUIView.view)
        swiftUIView.didMove(toParent: self)
    }
}

2. SwiftUI에서 UIKit 사용

SwiftUI에서는 UIViewControllerRepresentable과 UIViewRepresentable 프로토콜을 사용하여 UIKit의 뷰 또는 뷰 컨트롤러를 SwiftUI에서 사용할 수 있습니다.

import SwiftUI
import UIKit

struct UIKitButtonView: UIViewRepresentable {
    
    func makeUIView(context: Context) -> UIButton {
        let button = UIButton(type: .system)
        button.setTitle("Tap me", for: .normal)
        return button
    }

    func updateUIView(_ uiView: UIButton, context: Context) {
        // SwiftUI 상태가 변할 때 UI 업데이트 처리
    }
}

struct ContentView: View {
    var body: some View {
        UIKitButtonView()
    }
}

결론

UIKit과 SwiftUI는 각각의 강점을 가지고 있으며, 최신 iOS 개발에서는 SwiftUI를 주로 사용하지만, UIKit과의 상호 운용성 덕분에 두 프레임워크를 함께 사용할 수 있습니다. 개발 중에 상황에 맞게 적절한 프레임워크를 선택하거나 혼합하는 방법을 고려하는 것이 좋습니다.