MyCustomPage.xaml is not loading webView in xamarin.Forms portable

Question

I am beginner in xamarin.forms portable, i am working on xamainr.forms portable project, there i am facing issue. I have a .xaml page in my portable project and i am navigating to this .xaml page from App.cs using following line of code.

var ep = new CustomWebViewPage(dbPath);
var MainEv = new NavigationPage(ep);

Here in CustomWebViewPage i am using WebView in following way to load Url but after successful execution above lines emulator does not load webView. I don't know why it is happening. I am pasting code of CustomWebViewPage as following.

CustomWebViewPage.xaml.cs

using XamarinDbokReader.SQLite_AppSample;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
using System.IO;

namespace MyDummyProject
{
    public partial class CustomWebViewPage : ContentPage
    {
        public string dbPath = "";
        public CustomWebViewPage(string folderPath)
        {
            this.dbPath = folderPath;
            HttpHelperClass helperClass = new HttpHelperClass();
            InitializeComponent();
            var webView = new WebView();
            UrlWebViewSource urlWebViewSource = new UrlWebViewSource()
            {
                Url = UrlsList.FindUrl("ProEportalLoginPage") + UrlsList.ApiKeys(AppMode.ProductionMode.ToString())
            };
               webView.Source = urlWebViewSource;
               webView.Navigated += (s, e) =>
               {
                   if (e.Url.StartsWith("http://userInfo/?"))
                   {
                       string token = "";
                       try
                       {
                          string value_string = Uri.UnescapeDataString(e.Url.ToString());
                          token = value_string.Split('=')[1];
                          if (!string.IsNullOrEmpty(token))
                          {
                              string path = Path.Combine(dbPath.ToString(), "dBookStore.db3");
                              helperClass.SaveUserInformation(token, path);
                          }
                       }
                       catch (Exception ss)
                       {
                       }
                  }
            };
            wvEportalPage = webView;
        }
        public CustomWebViewPage()
        {

        }
    }
}

CustomWebViewPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="XamarinDbokReader.EportalPage">
    <Label Text="{Binding MainText}" VerticalOptions="Center" HorizontalOptions="Center" />
    <WebView x:Name="wvEportalPage"></WebView>
</ContentPage>

App.cs

public App(bool isSqliteDbExist, string sPath)
    {
        isDbExist = isSqliteDbExist;
        dbPath = sPath;
        if (isDbExist)
        {
            if (isLoggedIn)
            {
                NavigationPage navPage = new NavigationPage(new BooksView());
                App.Current.MainPage = navPage;
            }
            else
            {
                var tdlx = new CustomWebViewPage(dbPath);
                var MainNave = new NavigationPage(tdlx);
            }
        }
        else
        {
            //When cursor is coming from MainActivity then following line executes. And then OnStart() method executes.
            ssd.CreateTablesInDb();
            isDbExist = true;
        }
    }

 protected override void OnStart()
    {
        if (isDbExist)
        {
            if (isLoggedIn)
            {
                NavigationPage navPage = new NavigationPage(new BooksView());
                App.Current.MainPage = navPage;
            }
            else
            {
                var ep = new CustomWebViewPage(dbPath);
                var MainEv = new NavigationPage(ep);

            }
        }
    }

MainActivity

 protected override void OnCreate(Bundle bundle)
    {
        base.OnCreate(bundle);
        global::Xamarin.Forms.Forms.Init(this, bundle);
        var documents = System.Environment.GetFolderPath(System.Environment.SpecialFolder.Personal);
        var bookCoverFolder = Path.Combine(documents, "BooksCover");
        var booksCollection = Path.Combine(documents, "Books");
        var bookResource = Path.Combine(documents, "Resource");
        if(!Directory.Exists(bookCoverFolder))
            Directory.CreateDirectory(bookCoverFolder);
        if (!Directory.Exists(booksCollection))
            Directory.CreateDirectory(booksCollection);
        if(!Directory.Exists(bookResource))
            Directory.CreateDirectory(bookResource);
        SQLite_Android androidDb = new SQLite_Android();
        if (androidDb.IsExist())
        {
            LoadApplication(new App(true, androidDb.dbStorePath));
        }
        else
        {
            LoadApplication(new App(false, androidDb.dbStorePath));

        }
    }

Answer 1

You must define Width and Height to Xamarin WebView.

Answer 2

Thank you for awesome sugessions, but i found my mistake in code.I did a very small mistake in App.cs After setting navigation page i am not setting NavigationPage to MainPage. It should as below.

var tdlx = new CustomWebViewPage(dbPath);
var MainNave = new NavigationPage(tdlx);
MainPage = MainNave;

it worked perfectly. I knew about MainPage but i have not written due to some other regions but ultimately it is working.

Answer 3

The WebView probably isn't getting any Width or Height.

Try setting the VerticalOptions and HorizontalOptions properties to FillAndExpand.

So like this:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="XamarinDbokReader.EportalPage">
    <Label Text="{Binding MainText}" VerticalOptions="Center" HorizontalOptions="Center" />
    <WebView x:Name="wvEportalPage" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></WebView>
</ContentPage>

If that doesn't seem to work try wrapping it in a Grid.