Last active
June 17, 2024 17:44
-
-
Save pkuecuekyan/f70096218a6b969e0249427a7d324f91 to your computer and use it in GitHub Desktop.
Adjust height of WKWebView frame based on scrollHeight of the webView's content
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Since the WKWebView has no sizeToFit() method, increase the frame height of the webView to | |
// match the height of the content's scrollHeight | |
// | |
// The WKWebView's `navigationDelegate` property needs to be set for the delegate method to be called | |
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) { | |
if webView.isLoading == false { | |
webView.evaluateJavaScript("document.body.scrollHeight", completionHandler: { [weak self] (result, error) in | |
if let height = result as? CGFloat { | |
webView.frame.size.height += height | |
} | |
}) | |
} | |
} |
The problem for me was the document.body.width, even if meta tag still very small...
So I fix running a script before:
document.body.style.width = '{width}px'
when width it's the current resolution of my device screen...
after than, when I call the "document.body.scrollHeight" works like a charm...
I use Xamarin by the way...
public override async void DidFinishNavigation(WKWebView webView, WKNavigation navigation) {
if (renderer?.Element is WebListItemView view)
{
webView.EvaluateJavaScript("document.readyState", async (completed, error) =>
{
if (completed is null) return;
await webView.EvaluateJavaScriptAsync($"document.body.style.width = '{view.Width}px'");
var offsetHeight = await webView.EvaluateJavaScriptAsync("document.body.scrollHeight");
if (offsetHeight is Foundation.NSNumber height)
{
view.HeightRequest = height.DoubleValue;
if (view.Parent is ViewCell cell) cell.ForceUpdateSize();
}
});
}
}
I'm getting too small content with view port.
Thanks a lot. This works like a charm.
The problem for me was the document.body.width, even if meta tag still very small...
So I fix running a script before:
document.body.style.width = '{width}px'
Thanx! It's work for me. Your answer save me :)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
thanks! 👯