Loading Local HTML with WebView Xamarin Forms

Question

I am trying to load a local HTML page in a webview with Xamarin forms. I am using the basic example in the dev docs although I can get a URL to load I can\'t get my own HTML

Answer 1

This is an old post but It may help someone looking to implement with Android, iOS and UWP with just one HTML file. With this approach you only use one HTML file for all platforms.

https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/files?tabs=vsmac#loading-files-embedded-as-resources

Answer 2

I am also suffering with the same issue,but I resolved in the following way

Use "UrlWebViewSource" instead of "HtmlWebViewSource"

var urlSource = new UrlWebViewSource();

string baseUrl = DependencyService.Get<IWebViewBaseUrl>().GetBaseUrl();
string filePathUrl = Path.Combine(baseUrl, "imprint.html");
urlSource.Url = filePathUrl;
WebBrowser.Source = urlSource;

Answer 3

You must check the file properties for Build Action = BundleResource

Try this code to load local html file

var source = new HtmlWebViewSource();
        string url = DependencyService.Get<IBaseUrl>().GetBaseUrl();
        string TempUrl = Path.Combine(url, "terms.html");
        source.BaseUrl = url;
        string html;
        try
        {
            using (var sr = new StreamReader(TempUrl))
            {
                html = sr.ReadToEnd();
                source.Html = html;
            }
        }
        catch(Exception ex){
            Console.WriteLine(ex.Message);
        }

Implementations of the interface for each platform must then be provided

iOS

[assembly: Dependency(typeof(BaseUrl))]
namespace yournamespace
{
   public class BaseUrl: IBaseUrl
   {
      public string GetBaseUrl()
      {
        return NSBundle.MainBundle.BundlePath;
      }
   }
}

Android

[assembly: Dependency (typeof(BaseUrl))]
 namespace yournamespace {
   public class BaseUrl_Android : IBaseUrl {
      public string Get() {
        return "file:///android_asset/";
     } 
   }
 }

Answer 4

Im not sure if this counts but I found a work around. Instead of taking the above route I simply did this:

webviewjava.Source = "file:///android_asset/TestWebPage.html";

in the code behind, and just left out the IBaseUrl call altogether. This works as its supposed to.

Answer 5

WebView.BaseUrl only tells the WebView where to start looking for files. It's the root folder of the "web site". By default browsers will load the file index.html, so if you rename your file to index.html I believe it should load automatically.

I think this should be possible too:

webviewjava.BaseUrl = DependencyService.Get<IBaseUrl>().Get();
webviewjava.Source = "TestWebPage.html";

Here you're saying "use this location as the default place to look for files" and "look up this file and use it as the source for the HTML".