2021/5/18
「SwiftUIでUIKitを使いたい」
「SwiftUIでUIKitを使う時には、どうしたらいいの?」
と言う人に向けてこの記事は書かれています。
どうも、ちょげ(@chogetarou)です。
基本的には、SwiftUIのみでiOSアプリを作ることが出来ます。
ですが、どうしてもUIKitを使わなきゃいけない場面が出てきます。
そこで、この記事では、SwiftUIでUIKitを使う方法について解説します。
流れ
ビューを表示するまでの大まかな流れは以下のようになっています。
- SwiftUIとUIkitのインポート
- UIViewRepresentableプロトコルに準拠したクラスを作成
- UIKitのビューを作成
- 更新を受け取るメソッドを定義
SwiftUIとUIKitのインポート
まずは、SwiftUIとUIKitをインポートします。
import SwiftUI
import UIKit
UIViewRepresentableプロトコルに準拠したクラスを作成
次に、UIViewRepresentableプロトコルに準拠したクラスを作成します。
UIViewRepresentableプロトコルは、SwiftUIでUIKitを使用するためのクラスです。
このプロトコルがなければ、UIKitのビューをSwiftUIで表示することが出来ません。
struct kitkat : UIViewRepresentable {
}
UIKitのビューを作成

ここまで出来たら、実際のビューを作っていきます。
UIKitのビューをSwiftUIで作成するには、makeUIViewメソッドを実装しなければいけません。
func makeUIView(context: Context) -> UIView {
//処理
//表示したいビューをリターンする
return UIView
}
処理には、ビューの定義や設定などを行います。
そして、作ったビューを戻り値として返すことによって、ビューの完成です。
更新を受け取るメソッドを定義
実は、UIViewRepresentableプロトコルは、2つのメソッドを定義しなければいけません。
1つは、先程のmakeUIViewメソッド。
もう1つは、updateUIViewメソッドです。
このメソッドは、プロパティが更新された時に呼び出されるメソッドです。
func updateUIView(_ uiView: UIView, context: Context) {
}
メソッド内は何も記述しなくても大丈夫です。
メソッド内には、プロパティが更新される度に行いたい処理を記述します。
まとめ
ここまでのコードを表示します。
import SwiftUI
import UIKit
struct kitkat : UIViewRepresentable {
func makeUIView(context: Context) -> UIView {
//処理
//表示したいビューをリターンする
return UIView
}
func updateUIView(_ uiView: UIView, context: Context) {
}
}
ポイントをまとめます。
- UIViewRepresentableプロトコルに準拠させる
- makeUIViewメソッドで、UIKitのビューを作る
- updateUIViewで、プロパティを監視する
ここまででUIKitのビューを表示することが出来ます。
次の記事
次は、コーディネータについて解説します。
コメント