この記事では、SwiftUIでWebページを表示させる方法を紹介しています。
WebKit をインポートする方法となります。
◆動作検証環境
・ローカル環境：mac Catalina
・XCode：12.1
・XCode：12.1
スポンサードリンク
SwiftUIでWebページを表示するコード
WebViewTest.swift
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | import SwiftUI import WebKit //WebKitをインポート struct WebViewTest: UIViewRepresentable { var url: String = "https://google.com" //表示するWEBページのURLを指定 func makeUIView(context: Context) -> WKWebView{ return WKWebView() } func updateUIView(_ uiView: UIViewType, context: Context) { uiView.load(URLRequest(url: URL(string: url)!)) } } struct WebViewTest_Previews: PreviewProvider { static var previews: some View { WebViewTest() } } |
ContentView.swift
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | import SwiftUI struct ContentView: View { var body: some View { WebViewTest() } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() } } |
下記のように表示されます。
シートとして表示させる事も可能です。
その際は、ContentView.swiftを下記のように編集します。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | import SwiftUI struct ContentView: View { @State var isWebView:Bool = false var body: some View { Button(action:{ isWebView = true }){ Text("シートで表示") }.sheet(isPresented: $isWebView){ WebViewTest() } } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() } } |
シートで表示した際は下記のようになります。
以上、SwiftUIでWebページを表示させる方法を紹介しました。