SwiftUI UIViewRepresentable Not Scaling

Viewed 158

I have created a WKWebView as a UIViewRepresentable in a SwiftUI app with SwiftUI life cycle. It works for content. However, when I start the app in iPad landscape and rotate to portrait the right side of the view is truncated. I have attempted to scale the webview based on other code which (correctly) detects portrait or landscape but this does not work. Strangely, if I start with iPad portrait, the view is complete in both orientations with no scale modification.

I looked at SO 61832221 and https://developer.apple.com/forums/thread/130878 among others but none of the concepts worked for me.

Here is the webview:

struct MyWebView: UIViewRepresentable {
    typealias UIViewType = WKWebView
    let url: URL?

    func makeUIView(context: Context) -> WKWebView {
        let prefs = WKWebpagePreferences()
        prefs.allowsContentJavaScript = true
        let config = WKWebViewConfiguration()
        config.defaultWebpagePreferences = prefs

        return WKWebView(frame: .zero, configuration: config)
    }

    func updateUIView(_ uiView: WKWebView, context: Context) {
        guard let myURL = url else { return }
        let request = URLRequest(url: myURL)
        uiView.load(request)
    }
}//struct

And the implementation:

struct USNetGenerationByMonthView: View, SizeClassAdjustable {

    @Environment(\.verticalSizeClass) var _verticalSizeClass
    @Environment(\.horizontalSizeClass) var _horizontalSizeClass
    var verticalSizeClass: UserInterfaceSizeClass? { _verticalSizeClass }
    var horizontalSizeClass: UserInterfaceSizeClass? { _horizontalSizeClass }

    var body: some View {
        NavigationView {
            GeometryReader { geo in
                VStack {
                    MyWebView(url: URL(string: "https://www.catalpa.com/usnetgeneration"))
                        .navigationTitle("US Net Generation by Month")
                        //.scaleEffect(isPadPortrait ? 0.8 : 1.0)
                    Text("Tap a series for detail")
                        .padding(.bottom, 50)
                
                    //for testing - hide this
                    HStack {
                        Text(isPadPortrait ? "Portrait" : "Landscape")
                        Text("Width is \(geo.size.width)")
                    }//.hidden()
                }
            }
        }.navigationViewStyle(StackNavigationViewStyle())
    }//body
}//struct

For reference, this is the logic for determining orientation.

protocol SizeClassAdjustable {
    var verticalSizeClass: UserInterfaceSizeClass? { get }
    var horizontalSizeClass: UserInterfaceSizeClass? { get }
}

extension SizeClassAdjustable {
    var isPad: Bool {
        return horizontalSizeClass == .regular && verticalSizeClass == .regular
    }
    var isPadLandscape: Bool {
        isPad && (UIScreen.main.bounds.height < UIScreen.main.bounds.width)
    }
    var isPadPortrait: Bool {
        isPad && (UIScreen.main.bounds.height > UIScreen.main.bounds.width)
    }
    var isPadOrLandscapeMax: Bool {
        horizontalSizeClass == .regular
    }
    var isLandscapeMax: Bool {
        horizontalSizeClass == .regular && verticalSizeClass == .compact
    }
    var isLandscape: Bool {
        verticalSizeClass == .compact
    }
    var isPortrait: Bool {
        verticalSizeClass == .regular && horizontalSizeClass == .compact
    }
}//extension

Any guidance would be appreciated. Xcode 12.5, iOS 14.5

0 Answers
Related