Check Network Connectivity In Xamarin.Forms Application For Android And UWP

Reading this article, you will learn how to check Network Connectivity in Xamarin Forms application for Android and Universal Windows Platform with XAML and Visual C# in cross platform application development.

The following important tools are required for developing UWP,

1. Windows 10 (Recommended)
2. Visual Studio 2017 RC Community/Enterprise/Professional Edition (It is a Free trial software available online)
3. Using Visual studio 2017 Installer, Enable the feature of Mobile development with .NET.

Now we can discuss step by step App development.

Step 1

Open Visual studio 2017 RC -> Start -> New Project-> Select Cross-Platform (under Visual C#->Cross Platform App-> Give the Suitable Name for your App (XamFormChkNet) ->OK.

 

Step 2

Select the Cross Platform template as Blank APP ->Set UI Technology as Forms and Sharing as PCL and Afterwards, Visual Studio creates 4 projects (Portable, Droid, iOS, UWP) and displays Getting Started.XamarinPage,

 

Step 3

Add the Xam.Plugin.Connectivity reference to All 4 Projects using Manage NUGet Packages,

 

Add reference to all the Projects

 

Step 4

In MainPage.Xaml Page , add 3 Labels For Title And connectivity information display, 

<StackLayout>
    <Label Text="Xamarin Forms - Check Network Connectivity in UWP and Android " VerticalOptions="Center" HorizontalOptions="Center" />
    <Label Text="Connected Network is !....." TranslationX="0" TranslationY="100" VerticalOptions="Center" HorizontalOptions="Center" />
    <Label x:Name="ConNet" TranslationX="0" TranslationY="100" VerticalOptions="Center" HorizontalOptions="Center" FontSize="Large" />
</StackLayout>

 

Step 5

Add the following namespace and code to App.xaml.cs 

using Xamarin.Forms;
using Plugin.Connectivity;
using Plugin.Connectivity.Abstractions;
protected override void OnStart() {
    // Handle when your app starts
    CrossConnectivity.Current.ConnectivityChanged += HandleConnectivityChanged;
}
void HandleConnectivityChanged(object sender, ConnectivityChangedEventArgs e) {
    Type currentPage = this.MainPage.GetType();
    if (e.IsConnected && currentPage != typeof(MainPage)) this.MainPage = new MainPage();
    else if (!e.IsConnected && currentPage != typeof(MainPage)) this.MainPage = new MainPage();
}

 

Step 6

Add the following namespace and code to MainPage.xaml.cs 

using Xamarin.Forms;
using Plugin.Connectivity;
using Plugin.Connectivity.Abstractions;
protected override void OnAppearing() {
    ConNet.Text = CrossConnectivity.Current.ConnectionTypes.First().ToString();
    CrossConnectivity.Current.ConnectivityChanged += UpdateNetworkInfo;
}
protected override void OnDisappearing() {
    CrossConnectivity.Current.ConnectivityChanged -= UpdateNetworkInfo;
}
private void UpdateNetworkInfo(object sender, ConnectivityChangedEventArgs e) {
    var connectionType = CrossConnectivity.Current.ConnectionTypes.FirstOrDefault();
    ConNet.Text = connectionType.ToString();
}

 

Step 7

We will test Android and UWP. So, we can set the Multiple Startup Projects as XamFormChkNet.Droid and XamFormChkNet.UWP(universal Windows)

 

Step 8

Change the Configuration Manager settings, Go to Build -> Configuration Manager,

Uncheck the Build and deploy options to the iOS and Check the Droid and UWP

 

Step 9

Deploy your App to Android Emulator and Local Machine (UWP) and the output of the XamFormChkNet App is,

 

Summary

Now you have successfully tested Network connectivity in Xamarin Forms application for Cross Platform Application Development using Visual C# and Xamarin.