'How can I show HTML inside a Xamarin.Forms page with source for HTML in C#?
I wrote this code to try and show a couple of lines of HTML within a web page:
I have this XAML:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:Japanese;assembly=Test"
x:Class="Test.HelpCards"
x:Name="HelpCards"
Title="Help ▹ Cards Tab">
<ContentPage.Content>
<ScrollView>
<StackLayout Spacing="10" Margin="20">
<WebView x:Name="Browser" />
</StackLayout>
</ScrollView>
</ContentPage.Content>
</ContentPage>
public HelpCards()
{
InitializeComponent();
var htmlSource = new HtmlWebViewSource();
htmlSource.Html = @"<html><body>
<h1>ABC</h1>
<p>DEF</p>
</body></html>";
Browser.Source = htmlSource;
}
However when running the code I see only a blank page.
Does anyone have any ideas as to what might be wrong?
Solution 1:[1]
The webview can be in the ContentPage.Content by itself. No need to wrap it in a ScrollView or StackLayout. This method also doesn't require Horizontal or Vetical Options to be specified as well.
<ContentPage.Content>
<WebView x:Name="Browser" />
</ContentPage.Content>
Solution 2:[2]
For the people that also stumbled across this question:
Xamarin has updated the label element at some point. The update included a way to display HTML in the label element, by adding TextType="Html" to the element.
Example:
<Label TextType="Html">
<![CDATA[
This is <strong style="color:red">HTML</strong> text.
]]>
</Label>
(Source: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/text/label#display-html)
This is my first answer on Stack Overflow. Please tell me how I can improve.
Solution 3:[3]
Try this with the webBrowser
public MainPage()
{
InitializeComponent();
CheckWifiOnStart();
CheckWifiContinously();
}
private void CheckWifiOnStart()
{
var source = new HtmlWebViewSource();
source.BaseUrl = "file://android_asset/";
//CONTROL TO SEE IF USER IS CONNECTED
if (!CrossConnectivity.Current.IsConnected)
{
Browser.Source = "file:///android_asset/index.html";
}
else
{
Browser.Source = "ONLINE URL";
}
}
private void CheckWifiContinously()
{
var source = new HtmlWebViewSource();
source.BaseUrl = "file://android_asset/";
//CONTROL TO CONNECTIVITY CHANGE
CrossConnectivity.Current.ConnectivityChanged += (sender, args) => {
if (!CrossConnectivity.Current.IsConnected)
{
DisplayAlert("ERROR", "OFFLINE MODE", "OK");
Browser.Source = "file:///android_asset/index.html";
}
else
{
DisplayAlert("INTERNET DETECTED", "ONLINE MODE", "OK");
Browser.Source = "ONLINE URL";
}
};
}
public interface IBaseUrl { string GetFile(); }
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | heinst |
| Solution 2 | BOT Alex |
| Solution 3 | JosuNC |
