[Flutter] ネットワーク接続状態を確認する

以下のパッケージを使います。
connectivity | Flutter Package

基本的な使い方

await Connectivity().checkConnectivityで接続状態(ConnectivityResult)を取得。
ConnectivityResultをConnectivityResult.mobile, ConnectivityResult.wifi, ConnectivityResult.noneと比較して状態を確認する。

import 'package:connectivity/connectivity.dart';

final ConnectivityResult connectivityResult = await Connectivity().checkConnectivity();
if (connectivityResult == ConnectivityResult.mobile) {
  // モバイルネットワークに接続中
} else if (connectivityResult == ConnectivityResult.wifi) {
  // WiFiに接続中
} else {
  // ネットワークに接続していない
}

if (connectivityResult == ConnectivityResult.none) {
  // ネットワークに接続していない
}

FutureBuilderと併用

FutureBuilderと併用することで、ネットワーク状態に応じて表示する内容を変えることができる。

import 'package:connectivity/connectivity.dart';

~~~
  Widget build(BuildContext context) {
    return FutureBuilder(
      future: Connectivity().checkConnectivity(),
      builder: _builder,
    );
  }

  Widget _builder(BuildContext context, AsyncSnapshot<ConnectivityResult> snapshot) {
    if (snapshot.hasData) {
      final bool noConnectivity = snapshot.data == ConnectivityResult.none;
      if (noConnectivity) {
        return Text('No connectivity.');
      } else {
        return Text('Have connectivity.');
    }
    return const CircularProgressIndicator();
  }

FutureBuilderだと一回しか判定されないので、動的に判定したい場合は変更を検知できるっぽい。

subscription = Connectivity().onConnectivityChanged.listen((ConnectivityResult result) {
})