I am having a problem where a spacing appears after the content of my WKWebView (picture included at the very bottom). I am displaying a grouping of several live streams from Facebook, but this issue keeps showing up. I have not found any solutions on Stackoverflow or other websites. My webviews are being scaled to fit in the main view as well. This is all being done in SwiftUI also and I tried adding an offset but then this added a long empty space at the bottom of the view, as expected. I appreciate any possible help because I am not exactly sure the cause of this, and I am not sure if this is a Facebook issue or something I am doing. Thank you.
Here is the code in my main body view that displays the web views:
ScrollView {
HStack {
Text("Most Recent Livestream")
.font(.title)
.padding([.top, .leading])
Spacer()
}
VStack {
if (self.fb.showWebViews != false) {
fb.getwebView(index: 0).scaledToFit()
}
}
VStack {
if (self.fb.showWebViews != false) {
Text("\(fb.getVideoDate(index: 1))")
fb.getwebView(index: 1).scaledToFit()
}
}
VStack {
if (self.fb.showWebViews != false) {
Text("\(fb.getVideoDate(index: 2))")
fb.getwebView(index: 2).scaledToFit()
}
}
VStack {
if (self.fb.showWebViews != false) {
Text("\(fb.getVideoDate(index: 3))")
fb.getwebView(index: 3).scaledToFit()
}
}
VStack {
if (self.fb.showWebViews != false) {
Text("\(fb.getVideoDate(index: 4))")
fb.getwebView(index: 4).scaledToFit()
}
}
Button(action: {
print("LEARN MORE!")
}) {
Image(systemName: "questionmark.circle")
Text("Want to view more livestreams?")
.foregroundColor(Color(.label))
}.padding([.top, .leading])
Spacer()
}
Here is the webview code:
struct WebView2 : UIViewRepresentable {
// Instence Var of request URL
var request: URLRequest
// Creates the UIView of the WebView
func makeUIView(context: Context) -> WKWebView {
return WKWebView()
}
// Updates the Webview
/// With disable scrolling, backround becomes opaue, and reloads page with the quested URL
func updateUIView(_ uiView: WKWebView, context: Context) {
uiView.scrollView.isScrollEnabled = false
uiView.isOpaque = false
uiView.load(request)
}
}
It turned out that in order to fix this problem all I had to do was remove the .scaledToFit()
on each WebView in the VStacks. Then after removing those, I then had to put .frame(height: 233)
on each WebView in the VStacks in order to make then all display completly, since they always will be 233 in height.