webview nav

How to handle Xamarin Forms WebView internal Navigations!

So you put a Webpage or some HTML content inside your Xamarin Forms WebView ? Specially with Hyperlinks? Or basically you loaded a whole Website inside the WebView?  And now you are worried you can’t control or monitor the Navigation inside the WebView with all those Hyperlink clicks?

Situation…

Oh well I have been in the same situation, where I basically loaded a WebPage and then I wanted to control and monitor it’s internal HyperLink clicks. We already know that the Xamarin Forms WebView doesn’t come with a lot of control properties, but lucky enough they have wrapped the Navigating event of the WebView which could help us Control/Monitor the Hyperlink clicks/navigations inside the Xamarin Forms WebView.

So this is how you do it…

It’s pretty easy actually, but a lot of developers miss this event when it comes to the Xamarin Forms WebView. We can easily subscribe to the Navigating event of the WebView, whereas whenever the user clicks on any HyperLink inside the WebView the action goes through this event, thereby allowing us to monitor and control the hyperlink click of the WebView.

Inside the Navigating Event we have the access to the Event parameter, which let’s us access what the HyperLink that the user clicked on, and as you can see in the below code, I have checked what’s the HyperLink user clicked on and based on that URL string, I’m executing my custom action.

Also keep in mind this allows you to even Cancel that certain HyperLink click event, once you execute your own overridden process as you can see below.

mywebView.Navigating += (s, e) =>
{
	if (e.Url.StartsWith("https://www.whateverlink112312.com.sg/"))
	{
		// now do this instead of navigating within the WebView...
		//....
		//....
		// and finally cancle the defauly WebView Navigation...
		e.Cancel = true;
	}
	else if (e.Url.StartsWith("https://www.whateverlink4444.com.sg/"))
	{
		// now do this instead of navigating within the WebView...
		//....
		//....
		// and finally cancle the defauly WebView Navigation...

		e.Cancel = true;
	}
	else if (e.Url.StartsWith("https://www.whateverlink333333.com.sg/"))
	{
		// now do this instead of navigating within the WebView...
		//....
		//....
		// and finally cancle the defauly WebView Navigation...

		e.Cancel = true;
	}
};

 

So just like that you can gain access to the entire HyperLink click event and control or monitor it in anyways as you wish. For example different actions for different types of HyperLink clicks. 😉

There you go fellas! 😀

Stay Awesome! 😉

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s