Flutter 检测网络连接 监听网络变化

 

完整的代码, 可以复制引用

// 这部分简述了Flutter如何检测和监听网络连接的变化
// 使用了'connectivity'库来实现这一功能

Flutter检测网络完整示例代码

    import 'package:flutter/material.dart';
    import 'package:connectivity/connectivity.dart'; // 导入connectivity库来检测网络状态
    class NetworkPage extends StatefulWidget {
        NetworkPage({Key key}) : super(key: key); // 构造函数，接收一个key参数

        _NetworkPageState createState() => _NetworkPageState();
// 创建NetworkPage的状态
    }

    class _NetworkPageState extends State<NetworkPage> {
        String _state; // 声明一个私有变量来存储网络状态
        var _subscription; // 声明一个私有变量来存储网络变化的订阅

        @override
        initState() {
            super.initState();
             // 初始化状态
            _subscription = Connectivity().onConnectivityChanged.listen((ConnectivityResult result) {
                // 通过connectivity库监听网络状态的变化，并返回结果

                if (result == ConnectivityResult.mobile) {
                    // 如果连接的是移动数据网络
                    setState(() {
                        _state = "手机网络";
                        // 设置状态为"手机网络"
                    });
                    // I am connected to a mobile network.
                } else if (result == ConnectivityResult.wifi) {
                    // 如果连接的是WiFi网络
                    setState(() {
                        _state = "Wifi 网络";
                        // 设置状态为"Wifi 网络"
                    });
                    // I am connected to a wifi network.
                } else {
                    // 如果没有网络连接
                    setState(() {
                        _state = "没有网络";
                        // 设置状态为"没有网络"
                    });
                }
            });
        }

        @override
        dispose() {
            super.dispose();
               // 销毁组件
            _subscription.cancel();
             // 取消网络状态的订阅
        }

        @override
        Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
        title: Text("检测网络变化"),
       // App的标题栏显示"检测网络变化"
    ),
        body: Text("${_state}"),
       // 主体部分显示当前的网络状态
    );
    }
    }