Flutter_学习记录_connectivity_plus 检测网络

  1. 引入插件
    官方网址:https://pub.dev/packages/connectivity_plus
  2. 导入头文件
dart 复制代码
import 'package:connectivity_plus/connectivity_plus.dart';
  1. StreamSubscription订阅网络监听
dart 复制代码
late StreamSubscription<List<ConnectivityResult>> _subscription;

@override void initState() { 
    super.initState(); 

    // 必须要有订阅,如果没有订阅的话,那下次再进来,就检测不到网络的变化了
    _subscription =  Connectivity().onConnectivityChanged.listen((List<ConnectivityResult> result){
      print(result);
      if (result.contains(ConnectivityResult.wifi)) {
        setState(() {
          _stateText = "网络连接的Wifi";
        });
      } else if (result.contains(ConnectivityResult.none)) {
        setState(() {
          _stateText = "没有网络连接";
        });
      } else {
        setState(() {
          _stateText = "检测中";
        });
      }
    });
  }
  1. dispose时,取消订阅
dart 复制代码
@override void dispose() { 
    _subscription.cancel();
    super.dispose(); 
  }
  1. 完整代码案例
dart 复制代码
import 'dart:async';

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

class ConnectivityDemo extends StatefulWidget {
  const ConnectivityDemo({super.key});

  @override
  State<ConnectivityDemo> createState() => _ConnectivityDemoState();
}

class _ConnectivityDemoState extends State<ConnectivityDemo> {
  late StreamSubscription<List<ConnectivityResult>> _subscription;
  String _stateText = "检测网络中";

  @override void initState() { 
    super.initState(); 

    // 必须要有订阅,如果没有订阅的话,那下次再进来,就检测不到网络的变化了
    _subscription =  Connectivity().onConnectivityChanged.listen((List<ConnectivityResult> result){
      print(result);
      if (result.contains(ConnectivityResult.wifi)) {
        setState(() {
          _stateText = "网络连接的Wifi";
        });
      } else if (result.contains(ConnectivityResult.none)) {
        setState(() {
          _stateText = "没有网络连接";
        });
      } else {
        setState(() {
          _stateText = "检测中";
        });
      }
    });
  }

         
  @override void dispose() { 
    _subscription.cancel();
    super.dispose(); 
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("网络监听"),
      ),
      body: Center(child: Text(_stateText)),
    );
  }
}
  1. 效果图如下:
相关推荐
小雨下雨的雨1 小时前
Flutter 框架跨平台鸿蒙开发 —— Flex 控件之响应式弹性布局
flutter·ui·华为·harmonyos·鸿蒙系统
cn_mengbei1 小时前
Flutter for OpenHarmony 实战:CheckboxListTile 复选框列表项详解
flutter
cn_mengbei1 小时前
Flutter for OpenHarmony 实战:Switch 开关按钮详解
flutter
奋斗的小青年!!1 小时前
OpenHarmony Flutter实战:打造高性能订单确认流程步骤条
flutter·harmonyos·鸿蒙
Coder_Boy_1 小时前
Flutter基础介绍-跨平台移动应用开发框架
spring boot·flutter
cn_mengbei1 小时前
Flutter for OpenHarmony 实战:Slider 滑块控件详解
flutter
行者961 小时前
Flutter跨平台骨架屏组件在鸿蒙系统上的实践与优化
flutter·harmonyos·鸿蒙
奋斗的小青年!!2 小时前
Flutter自定义图表跨平台适配OpenHarmony
flutter·harmonyos·鸿蒙
奋斗的小青年!!2 小时前
Flutter + OpenHarmony:高性能搜索组件深度优化实战解析
flutter·harmonyos·鸿蒙
小雨下雨的雨2 小时前
Flutter 框架跨平台鸿蒙开发 —— ListView 控件之高效列表渲染艺术
flutter·华为·harmonyos