Show clean log messages in Flutter using logger

 

Logging is one of the crucial parts when comes to identifying the issues in your Flutter app. But in the current flutter SDK, identify the actual log messages is kind of hard. Because all the things are mix in together in the terminal and it hard to find logs added by ourself and the logs created by the application itself. Hope google will provide better log mechanism for a flutter. Until that, we have a solution, Logger.

 

Logger provides a nice, clean and easy way of adding the plugin to your Flutter application and it actually really beautiful. Without further delay let’s jump into the implementation

Implementation

First, add the plugin to your pubspec.yaml and press save to type flutter pub get to install the plugin to your flutter app

logger: ^0.7.0+2

Next import the plugin to the dart file where are you going to use this plugin.

import 'package:logger/logger.dart';

Next, create an instance of Logger class and call one of the logging methods to shows the actual logs. There are multiple log methods are available based on the conditions. Those are called as levels.

var logger = Logger();
logger.d("Debug message");
logger.e("Error message");
logger.i("Info message");
logger.v("Verbose message");
logger.w("Warning message");
logger.wtf("WTF message");

These are available levels and based on the level, it will change the colour and other related parameters.

verboseShow detail of logging than the usual one
debugUse when log for debugging purpose
infoLog info
warningLog warning messages  
errorLog error messages
wtfYou know it right?

Based on the method you used, the output will be like this.

Pretty nice right?

 

Logger class also provide flexibility to change the look and feel of the logs based on your preference. For that, we can simply use Prettyprint instance and it provides the following customization

colorsShow colorful logs
errorMethodCountNo of error methods need to show
printEmojisShow emoji in log
printTimeShow print time
lineLengthDivider length
methodCountNo of methods in Stacktrace

var logger = Logger(printer: PrettyPrinter(
      colors: true,
      errorMethodCount: 1,
      printEmojis: true,
      printTime: true,
      lineLength: 80,
      methodCount: 0
    ));

After the customization the output will be like this

Add custom style to Log

Adding more customization is also possible by adding a new implementation for LogPrinter. First, create a new class and extends LogPrinter and override the log method. When you call any of the log method this override method will be called. In here we can get an event as a parameter of the log method and it contains Level, Message, Error and Stacktrace.

class CustomLog extends LogPrinter{

  @override
  void log(LogEvent event) {
    println('${event.message}' );
  }
}

If you want to add emojit also you can get those from levelEmojis static map in PrettyPrinter class like this.

var emoji = PrettyPrinter.levelEmojis[event.level];

Filter the Logs

In case if you want to show certain logs only, you can add a custom filter to the logger. Create class and extend LogFilter and override the shouldLog method. In here if we return true it will show all logs. As an example, if we want to hide warning logs you have to modify the code like below.

class CustomFilter extends LogFilter{
  
  @override
  bool shouldLog(LogEvent event) {
    return event.level != Level.warning;
  }
}

Now you can use these methods as your need for your next flutter application to show logs in a nice and clean way.

x