0Pricing
Swift Academy · レッスン

UIHostingController:UIKit内のSwiftUI

UIHostingControllerを使い、SwiftUIのViewをUIKitアプリに埋め込みます。

「UIHostingController:UIKit内のSwiftUI」はCoddyKit上の無料Swift Academyレッスンです。 これはレッスン4/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはSwift Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Swift Academyコースには全4レッスンが含まれています。

UIHostingControllerとは

UIHostingControllerは、SwiftUIのビュー階層をホストするUIKitのビューコントローラです。

import SwiftUI
let swiftUIView = Text("Hello from SwiftUI")
let hostingVC = UIHostingController(rootView: swiftUIView)

UIViewControllerへの埋め込み

標準の子ビューコントローラAPIを使用して、ホスティングコントローラを子ビューコントローラとして追加します。

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

ホスティングコントローラでのAuto Layout

ホスティングコントローラのビューにAuto Layoutの制約を設定し、UIKitのレイアウトに組み込みます。

child.view.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
  child.view.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
  child.view.leadingAnchor.constraint(equalTo: view.leadingAnchor),
  child.view.trailingAnchor.constraint(equalTo: view.trailingAnchor),
  child.view.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])

ルートビューの更新

ホスティングコントローラのrootViewに値を設定して、ホストされているSwiftUIビューを更新します。

let hostingVC = UIHostingController(rootView: MyView(count: 0))
// Later:
hostingVC.rootView = MyView(count: 5)

モーダル表示

UIKitの通常のモーダルと同じようにホスティングコントローラを表示し、UIKitのプレゼンテーションでSwiftUIコンテンツを利用します。

let vc = UIHostingController(rootView: MySwiftUIView())
present(vc, animated: true)

ナビゲーションスタックへのプッシュ

ホスティングコントローラをUINavigationControllerにプッシュして、UIKitからSwiftUIコンテンツへ遷移します。

let vc = UIHostingController(rootView: DetailView())
navigationController?.pushViewController(vc, animated: true)

ObservableObjectによるデータ共有

共有するObservableObjectをSwiftUIビューの環境に渡し、双方向のデータフローを実現します。

let model = SharedModel()
let vc = UIHostingController(rootView: SwiftUIView().environmentObject(model))
// Changes to model in UIKit update SwiftUI and vice versa

ホスティングコントローラのサイズ設定

sizeThatFitsを使用してSwiftUIコンテンツの固有サイズを計算し、スクロールビューに組み込みます。

let size = hostingVC.sizeThatFits(in: CGSize(width: 320, height: UIView.layoutFittingCompressedSize.height))
hostingVC.view.frame.size = size

外観とスタイル

ホスティングコントローラのoverrideUserInterfaceStyleを設定し、ダークモードとライトモードを個別に制御します。

hostingVC.overrideUserInterfaceStyle = .dark

シーンベースのアプリ設定

UIKitを中心としたアプリでは、ルートビューコントローラをホスティングコントローラに置き換えて、段階的に移行できます。

func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options: UIScene.ConnectionOptions) {
  guard let windowScene = scene as? UIWindowScene else { return }
  let window = UIWindow(windowScene: windowScene)
  window.rootViewController = UIHostingController(rootView: ContentView())
  self.window = window
  window.makeKeyAndVisible()
}

ユースケース

UIHostingControllerは段階的な移行に適しています。UIKitのナビゲーションを維持しながら、新しいSwiftUIの機能画面を組み込めます。

// UIKit app gradually migrated:
// - Old screens: UIViewController
// - New screens: UIHostingController(rootView: NewFeatureView())

確認問題

SwiftUIのビューをUIKitのビューコントローラ階層に組み込むには、どのUIKitクラスを使用しますか?

レッスンのまとめ

UIHostingController(rootView:)はSwiftUIとUIKitを橋渡しします。Auto Layoutの制約を設定して子ビューコントローラとして追加するか、表示またはプッシュします。rootViewで更新し、ObservableObjectとenvironmentObjectでデータを共有します。

よくある質問

「UIHostingController:UIKit内のSwiftUI」レッスンは無料ですか?

はい。「UIHostingController:UIKit内のSwiftUI」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、Swift Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Swift Academyコースには全4レッスンが含まれています。

「UIHostingController:UIKit内のSwiftUI」で何を学びますか?

UIHostingControllerを使い、SwiftUIのViewをUIKitアプリに埋め込みます。 ブラウザで直接実行するハンズオンコードでSwift Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

Swift Academyを始めるのに経験は必要ですか?

事前経験は必要ありません。CoddyKitのSwift Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン4/4です。

「UIHostingController:UIKit内のSwiftUI」レッスンにはどのくらい時間がかかりますか?

ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このSwift Academyレッスンでコードを書いて実行できますか?

はい。すべてのSwift Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. UIViewRepresentable:UIKit Viewのラップ
  2. デリゲート通信のためのCoordinatorパターン
  3. UIViewControllerRepresentable
  4. UIHostingController:UIKit内のSwiftUI
← Swift Academyに戻る