Loading an html asset that's stored within Xamarin.Forms into a webview

Question

I read in an existing question on how to use a webview in Xamarin.Android that suggests to write platform specific code on every supported platform.

Ideally, I want to store my html in a file within /assets/ in the Xamarin.Forms instead of storing it once for every OS.

I desire to have an easier way and simply store the asset within Xamarin.Forms. Is that possible?

Answer 1

I found a way to get it to work:

In RightClickOnProject/Properties/Resources there's a view that allows to add files that can be used as resources within Xamarin.Forms. I added there a HtmlFile.txt-file.

I add the WebView to the xaml via:

<ContentPage.Content>
    <StackLayout>
        <WebView x:Name="Web" VerticalOptions="FillAndExpand" />                     
    </StackLayout>
</ContentPage.Content>

Then in the code-behind I do:

public partial class OurPage: ContentPage
{
    public OurPage()
    {
        InitializeComponent();

        Web.Source = new HtmlWebViewSource{Html = Properties.Resources.HtmlFile};
    }
}

Answer 2

Well if I am correct you can sort of do it using an Embedded file in the asset folder and then reading it using System.IO something like this (Assuming you are using a NET Standard assembly):

• Add the file that you want to read into the desired folder in your portable class and also ensure that the Build Action: EmbeddedResource.

• Then use GetManifestResourceStream to access the embedded file using its Resource ID, By default, the resource ID is the filename prefixed with the default namespace for the project it is embedded in - in this case, the assembly is WorkingWithFiles and the filename is PCLTextResource.txt, so the resource ID is WorkingWithFiles.PCLTextResource.txt. Now to get the desired file data all you need to so is something like this:

   var assembly = IntrospectionExtensions.GetTypeInfo(typeof(LoadResourceText)).Assembly;
   Stream stream = assembly.GetManifestResourceStream("WorkingWithFiles.PCLTextResource.txt");
   string text = "";
   using (var reader = new System.IO.StreamReader (stream)) {
   text = reader.ReadToEnd ();
   }
  

  Where LoadResourceText is the cs file in which I am using this code to get the current assembly. Note that this should be the same assembly where the Embedded resource that you have just added is present and WorkingWithFiles.PCLTextResource.txt is the Assembly path for your Embedded resource for eg: If your assembly name is Foo and your file is in a folder called Asset then your path for this would be something like Foo.Asset.Your_File.txt

• Once you are done with all this then the easy part begins, in your WebView page define a HtmlWebViewSource and assign it as the source to your WebView and Vola! you have loaded the data from the file your file.

      var browser = new WebView();
      var htmlSource = new HtmlWebViewSource();
      htmlSource.Html = ;//your html string here
      browser.Source = htmlSource;
  

Check How to work with files for more information.