How to easily embed a Store Locator in an Apple iOS app using Swift?

Ask the community
1

I wanted to show how easy it is to use the Store Locator Widget, or any other webpage, from within a Swift app. It’s only a few lines of code to get the SLW up and running on iOS.

In the example below the app is loading the Bose Store Locator Widget from the documentation.

import SwiftUI
import WebKit

struct WebView: UIViewRepresentable{
    let url: URL?
    private let webView = WKWebView()
    
    func makeUIView(context: Context) -> some UIView {
        return webView
    }
    
    func updateUIView(_ uiView: UIViewType, context: Context) {
        guard let url = url else {
            return
        }
        webView.load(.init(url: url))
    }
}

struct ContentView: View {
    var body: some View {
        
        //Bose
        WebView(url: URL(string: "https://3icrvl.csb.app/"))
               
    }
}

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

Screenshot 2023-01-06 at 14.37.51
Screenshot 2023-01-06 at 14.37.51336×670 118 KB

1 Like
2

To get the SLW to fit properly within the iPhone I had to modify the meta tag in the html, thanks @gael

<meta
      name="viewport"
      content="width=device-width, 
      initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
/>
1 Like