How to do popup what will be visible when no TCP connection is established and closes after it connects?

Question

I'm totally new to flutter. I need to do a simple app that fetches a few data from a device over wifi (the device acts as AP).
I want to have some popup shown, when the device is not connected, that will show "not connected" and have a button to open wifi settings (just call it from app_settings)
And it shall close this popup when the connection is established.
I think I will reuse requests that were used for AJAX, so just a simple web request with a plaintext response of a few numbers. The target device is on fixed IP on its own network. So I do not need any more detection than just sending a request and seeing if it returns. And when that connection is successful, I want to fetch that data a few times a second if possible.

Answer 1

There is a package called connectivity_plus that checks your connectivity. Usage:

import 'package:connectivity_plus/connectivity_plus.dart';

var connectivityResult = await (Connectivity().checkConnectivity());
if (connectivityResult == ConnectivityResult.mobile) {
  // I am connected to a mobile network.
} else if (connectivityResult == ConnectivityResult.wifi) {
  // I am connected to a wifi network.
}

If you'd like to make a call to a web service request consider using the http package with a timeout() to check if the service is available.

import 'package:http/http.dart' as http;

final response = await http.get(Uri.parse("myurl.com/MyService")).timeout(const Duration(seconds: 4));

If after 4 seconds the function did not return anything (or complete), it will throw a TimeoutException, or you can specify what to do as a parameter.

Read more here > Documentation