flutter_onscreen_logger 2.0.1 copy "flutter_onscreen_logger: ^2.0.1" to clipboard
flutter_onscreen_logger: ^2.0.1 copied to clipboard

A Flutter package that allows you to display logs on the screen of your app for easier debugging.

Flutter On-Screen Logger #

Pub Package Pub Package GitHub Repo stars

A Flutter package that allows you to display logs on the screen of your app for easier debugging.

flutter_onscreen_logger

Features #

  • Log exceptions and errors in a user-friendly way.
  • Easily integrate with Dio for HTTP request logging.
  • Simple API for logging custom messages.
  • Customizable display options for logs.

Getting Started #

  1. Add the package to your pubspec.yaml file:

    dependencies:
      flutter_onscreen_logger: ^1.0.0
    
  2. Configure your main.dart to integrate the library:

    • Wrap your runApp() method in main() with runZonedGuarded() to handle errors globally.
    • In the onError() function, call the logger's onError() method.
    main() {
      runZonedGuarded(() async {
        WidgetsFlutterBinding.ensureInitialized();
    
        // No need for .init() anymore, it's handled automatically.
    
        //...other code...
           
        runApp(MyApp());
      }, (error, stack) {
        OnscreenLogger.onError();
      });
    }
    
    • Wrap your MaterialApp() widget with a Stack() and Directionality() widgets.
    • Add LoggerOverlayWidget() widget below it.
    • Note: You can conditionally show/hide the on-screen logger based on your use case. For example, you can set the widget to only show in debug mode (Recommended).
    Directionality(
       textDirection: TextDirection.ltr, 
       child: Stack(
           children: [
             MaterialApp(
               //...other material app properties...
               home: MyHomePage(title: 'MyApp'),
             ),
             if (BuildConfig.showOnScreenLogger) LoggerOverlayWidget(),
           ],
         ),
     );
    

Usage #

You can use the on-screen logger to log your own custom message throughout your project using the following methods:

e() - Log Errors #

Logs error messages with a red color.

OnScreenLog.e(
  title: 'Network Error',
  message: 'Unable to fetch data from server.',
);

i() - Log Info #

Logs info messages with a white color.

OnScreenLog.i(
  title: 'API Response Received!',
  message: '* API Response:\n$data',
);

s() - Log Success #

Logs success messages with a green color.

OnScreenLog.s(
  title: 'Login Successful',
  message: 'User has logged in successfully.',
);

w() - Log Warnings #

Logs warning messages with a orange color.

OnScreenLog.w(
  title: 'Low Disk Space',
  message: 'Disk space is running low, consider cleaning up.',
);

shareAll() - Share All Logs #

Allows you to share all the log entries that have been captured so far. This method will gather the logs and open a sharing interface for the user to share the log messages.

OnScreenLog.shareAll();

clearAll() - Clear All Logs #

Clears all log entries currently stored in the logger, effectively resetting the log data. This is useful if you want to start a new logging session or remove sensitive log data.

OnScreenLog.clearAll();
7
likes
150
points
89
downloads

Publisher

unverified uploader

Weekly Downloads

A Flutter package that allows you to display logs on the screen of your app for easier debugging.

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter, fluttertoast, get, intl, path_provider, share_plus

More

Packages that depend on flutter_onscreen_logger