Xamarin Forms - Web View Not Displaying

Question

I am working on a small Xamarin.Forms web viewer application. This is the next question to the previous one, xamarin-forms-making-webview-go-back

So, I have a toolbar and the back button is implemented and working. But when I start the program with the emulator already open (im using Genymotion), the program starts and shows the toolbar along with the back button ... but the web view is not displayed.

But this is strange, sometimes when I run the program when the emulator is in sleep mode and then switches back to the program, it works fine. Also, when I tested it on iOS, it just showed the toolbar and didn't browse the website at all! Most often this is not, the emulator simply will not show webView. I also tested this on my Android device, and the same thing happens, itll show the toolbar, but not the webview.

I don’t understand what I understand, but can anyone help me with this.

I will attach my code below:

App.cs

using System; using System.Collections.Generic; using System.Linq; using System.Text; using Xamarin.Forms; namespace WebView_form { public class App : Application { public App() { //const string URL = "http://www.google.com"; MainPage = new NavigationPage(new WebPage()); } protected override void OnStart() { // Handle when your app starts } protected override void OnSleep() { // Handle when your app sleeps } protected override void OnResume() { // Handle when your app resumes } } } 

WebPage.cs

 using System; using System.Collections.Generic; using System.Linq; using System.Reflection.Emit; using System.Text; using Xamarin.Forms; namespace WebView_form { public class WebPage : ContentPage { private WebView webView; public WebPage() { webView = new WebView { Source = "https://www.google.com" }; // toolbar ToolbarItems.Add(new ToolbarItem("Back", null, () => { webView.GoBack(); })); Content = new StackLayout { Children = { webView } }; } } } 

If anyone can help me, it would be great.

Answer 1

Set VerticalOptions to FillAndExpand and do the same for HorizontalOptions if that doesn't work.

WebView gets a height of zero size, because when the layout happens, the view is still empty.

So modify the code in your WebPage.cs as follows:

 // ... Other code public WebPage() { webView = new WebView { Source = "https://www.google.com", VerticalOptions = LayoutOptions.FillAndExpand, HorizontalOptions = LayoutOptions.FillAndExpand }; // toolbar ToolbarItems.Add(new ToolbarItem("Back", null, () => { webView.GoBack(); })); Content = new StackLayout { Children = { webView } }; } // ... Other code 

Answer 2

Another thing to keep in mind: if you are responding to a WebView.Navigating event, be sure not to set your args.Cancel arguments to true if the page is loaded in the WevView.Source file. The iOS implementation for WebView.Navigating fires when loading WebView.Source, but the Android implementation does not work. If you set args.Cancel to true when the page in question is WebView.Source, the WebView will be empty.

Answer 3

Install this in your Info.plist to bypass the application transport security check. Visit https://developer.apple.com/documentation/bundleresources/information_property_list/nsapptransportsecurity for more information.

 <key>NSAppTransportSecurity</key> <dict> <key>NSAllowsArbitraryLoads</key> <true/> </dict> 

Note: my URL is already HTTPS, I don’t know why it is still blocked.