Xamarin IOS image load problem in WebView-CodePudding

I have a simple WebView in Xamarin. I use VisualStudio 2022 on Windows. I downloaded an image. The image is exists. I can load it into an ImageView. I want to show the image in WebView with other html code.

A simple test code:

  private async void WebViewImagetest()
    {
        string imageName = "Android-main2.jpg";
        string filePath = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.Personal), "media", imageName);
        FileInfo file = new FileInfo(filePath);
        image1.Source = filePath;
        if (file.Exists)
        {
            var htmlSource = new HtmlWebViewSource();
            htmlSource.Html = $"<html><body>"  
                $"<h1>Xamarin.Forms</h1>"  
                $"<p>Welcome to WebView.</p>"  
                $"<body style=\"width:100%\">" 
                $"<img src=\"https://cdn-images-1.medium.com/fit/t/1600/480/1*xh4Z2pj_oCDbT7Y5CQ0geQ.jpeg\"/><br>"   //works
                $"<img src=\"{filePath}\"/>"   // not working
                $"</body></html>";
            Browser.Source = htmlSource;
        }
        else
        {
            await tester.ImageDownload("https://www.technokrata.hu/uploads/2021/08/Android-main.jpg", filePath);
            Browser.Source = "https://google.com";
        }
    }

Thanks

CodePudding user response：

You can set the source with HtmlWebViewSource so it can load the html in codebehind:

 public EvaluateJavaScriptPage()
        {
            InitializeComponent();

            _webView.Source = LoadHTMLFileFromResource();
        }

        HtmlWebViewSource LoadHTMLFileFromResource()
        {
            var source = new HtmlWebViewSource();

            // Load the HTML file embedded as a resource in the .NET Standard library
            var assembly = typeof(EvaluateJavaScriptPage).GetTypeInfo().Assembly;
            var stream = assembly.GetManifestResourceStream("WebViewSample.index.html");            
            using (var reader = new StreamReader(stream))
            {
                source.Html = reader.ReadToEnd();
            }
            return source;
        }

CodePudding user response：

I have a solution. I had two problems:

I had to save a full website with js, css and images
I have two Xaml pages: one for save a website (this is an API page) and one for show the save website

At first I save the HTML code. After this I can load the saved HTML in a WebView with HtmlWebViewSource. When the page loaded, the WebView saves the cache (with js, css and images). After this I can turn of the internet and load the HTML (with js, csss and images) in the WebView or in an other WebView (because of the shared web cache)

Here the test code (I called the code with this line WebCacheTest("https://pluszegy.com/kezolap/", htmlPath);:

private void WebCacheTest(string url, string path)
        {
            if (!File.Exists(path))
                SaveWebsite(url, path);
            else
                LoadOfflineWebsite(path);
        }

        async void SaveWebsite(string url, string path)
        {
            string html = await tester.HtmlTartalomLetöltése(url);
            using (StreamWriter sr = File.CreateText(path))
            {
                sr.WriteLine(html);
                var htmlSource = new HtmlWebViewSource();
                htmlSource.Html = html;
                Browser.Source = htmlSource;
            }
        }

        void LoadOfflineWebsite(string path)
        {
            using (StreamReader sr = File.OpenText(path))
            {
                string html = sr.ReadToEnd();
                var htmlSource = new HtmlWebViewSource();
                htmlSource.Html = html;
                Browser.Source = htmlSource;
            }
        }