connectivity_watcher 3.0.1 copy "connectivity_watcher: ^3.0.1" to clipboard
connectivity_watcher: ^3.0.1 copied to clipboard

A Flutter package to check your internet connectivity with subsecond response times, even on mobile networks!.

connectivity_watcher #

pub package pub points License: MIT

Connectivity Watcher is a robust Flutter package designed to monitor internet connectivity and network availability status in real-time. This ensures that your app can effectively manage and respond to changes in connectivity, providing a seamless user experience.

Getting started #

First, add connectivity_watcher as a dependency in your pubspec.yaml file:

dependencies:
  flutter:
    sdk: flutter
  connectivity_watcher: ^[version]

Import the package #

import 'package:connectivity_watcher/connectivity_watcher.dart';

🚀 What's New #

1. Renamed Classes #

  • ConnectivityWatcherWrapper is now ZoConnectivityWrapper.
  • ConnectivityWatcher is now ZoConnectivityWatcher.

2. New NoConnectivity Styles #

  • CUSTOMALERT: Add your custom alert dialogs, and the package handles showing and hiding them.
  • NONE: Manage widgets based on internet connectivity at the widget level instead of globally.

3. Curl Interceptor for Dio #

Log API requests as curl commands in the console:

Dio dio = Dio();
dio.interceptors.add(CurlInterceptor());

4. ZoNetworkAware Widget #

Handle network-aware functionality in your app. Example:

ZoNetworkAware(
  builder: (context, status) {
    if (status == ConnectivityWatcherStatus.connected) {
      return Container(
        height: 50,
        width: 250,
        decoration: BoxDecoration(
          color: Colors.blue,
          borderRadius: BorderRadius.circular(20),
        ),
        child: MaterialButton(
          onPressed: () async {},
          child: Text(
            'Login',
            style: TextStyle(color: Colors.black, fontSize: 25),
          ),
        ),
      );
    } else {
      return Container(
        height: 50,
        width: 250,
        decoration: BoxDecoration(
          color: Colors.blue,
          borderRadius: BorderRadius.circular(20),
        ),
        child: MaterialButton(
          onPressed: () async {},
          child: Text(
            'Disconnected',
            style: TextStyle(color: Colors.black, fontSize: 25),
          ),
        ),
      );
    }
  },
);

5. API Call with Internet Status #

Execute API tasks seamlessly by verifying internet connectivity beforehand:

ZoConnectivityWatcher().makeApiCall(
  apiCall: (internetStatus) async {
    if (internetStatus) {
      Dio dio = Dio();
      Response data = await dio.post(
        "https://jsonplaceholder.typicode.com/posts",
        data: {
          "title": 'foo',
          "body": 'bar',
          "userId": 1,
        },
      );
    }
  },
);

Usage 🚀 #

Custom No Internet Screen #

Wrap your MaterialApp with ConnectivityWatcherWrapper, set connectivityStyle to CUSTOM, and provide a custom widget:

Widget build(BuildContext context) {
  return ZoConnectivityWrapper(
    navigationKey: navigatorKey,
    connectivityStyle: NoConnectivityStyle.CUSTOM,
    noInternetText: Text(
      "Testing message",
      style: TextStyle(color: Colors.red),
    ),
    offlineWidget: CustomNoInternetWrapper(
      builder: (context) {
        return CustomNoInternet();
      },
    ),
    builder: (context, connectionKey) {
      return MaterialApp(
        navigatorKey: navigatorKey,
        debugShowCheckedModeBanner: false,
        title: 'Connectivity_Watcher',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: LoginDemo(),
      );
    },
  );
}

Note: The package will automatically remove the custom widget when the internet is back. If not, use the following method:

bool hasRemoved = await ZoConnectivityWatcher().hideNoInternet();
if (hasRemoved) {
  // Your code after internet is back
} else {
  print("No Internet");
}

Built-in Styles #

SnackBar Style

Widget build(BuildContext context) {
  return ZoConnectivityWrapper(
    connectivityStyle: NoConnectivityStyle.SNACKBAR,
    builder: (context, connectionKey) {
      return MaterialApp(
        navigatorKey: connectionKey,
        debugShowCheckedModeBanner: false,
        title: 'Connectivity_Watcher',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: LoginDemo(),
      );
    },
  );
}

Alert Style

Widget build(BuildContext context) {
  return ZoConnectivityWrapper(
    connectivityStyle: NoConnectivityStyle.ALERT,
    builder: (context, connectionKey) {
      return MaterialApp(
        navigatorKey: connectionKey,
        debugShowCheckedModeBanner: false,
        title: 'Connectivity_Watcher',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: LoginDemo(),
      );
    },
  );
}

Preview #

Custom #

custom

SnackBar #

snackbar

Alert #

alert

Check Internet Status #

bool hasInternet = await ZoConnectivityWatcher().isInternetAvailable;

Features and Bugs #

Feel free to post feature requests or report bugs here.

37
likes
150
points
223
downloads
screenshot

Publisher

verified publisherthezerone.com

Weekly Downloads

A Flutter package to check your internet connectivity with subsecond response times, even on mobile networks!.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

dio, flutter, internet_connection_checker

More

Packages that depend on connectivity_watcher