.NET MAUI: Высота веб -просмотра не настраивается динамически в пользовательском WebView на платформе iOS ⇐ IOS

[Anonymous]

Я использую пользовательский WebView в моем приложении .NET MAUI для отображения динамического HTML -контента на платформе iOS. Контент HTML меняется ежедневно, и мне нужно соответствующим образом настроить высоту веб -просмотра. Реализация: < /p>
public class DailySaintWebViewRenderer : ViewRenderer
{
WKWebView _wkWebView;

protected override void OnElementChanged(ElementChangedEventArgs e)
{
base.OnElementChanged(e);

if (Control == null)
{
var config = new WKWebViewConfiguration();
config.AllowsInlineMediaPlayback = true;
_wkWebView = new WKWebView(Frame, config);
//transparent background
_wkWebView = new WKWebView(CGRect.Empty, config);
_wkWebView.BackgroundColor = UIColor.Clear;
_wkWebView.ScrollView.BackgroundColor = UIColor.Clear;
_wkWebView.Opaque = false;
_wkWebView.NavigationDelegate = new MyNavigationDelegate();
_wkWebView.ScrollView.ScrollEnabled = false;
SetNativeControl(_wkWebView);

if (Device.Idiom == TargetIdiom.Tablet)
{
//when targeting on iPad, add this to force the iPad behavior
_wkWebView.Configuration.DefaultWebpagePreferences.PreferredContentMode = WKContentMode.Mobile;
}
SetNativeControl(_wkWebView);
}
}

public class MyNavigationDelegate : WKNavigationDelegate
{
public override void DidFinishNavigation(WKWebView webView, WKNavigation navigation)
{
string fontSize = Device.Idiom == TargetIdiom.Phone ? "500%" : "320%";

string injectCustomFontScript = @"
let style = document.createElement('style');
style.innerHTML = `
@font-face {
font-family: 'CustomFont';
src: url('Poppins-Light') format('truetype');
}
body, p, h1, h2, h3, h4, h5, h6 {
font-family: 'CustomFont', sans-serif !important;
color: white !important;
}
`;
document.head.appendChild(style);
";

string adjustTextSizeScript = $"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '{fontSize}';";

WKJavascriptEvaluationResult handler = (NSObject result, NSError err) =>
{
if (err != null)
{
System.Console.WriteLine(err);
}
if (result != null)
{
System.Console.WriteLine(result);
}
};

webView.EvaluateJavaScript(adjustTextSizeScript, handler);
webView.EvaluateJavaScript(injectCustomFontScript, handler);
}

}

protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
{
base.OnElementPropertyChanged(sender, e);

if (e.PropertyName == "Url")
{
string finalHtml = Element.Url.Replace("width=\"640\"", "width=\"1000\"");
Control.LoadHtmlString(finalHtml, null);
}
}
}
< /code>
xaml Code: Полный макет: < /p>







0,-10,0,0
0
0,-10,0,0




























//Header layout


















//Title content



















28
44
28





















20
30
20











3000
4500
3000


















//Audio frame layout


380
960
380




60
90
60



















//Footer Layout


60
90
60





< /code>
Я попытался установить высоту веб -просмотра динамически на основе контента HTML в моем приложении .NET Maui. Ниже приведен пользовательский рендеринг, который я реализовал для iOS с использованием Wkwebview. Однако высота не регулируется правильно. Не могли бы вы просмотреть мой подход и предложить какие -либо улучшения?public class DailySaintWebViewRenderer : ViewRenderer
{
WKWebView _wkWebView;

protected override void OnElementChanged(ElementChangedEventArgs e)
{
base.OnElementChanged(e);

if (Control == null)
{
var config = new WKWebViewConfiguration();
config.AllowsInlineMediaPlayback = true;
_wkWebView = new WKWebView(Frame, config);
//transparent background
_wkWebView = new WKWebView(CGRect.Empty, config);
_wkWebView.BackgroundColor = UIColor.Clear;
_wkWebView.ScrollView.BackgroundColor = UIColor.Clear;
_wkWebView.Opaque = false;
_wkWebView.NavigationDelegate = new MyNavigationDelegate(this);
_wkWebView.ScrollView.ScrollEnabled = false;
SetNativeControl(_wkWebView);

if (Device.Idiom == TargetIdiom.Tablet)
{
//when targeting on iPad, add this to force the iPad behavior
_wkWebView.Configuration.DefaultWebpagePreferences.PreferredContentMode = WKContentMode.Mobile;
}
SetNativeControl(_wkWebView);
}
}

public class MyNavigationDelegate : WKNavigationDelegate
{
DailySaintWebViewRenderer dailysaintWebViewRenderer;

// Constructor to receive reference of MyWebViewRenderer
public MyNavigationDelegate(DailySaintWebViewRenderer webViewRenderer)
{
dailysaintWebViewRenderer = webViewRenderer;
}
public async override void DidFinishNavigation(WKWebView webView, WKNavigation navigation)
{
string fontSize = Device.Idiom == TargetIdiom.Phone ? "500%" : "320%";

string injectCustomFontScript = @"
let style = document.createElement('style');
style.innerHTML = `
@font-face {
font-family: 'CustomFont';
src: url('Poppins-Light') format('truetype');
}
body, p, h1, h2, h3, h4, h5, h6 {
font-family: 'CustomFont', sans-serif !important;
color: white !important;
}
`;
document.head.appendChild(style);
";

string adjustTextSizeScript = $"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '{fontSize}';";

WKJavascriptEvaluationResult handler = (NSObject result, NSError err) =>
{
if (err != null)
{
System.Console.WriteLine(err);
}
if (result != null)
{
System.Console.WriteLine(result);
}
};

webView.EvaluateJavaScript(adjustTextSizeScript, handler);
webView.EvaluateJavaScript(injectCustomFontScript, handler);

// Dynamically adjust WebView height
var wv = dailysaintWebViewRenderer.Element as DailySaintWebView;
if (webView != null && webView.ScrollView != null && webView.ScrollView.ContentSize != null)
{
await Task.Delay(200); // Wait for rendering to complete
wv.HeightRequest = (double)webView.ScrollView.ContentSize.Height;
}
}

}

protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
{
base.OnElementPropertyChanged(sender, e);

if (e.PropertyName == "Url")
{
string finalHtml = Element.Url.Replace("width=\"640\"", "width=\"1000\"");
Control.LoadHtmlString(finalHtml, null);
}
}
}
< /code>
xaml реализация (без Heightrequest) < /p>


< /code>
Я хочу, чтобы высота веб -просмотра автоматически регулировалась на основе высоты контента HTML вместо установки фиксированного Heightrequest. Поскольку контент меняется ежедневно, я не могу жесткой кодировки определенной высоты.


Подробнее здесь: https://stackoverflow.com/questions/794 ... on-ios-pla