FlutterFlow – Detecting Internet Connectivity

This post is a backup of a guide from the FlutterFlow community on detecting internet connectivity, along with some additional information on how to create the Action and how to use it.

Original source: https://community.flutterflow.io/c/community-custom-widgets/post/detecting-internet-connectivity-qDwV7wPZjCvIp4b

In this article, we’ll explore how to use the internet_connection_checker_plus package in FlutterFlow Community to detect internet connectivity in a Flutterflow application.

Steps:

1. Add Custom Action
2. Add the required Package
3. Write the Code
4. Test the code

1. Add a Custom Action by going to the Custom Code menu. Create a new action and give it a suitable name, such as checkInternetConnectivity.

Make sure to ENABLE and set the RETURN VALUE to Boolean. Check the image below.

2. Add the required package internet_connection_checker_plus to the pubspec.yaml dependencies. More information about the package can be found at https://pub.dev/packages/internet_connection_checker_plus

3. Write the following code:

// Automatic FlutterFlow imports
import '/backend/schema/structs/index.dart';
import '/backend/sqlite/sqlite_manager.dart';
import '/flutter_flow/flutter_flow_theme.dart';
import '/flutter_flow/flutter_flow_util.dart';
import '/custom_code/actions/index.dart'; // Imports other custom actions
import '/flutter_flow/custom_functions.dart'; // Imports custom functions
import 'package:flutter/material.dart';
// Begin custom action code
// DO NOT REMOVE OR MODIFY THE CODE ABOVE!

import 'package:internet_connection_checker_plus/internet_connection_checker_plus.dart';

Future<bool> internetConnection() async {
  // Add your function code here!
  bool result = await InternetConnection().hasInternetAccess;
  
  return result;
}

In this code, we create a function checkInternetConnectivity that checks the internet connectivity status and returns a boolean value = true if there’s internet access and false otherwise. Click on Save and don’t forget to Compile the code.

4. Finally, you can create an action flow in your FlutterFlow app to check the internet connection. In this example, I created a single conditional action and checked for the internet connection result.

You need to download the source code and test it on your emulator or physical device. The action will not work on the FlutterFlow emulator.

Hope this helps!