GitLocker: The Coding Marketplace

Description:

connection notifier

Connection Notifier #
A simple way to notify your user about the connection status as well as providing simple tools that help tracking the internet connection status.
Gallery #

ConnectionNotifier #
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);

@override
Widget build(BuildContext context) {
/// Wrap [MaterialApp] with [ConnectionNotifier], and that is it!
return ConnectionNotifier(
child: MaterialApp(
title: 'Connection Notifier Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(),
),
);
}
}
copied to clipboard
ConnectionNotificationOptions parameters catalog

Option
Description
Type
Default Value
Required

child
Child widget, typically [MaterialApp] or [CupertinoApp]
Widget
-
Yes

alignment
Alignment of the connection notification
AlignmentGeometry
AlignmentDirectional.topCenter
No

pauseConnectionListenerWhenAppInBackground
To pause listening to changes while app in background
bool
false
No

height
Height of the connection notification
double?
twice top padding
No

width
Width of the connection notification
double?
double.infinity
No

borderRadius
Border radius of the connection notification
BorderRadiusGeometry?
null
No

connectedBackgroundColor
Background color of the connection notification in connected state
Color?
Colors.green
No

disconnectedBackgroundColor
Background color of the connection notification in disconnected state
Color?
Colors.red
No

connectedDuration
Duration of the connection notification in connected state before it's auto dismissing
Duration?
2 seconds
No

disconnectedDuration
Duration of the connection notification in disconnected state before it's auto dismissing
Duration?
infinity
No

overlayAnimationType
Overlay animation type of the connection notification
OverlayAnimationType
OverlayAnimationType.fadeAndSlide
No

animationCurve
Animation curve of the connection notification
Curve?
Curves.fastOutSlowIn
No

animationDuration
Animation duration of the connection notification
Duration?
300 milliseconds
No

connectedContent
Content of connection notification in connected state. if this is given, it will override all the specific parameters for the default content in connected state, typically a [Row] widget
Widget?
null
No

disconnectedContent
Content of connection notification in disconnected state. if this is given, it will override all the specific parameters for the default content in disconnected state, typically a [Row] widget
Widget?
null
No

shouldAlwaysPullContentDownOnTopAlignment
If the content of the connection notification should be pulled down in case of top alignment and [height] is grater than twice of top padding only, to test it visually just set a [height] that is bigger than twice of top padding (300 for example) and toggle it between [true] and [false] to see it's effect
bool
true
No

hasIndicationIcon
If the default content has an indication icon
bool
true
No

textAndIconSeparationWidth
Distance between text and icon in default content
double?
10
No

connectedText
Text of the default content of the connection notification in connected state
String?
'Back Online'
No

disconnectedText
Text of the default content of the connection notification in disconnected state
String?
'Retrying'
No

connectedTextStyle
Text style of the default content of the connection notification in connected state
String?
null
No

disconnectedTextStyle
Text style of the default content of the connection notification in disconnected state
String?
null
No

connectedIcon
Icon of the default content of the connection notification in connected state
Icon?
Icon widget with [Icons.check]
No

disconnectedIcon
Icon of the default content of the connection notification in disconnected state
Icon?
Circular progress indicator
No

iconBoxSideLength
Length of each side (height and width) of the [SizedBox] that wraps the [Icon] of the default content of the connection notification
double?
10
No

connectedConnectionNotification
This is useful if you want to override default connection notification with a custom widget in connected state and it will use the alignment and animation
Widget?
null
No

disconnectedConnectionNotification
This is useful if you want to override default connection notification with a custom widget in disconnected state and it will use the alignment and animation
Widget?
null
No

ConnectionNotifierToggler
If you want to toggle between some widgets automatically based on connection state.
ConnectionNotifierToggler(
onConnectionStatusChanged: (connected) {
/// that means it is still in the initialization phase.
if (connected == null) return;
print(connected);
},
connected: Center(
key: UniqueKey(),
child: const Text(
'Connected',
style: TextStyle(
color: Colors.green,
fontSize: 48,
),
),
),
disconnected: Center(
key: UniqueKey(),
child: const Text(
'Disconnected',
style: TextStyle(
color: Colors.red,
fontSize: 48,
),
),
),
);

copied to clipboard

LocalConnectionNotifier
If you want to show the connection notification for a specific screen only.
class LocalConnectionNotificationScreen extends StatelessWidget {
const LocalConnectionNotificationScreen({super.key});

@override
Widget build(BuildContext context) {
return LocalConnectionNotifier(
connectionNotificationOptions: const ConnectionNotificationOptions(
alignment: Alignment.bottomCenter,
),
child: Scaffold(
appBar: AppBar(
title: const Text('Local connection Notifier Demo'),
),
),
);
}
}

copied to clipboard

ConnectionNotifierTools
Tools that make it very easy to check on the internet connection status ANY WHERE inside your project.
At first you need to initialize it before using it's data. To do that, simply call this:
await ConnectionNotifierTools.initialize();
copied to clipboard
Then you can use these tools as you want:
/// A boolean that has the latest update about the connection status.
ConnectionNotifierTools.isConnected;

/// A broadcast stream that emits on every change in the connection status.
ConnectionNotifierTools.onStatusChange;
copied to clipboard
And that's it!
Attribution #
This package depends on the following (Big Thanks):
internet_connection_checker
rxdart
License #
MIT License