flutter_dev_tools_overlay 1.0.3 copy "flutter_dev_tools_overlay: ^1.0.3" to clipboard
flutter_dev_tools_overlay: ^1.0.3 copied to clipboard

PlatformAndroid

A lightweight debug overlay for Flutter apps with logs, network monitoring, memory usage, and FPS tools.

Flutter Debug Overlay #

A lightweight in-app debug overlay for Flutter apps with logs, request tracking, memory usage, device info, and performance tools.

This package is useful when you want quick diagnostics directly inside the running app without constantly switching to external tooling.

Features #

  • Draggable floating debug launcher
  • Modern tabbed debug panel UI
  • In-app log viewer
  • Network request logger for dio
  • Memory usage monitor
  • Performance overlay panel
  • Device information tab
  • Shake gesture to open the panel

Installation #

Add the package to your pubspec.yaml:

dependencies:
  flutter_dev_tools_overlay: ^1.0.2

Then run:

flutter pub get

Basic Usage #

Wrap your app with DebugOverlay:

import 'package:flutter/material.dart';
import 'package:flutter_dev_tools_overlay/flutter_debug_overlay.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DebugOverlay(
        child: const HomePage(),
      ),
    );
  }
}

Generate Logs #

Use the package logger so entries appear inside the overlay:

DebugLogger.log('User tapped checkout button');

Track Network Requests #

Attach the interceptor to your Dio client:

import 'package:dio/dio.dart';
import 'package:flutter_dev_tools_overlay/debug_network_interceptor.dart';

final dio = Dio()
  ..interceptors.add(DebugNetworkInterceptor());

Requests captured through this interceptor will appear in the Network tab.

Open The Panel #

You can open the debug panel in two ways:

  • Tap the floating debug button
  • Shake the device deliberately

The shake gesture now uses a stricter threshold to avoid accidental opens during normal phone movement.

Example #

See the sample app in example/lib/main.dart.

Notes #

  • The in-app Logs tab only shows messages sent through DebugLogger.log(...)
  • Network logging currently targets dio
  • This package is meant for development and QA workflows

License #

MIT

5
likes
155
points
113
downloads

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

A lightweight debug overlay for Flutter apps with logs, network monitoring, memory usage, and FPS tools.

Repository (GitHub)
View/report issues

Topics

#debug #overlay #logging #network #performance

License

MIT (license)

Dependencies

device_info_plus, dio, flutter, package_info_plus, sensors_plus

More

Packages that depend on flutter_dev_tools_overlay