Flutter网络连接检测插件internet_connectivity_checker的使用

插件介绍

internet_connectivity_checker 是一个用于检测设备是否真正连接到互联网的Flutter插件。与connectivity等类似包不同，它不仅提供网络连接信息，还确认设备是否能访问互联网。这使得我们可以根据设备的实际互联网状态来动态管理应用中的组件。

开始使用

添加依赖

首先，在您的pubspec.yaml文件中添加以下依赖：

flutter pub add internet_connectivity_checker

使用方法

导入包并使用ConnectivityBuilder组件，它可以接收一个builder函数和一个可选的时间间隔参数（Duration对象），用于指定每次检查互联网连接之间等待的时间，默认为5秒。

示例代码

简单示例

下面是一个简单的例子，当设备在线时显示"Online"，否则显示"Offline"：

class Hello extends StatelessWidget {
  const Hello({super.key});

  @override
  Widget build(BuildContext context) {
    return ConnectivityBuilder(
      builder: (status) {
        bool connected = status == ConnectivityStatus.online;
        return Text(connected ? "Online" : "Offline");
      },
    );
  }
}

完整示例

这是一个更完整的示例，包括了UI样式设置，并且处理了三种不同的状态：在线、离线以及正在检查的状态。

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

void main() => runApp(const App());

class App extends StatelessWidget {
  const App({super.key});

  @override
  Widget build(BuildContext context) {
    TextStyle kTextStyle = Theme.of(context)
        .textTheme
        .headlineMedium!
        .copyWith(color: Colors.white);
    return MaterialApp(
      theme: ThemeData.dark(useMaterial3: true),
      home: Scaffold(
        backgroundColor: const Color(0XFF000F1D),
        appBar: AppBar(
          centerTitle: true,
          title: const Text("Internet Connectivity Checker"),
        ),
        body: Center(
          child: Container(
            width: 300,
            height: 300,
            margin: const EdgeInsets.all(20),
            child: ConnectivityBuilder(
              interval: const Duration(seconds: 5),
              builder: (ConnectivityStatus status) {
                if (status == ConnectivityStatus.online) {
                  return Container(
                    decoration: BoxDecoration(
                      color: Colors.green,
                      borderRadius: BorderRadius.circular(15),
                    ),
                    child: Center(child: Text("Online", style: kTextStyle)),
                  );
                } else if (status == ConnectivityStatus.offline) {
                  return Container(
                    decoration: BoxDecoration(
                      color: Colors.red,
                      borderRadius: BorderRadius.circular(15),
                    ),
                    child: Center(child: Text("Offline", style: kTextStyle)),
                  );
                } else {
                  // status == ConnectivityStatus.checking
                  return const Center(
                    child: SizedBox(
                      width: 25,
                      height: 25,
                      child: CircularProgressIndicator(strokeWidth: 2),
                    ),
                  );
                }
              },
            ),
          ),
        ),
      ),
    );
  }
}

此外，您还可以通过监听ConnectivityChecker().stream来手动处理逻辑，如下所示：

class Foo extends StatelessWidget {
  const Foo({super.key});

  @override
  Widget build(BuildContext context) {
    return StreamBuilder(
      stream: ConnectivityChecker(interval: const Duration(seconds: 10)).stream,
      builder: (context, snapshot) {
        if (snapshot.hasData && (snapshot.data as bool) == true) {
          return const Text("Online");
        } else if (snapshot.connectionState == ConnectionState.waiting) {
          return const Center(child: CircularProgressIndicator());
        } else {
          return const Text("Offline");
        }
      },
    );
  }
}

额外信息

如果您觉得这个项目有用，请不要吝啬给个星🌟。同时欢迎提交Pull Request或创建Issue来帮助改进该项目。

许可证

本软件采用MIT许可证发布，详情请参阅许可证文件。

希望以上内容对您有所帮助！如果有任何问题或需要进一步的帮助，请随时提问。