In this sample demo I will use Xamarin.Essentials.Connectivity.cs<\/strong> static class for handling internet connection changes. <\/p>\n\n\n\n 1 – Install Xamarin.Essentials nuget package.<\/strong><\/p>\n\n\n\n 2 – In Android project <\/strong><\/p>\n\n\n\n 2.1 Initialize Xamarin Essentials in OnCreate() method<\/strong><\/p>\n\n\n\n 2.2 Add ACCESS_NETWORK_STATE<\/em> permission in manifest file<\/strong><\/p>\n\n\n\n 3 – Create a NetworkConnectivity.cs class for handling network connections<\/strong><\/p>\n\n\n\n 4 – Now, Create Instance static property in App.xaml.cs<\/strong><\/p>\n\n\n\n 5 – Initialize Instance static variable in constructor of App.xaml.cs<\/strong><\/p>\n\n\n\n 6 – Now, Initialize \u200b\u200bNetworkConnectivity.cs class in OnStart() method.<\/strong><\/p>\n\n\n\n 7 – Now, Coming to UI part first of all we need to create ControlTemplate for each network state in App.xaml<\/strong><\/p>\n\n\n\n 8 – Now, We will need to change the template at run time when the network state will change<\/strong><\/p>\n\n\n\n State Explanation<\/strong><\/p>\n\n\n\n 9 – At last we need to set the InternetConnTemplate control template in the root page of all pages<\/strong><\/p>\n\n\n\n Example<\/strong><\/p>\n\n\n\n 10 – Result<\/strong><\/p>\n\n\n\n![\"Xamarin](\"https:\/\/learnmobiledevelopment.com\/wp-content\/uploads\/2022\/12\/XamarinEssentials-1024x563.png\")
<\/figure>\n\n\n\nprotected override void OnCreate(Bundle savedInstanceState)\n{\n base.OnCreate(savedInstanceState);\n\n \/\/ Initializing Xamarin Essentials\n Xamarin.Essentials.Platform.Init(this, savedInstanceState);\n\n global::Xamarin.Forms.Forms.Init(this, savedInstanceState);\n LoadApplication(new App());\n}<\/pre>\n\n\n\n<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<manifest xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\n\tandroid:versionCode=\"1\"\n\tandroid:versionName=\"1.0\"\n\tpackage=\"com.companyname.xfinternetstatussample\">\n\t<uses-sdk android:minSdkVersion=\"21\" android:targetSdkVersion=\"31\" \/>\n\t<application android:label=\"XFInternetStatusSample.Android\" android:theme=\"@style\/MainTheme\"><\/application>\n\t<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\" \/>\n<\/manifest><\/pre>\n\n\n\n
using Xamarin.Essentials;\n\nnamespace XFInternetStatusSample\n{\n public class NetworkConnectivity\n {\n private bool IsInternetConnected;\n\n #region Constructor\n\n public NetworkConnectivity()\n {\n \/\/ Register for connectivity changes, be sure to unsubscribe when finished\n Connectivity.ConnectivityChanged += OnConnectivityChanged;\n\n IsInternetConnected = CheckConnection();\n }\n\n #endregion\n\n #region Destructor\n\n ~NetworkConnectivity()\n {\n Connectivity.ConnectivityChanged -= OnConnectivityChanged;\n }\n\n #endregion\n\n #region Handle Network Connection \n\n public static bool CheckConnection()\n {\n var current = Connectivity.NetworkAccess;\n\n if (current == NetworkAccess.Internet)\n return true;\n else\n return false;\n }\n\n private void OnConnectivityChanged(object sender, ConnectivityChangedEventArgs e)\n {\n var access = e.NetworkAccess;\n var profiles = e.ConnectionProfiles;\n\n switch (access)\n {\n case NetworkAccess.Internet:\n\n IsInternetConnected = true;\n ShowInternetConnection(true);\n\n break;\n\n case NetworkAccess.None:\n\n IsInternetConnected = false;\n ShowInternetConnection(false);\n\n break;\n\n case NetworkAccess.Local:\n\n IsInternetConnected = false;\n ShowInternetConnection(false);\n\n break;\n\n case NetworkAccess.Unknown:\n System.Console.Write(\"A problem has occurred with your network connection.\");\n break;\n default:\n break;\n }\n }\n\n private void ShowInternetConnection(bool isInternetAvail)\n {\n \/\/ Set Internet connection view in every page in header\n App.Instance.SetInternetConnectionView(isInternetAvail);\n }\n\n\n #endregion\n\n }\n}<\/pre>\n\n\n\nprivate static App _instance;\npublic static App Instance \n{\n get { return _instance; }\n set { _instance = value; }\n}\n<\/pre>\n\n\n\npublic App ()\n{\n InitializeComponent();\n Instance = this;\n MainPage = new NavigationPage(new MainPage());\n}\n<\/pre>\n\n\n\nprotected override void OnStart ()\n{\n \/\/ Register Network Connectivity Change Event\n NetworkConnectivity networkConnectivityHelper = new NetworkConnectivity();\n}<\/pre>\n\n\n\n![\"Internet](\"https:\/\/learnmobiledevelopment.com\/wp-content\/uploads\/2022\/11\/InternetTemplates.png\")
<\/figure>\n\n\n\n \n<!-- Page Header (InternetConnection view) Template -->\n<ControlTemplate x:Key=\"InternetConnTemplate\">\n <StackLayout Spacing=\"0\">\n \n <BoxView\n BackgroundColor=\"#2196F3\"\n HeightRequest=\"55\"\n IsVisible=\"{OnPlatform Android='False',\n iOS='True'}\" \/>\n\n <ContentPresenter \/>\n \n <\/StackLayout>\n<\/ControlTemplate>\n\n<!-- Empty Template -->\n<ControlTemplate x:Key=\"EmptyTemplate\">\n <StackLayout Spacing=\"0\">\n\n <BoxView\n BackgroundColor=\"#2196F3\"\n HeightRequest=\"55\"\n IsVisible=\"{OnPlatform Android='False',\n iOS='True'}\" \/>\n\n <ContentPresenter \/>\n\n <\/StackLayout>\n<\/ControlTemplate>\n\n <!-- Online Template -->\n <ControlTemplate x:Key=\"OnlineTemplate\">\n <StackLayout Spacing=\"0\">\n\n <BoxView\n BackgroundColor=\"#2196F3\"\n HeightRequest=\"55\"\n IsVisible=\"{OnPlatform Android='False',\n iOS='True'}\" \/>\n\n <Frame\n x:Name=\"FrameBackground\"\n Padding=\"0,2,0,2\"\n BackgroundColor=\"#32CD32\"\n CornerRadius=\"0\"\n HasShadow=\"False\">\n\n <Label\n x:Name=\"LabelTitle\"\n FontAttributes=\"Bold\"\n HorizontalOptions=\"CenterAndExpand\"\n Text=\"Internet Connected\"\n TextColor=\"White\"\n VerticalOptions=\"CenterAndExpand\" \/>\n\n <\/Frame>\n\n <ContentPresenter \/>\n\n <\/StackLayout>\n<\/ControlTemplate>\n\n<!-- Offline Template -->\n<ControlTemplate x:Key=\"OfflineTemplate\">\n <StackLayout Spacing=\"0\">\n\n <BoxView\n BackgroundColor=\"#2196F3\"\n HeightRequest=\"55\"\n IsVisible=\"{OnPlatform Android='False',\n iOS='True'}\" \/>\n\n <Frame\n Padding=\"0,2,0,2\"\n BackgroundColor=\"Red\"\n CornerRadius=\"0\"\n HasShadow=\"False\">\n\n <Label\n FontAttributes=\"Bold\"\n HorizontalOptions=\"CenterAndExpand\"\n Text=\"No internet connection\"\n TextColor=\"White\"\n VerticalOptions=\"CenterAndExpand\" \/>\n\n <\/Frame>\n\n <ContentPresenter \/>\n\n <\/StackLayout>\n<\/ControlTemplate>\n<\/pre>\n\n\n\n\n
#region Set Internet Connection View\n\npublic void SetInternetConnectionView(bool isInternetAvail)\n{\n Device.BeginInvokeOnMainThread(() =>\n {\n if (isInternetAvail)\n {\n App.Current.Resources[\"InternetConnTemplate\"] = App.Current.Resources[\"OnlineTemplate\"];\n\n StartTimerFor4Second();\n }\n else\n {\n App.Current.Resources[\"InternetConnTemplate\"] = App.Current.Resources[\"OfflineTemplate\"];\n }\n });\n}\n\nprivate static void RemoveTopInternetConnView()\n{\n App.Current.Resources[\"InternetConnTemplate\"] = App.Current.Resources[\"EmptyTemplate\"];\n}\n\nprivate void StartTimerFor4Second()\n{\n System.Timers.Timer timer = new System.Timers.Timer();\n timer.Interval = 4000;\n timer.Enabled = true;\n timer.Elapsed += OnTimedEvent;\n}\n\nprivate static void OnTimedEvent(Object source, System.Timers.ElapsedEventArgs e)\n{\n try\n {\n (source as System.Timers.Timer).Enabled = false;\n (source as System.Timers.Timer).Dispose();\n\n Device.BeginInvokeOnMainThread(() =>\n {\n RemoveTopInternetConnView();\n });\n }\n catch (Exception ex)\n {\n }\n}\n\n#endregion\n<\/pre>\n\n\n\nNormal State<\/strong> : Empty Template shows in normal state.
Offline State<\/strong> : Offline Template shows when no internet connection is available.
Online State<\/strong> : Online Template shows when internet connection comes back.<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n\n
\n
protected override void OnResume ()\n{\n if (!NetworkConnectivity.CheckConnection())\n SetInternetConnectionView(false);\n}<\/pre>\n\n\n\npublic App ()\n{\n InitializeComponent();\n Instance = this;\n MainPage = new NavigationPage(new MainPage());\n\n if (!NetworkConnectivity.CheckConnection())\n SetInternetConnectionView(false);\n}<\/pre>\n\n\n\nControlTemplate=”{DynamicResource InternetConnTemplate}”<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n ![\"Internet](\"https:\/\/learnmobiledevelopment.com\/wp-content\/uploads\/2022\/11\/InternetStatusControlTemplate.png\")
<\/figure>\n\n\n\n