搜索插件、代码仓与 APP 分类

插件详情v1.0.8

connectivity_monitor

一个 Flutter 包,用于监控互联网连接状态,并支持动态 UI 更新和 Toast 通知。

AndroidiOSWeb
近 30 天下载
119
喜欢数
27
Pub 分数
140

安装插件

flutter pub add connectivity_monitor

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

Connectivity Monitor 是一个 Flutter 包,可在 Android、iOS 和 Web 平台上实现互联网连接的实时监控。它在网络状态变化时提供动态 UI 更新和可选的吐司通知,帮助用户了解连接可用性。该包可无缝集成到需要可靠网络状态感知的应用中,例如涉及数据同步或在线服务的应用。它支持 Wi-Fi 和移动数据检测,通过简单的 API 实现最小化设置。

适合场景

  • 实时网络状态跟踪
  • 应用程序中的离线模式处理
  • 失败请求的自动重试逻辑
  • 用户关于连接丢失的反馈
  • 在线时同步数据
  • 增强网络波动期间的用户体验

主要特点

  • 连接状态更改时的动态UI更新
  • 网络事件的提示通知
  • 跨平台支持(Android、iOS、Web)
  • 简单的集成,配置最少
  • 自动检测 Wi-Fi 和移动数据
  • 轻量且无依赖

适合对象

  • 需要可靠网络状态感知的应用程序
  • 开发离线功能的应用程序的开发者
  • 需要用户对连接性提供反馈的项目
  • 以用户体验为中心的应用程序,具有依赖网络的功能
  • 寻求轻量级网络监控解决方案的团队

使用建议

  • Android 需要互联网权限
  • Web 支持取决于浏览器功能
  • Toast 通知可能需要针对不同主题进行自定义
  • 仅限基本连接性检查(无速度或质量指标)
  • 在复杂流程中可能需要手动处理重连逻辑

原始 README

以下为关联源码仓库的 README 原文快照,最新内容请访问源码仓库。

Connectivity Monitor

connectivity_monitor is a Flutter package that simplifies network connectivity handling in your apps. It provides a robust service (ConnectivityService) and a flexible widget (ConnectivityMonitor) to help you manage connectivity changes seamlessly and enhance user experience.


Features

  • Global Connectivity Monitoring: Automatically tracks network changes and validates active internet access.
  • Customizable Connectivity Indicator: Display dialogs, custom widgets, or toast notifications to inform users of connectivity changes.
  • Debouncing Events: Reduces excessive updates by applying debounce logic to connectivity events.
  • Callbacks for Connectivity Events: Easily handle onConnected and onDisconnected events with custom logic.
  • Cross-Platform Support: Works flawlessly on Android, iOS.
  • Customizable Options: Tailor toast messages, colors, and widgets to match your app's theme and design.

Installation

Add the package to your pubspec.yaml:

dependencies:
  connectivity_monitor: ^1.0.5

Then run:

flutter pub get

Important Note

To use the ConnectivityMonitor widget effectively, the ConnectivityService.startConnectionNotifier must be called first to initialize the global connectivity listener. This ensures that the connectivity events are properly monitored and can be utilized by the ConnectivityMonitor widget or any custom logic you implement.

You can use ConnectivityMonitor to adapt your UI based on connectivity changes or choose not to use it and rely solely on the ConnectivityService for monitoring and callbacks.

Usage

1. Start Global Monitoring with ConnectivityService

Start monitoring network connectivity in your app's main function:

Note: Ensure that WidgetsFlutterBinding.ensureInitialized(); is called before starting the connectivity service.

import 'package:flutter/material.dart';
import 'package:connectivity_monitor/connectivity_monitor.dart';

void main() {
  // Ensure bindings are initialized before starting the connectivity service
  WidgetsFlutterBinding.ensureInitialized();

  // Start monitoring network connectivity globally
  ConnectivityService.startConnectionNotifier(
    connectedToastMessage: "Connected!",
    disconnectedToastMessage: "No Internet Connection.",
    showToasts: true, // Show toast notifications for connectivity changes
  );

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Connectivity Monitor Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Connectivity Monitor Example')),
      body: Center(child: Text('Home Screen')),
    );
  }
}
2. Use ConnectivityMonitor Widget

Wrap your app's widgets or pages with the ConnectivityMonitor widget to display custom UI or messages when the user is offline:

import 'package:flutter/material.dart';
import 'package:connectivity_monitor/connectivity_monitor.dart';

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Connectivity Monitor Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ConnectivityMonitor(
        child: HomeScreen(),
        customDisconnectedWidget: Center(
          child: Text(
            'No Internet Connection. Please reconnect.',
            style: TextStyle(color: Colors.red, fontSize: 18),
          ),
        ),
        customDialog: AlertDialog(
          title: Text('No Internet'),
          content: Text('Please check your connection and try again.'),
        ),
      ),
    );
  }
}

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Connectivity Monitor Example')),
      body: Center(child: Text('Home Screen')),
    );
  }
}
Connectivity Monitor Widget
  • child (required): The main widget to display when connected.
  • customDisconnectedWidget: Custom widget to display when the device is disconnected. (default: null)
  • requiresConnection: If true, ensures that the child widget is displayed only when the device is connected to the internet. (default: true)
  • useDialogAsConnectivityIndicator: Whether to show a dialog as the connectivity indicator. (default: true)
  • useWidgetAsConnectivityIndicator: Whether to use a custom widget for the connectivity indicator. (default: false)
  • customDialog: Custom dialog widget for the disconnected state. (default: null)

How to Work with ConnectivityService

Connectivity Service Options
  • startConnectionNotifier: Initializes global connectivity monitoring, validating internet access and broadcasting changes.
  • stopNotifier: Stops global connectivity monitoring and cleans up resources.
  • validateInternetConnection: Checks if the device has access to the internet by pinging a specified URL (default: https://google.com).

ConnectivityService Methods Explained
startConnectionNotifier()

The startConnectionNotifier method initializes global connectivity monitoring and listens for internet connection changes. It also provides options for displaying toast notifications, handling connection events, and debouncing network change events. This method must be called before using the ConnectivityMonitor widget to ensure connectivity updates are available.

Features:

  1. Monitors network connectivity changes using connectivity_plus.
  2. Validates actual internet access by pinging a reliable URL.
  3. Triggers callbacks for onConnected and onDisconnected events.
  4. Displays customizable toast notifications for connection status.
  5. Debounces rapid network change events to prevent excessive updates.

Parameters:

  • connectedToastMessage (String, default: "You are now connected to the Internet."):
    The message displayed when the device is connected to the internet.

  • disconnectedToastMessage (String, default: "No internet connection. Please check your network."):
    The message displayed when the device is disconnected from the internet.

  • testUrl (String, default: "https://google.com"):
    The URL used to validate actual internet access.

  • connectedToastBackgroundColor (Color, default: Colors.green):
    The background color of the toast message when connected.

  • disconnectedToastBackgroundColor (Color, default: Colors.red):
    The background color of the toast message when disconnected.

  • connectedWebToastBackgroundHexColor (String, default: "#4CAF50"):
    The background color (in hex) for web toasts when connected.

  • disconnectedWebToastBackgroundHexColor (String, default: "#F44336"):
    The background color (in hex) for web toasts when disconnected.

  • toastGravity (ToastGravity, default: ToastGravity.BOTTOM):
    The position of the toast on the screen.

  • toastFontSize (double, default: 16.0):
    The font size of the toast message.

  • showToasts (bool, default: true):
    Whether to show toast notifications for connectivity changes.

  • debounceDuration (Duration, default: Duration(milliseconds: 500)):
    The debounce duration for connectivity change events.

  • onConnected (Function, optional):
    A callback function triggered when the device connects to the internet.

  • onDisconnected (Function, optional):
    A callback function triggered when the device disconnects from the internet.

Example Usage:

Make sure to call WidgetsFlutterBinding.ensureInitialized(); in your app's main function before starting the notifier.

import 'package:flutter/material.dart';
import 'package:connectivity_monitor/connectivity_service.dart';

void main() {
  // Ensure proper initialization
  WidgetsFlutterBinding.ensureInitialized();

  // Start global connectivity monitoring
  ConnectivityService.startConnectionNotifier(
    connectedToastMessage: "Connected to the Internet!",
    disconnectedToastMessage: "No Internet Connection.",
    onConnected: () => debugPrint("Connected!"),
    onDisconnected: () => debugPrint("Disconnected!"),
    showToasts: true,
  );

  runApp(MyApp());
}

stopNotifier()

The stopNotifier method stops the global connectivity monitoring process and cleans up resources. It performs the following actions:

  1. Cancels the current subscription to the connectivity listener, preventing further updates.
  2. Closes the StreamController used for broadcasting connectivity changes, releasing all related resources.
  3. Marks the connectivity notifier as inactive.

This method is particularly useful in scenarios where you no longer need to monitor connectivity, such as when the app is being disposed or during testing.

// Example usage of stopNotifier
void dispose() {
  ConnectivityService.stopNotifier();
  super.dispose();
}

Note: It is generally not necessary to call stopNotifier explicitly in most applications because the listener stops automatically when the app is closed. Use it only when specific cleanup is required.


validateInternetConnection()

The validateInternetConnection method checks whether the device has active internet access. Unlike basic network connectivity checks (e.g., Wi-Fi or mobile data), this method ensures that the device can actually access the internet by sending an HTTP request to a reliable URL.

Parameters:
  • testUrl: The URL used to verify internet access (default is https://google.com).
  • retries: The number of times to retry the request if it fails (default is 3).
  • retryDelay: The delay between retry attempts (default is 2 seconds).
How It Works:
  1. Sends an HTTP GET request to the specified testUrl.
  2. If the request succeeds and returns a 200 status code, it confirms internet access.
  3. If the request fails, it retries up to the specified number of times before returning false.
// Example usage of validateInternetConnection
Future<void> checkConnection() async {
  bool isConnected = await ConnectivityService.validateInternetConnection(
    testUrl: 'https://example.com',
    retries: 2,
    retryDelay: Duration(seconds: 1),
  );

  if (isConnected) {
    print('Internet is accessible');
  } else {
    print('No active internet connection');
  }
}

Contributions

Contributions are welcome! Please feel free to submit issues or pull requests to improve this package.

所属分类

依赖

依赖清单 4 项

源码仓库

使用此插件的项目

暂无相关数据。