flutter_dev_toolkit 1.1.2
flutter_dev_toolkit: ^1.1.2 copied to clipboard
A powerful, modular in-app developer console for Flutter apps. Includes logs, network inspector, route tracker, performance tools, and plugin system.
Flutter Dev Toolkit #
π A modular in-app developer console for Flutter apps.
Track logs, API calls, navigation, performance, app state, and add your own plugins β all in real time, inside your app.
β¨ Features #
- β In-app Dev Console
- β Colored logs with filtering
- β
Network call inspector (
http
,dio
,retrofit
) - β Route stack and screen duration tracker
- β Export logs
- β Plugin system for custom tools
- β App State Inspector (Bloc support)
π Installation #
Add to your pubspec.yaml
:
dependencies:
flutter_dev_toolkit: ^latest_version
Then:
flutter pub get
π Getting Started #
Initialize the toolkit in main.dart
: #
void main() {
FlutterDevToolkit.init(
config: DevToolkitConfig(
disableBuiltInPlugins: [],
logger: DefaultLogger(),
enableRouteInterceptor: true,
enableNetworkInterceptor: true,
enableLifecycleInterceptor: true,
),
);
runApp(MyApp());
}
Add the Dev Console to your widget tree: #
MaterialApp(
builder: (context, child) {
return Stack(
children: [
child!,
const DevOverlay(),
],
);
},
home: const SplashScreen(),
navigatorObservers: [RouteInterceptor.instance],
);
π§© Plugins #
You can add custom developer tools as plugins:
class CounterPlugin extends DevToolkitPlugin {
@override
String get name => 'Counter';
@override
IconData get icon => Icons.exposure_plus_1;
@override
void onInit() {
debugPrint('CounterPlugin loaded!');
}
@override
Widget buildTab(BuildContext context) => Center(child: Text('Counter Tab'));
}
Register it before runApp
:
FlutterDevToolkit.registerPlugin(CounterPlugin());
π App State Inspector (Built-in) #
Inspect app-wide state transitions from supported frameworks.
β Current Support:
- Bloc via
DevBlocObserver
Usage:
// Add this line before initialising blocs
Bloc.observer = DevBlocObserver();
// Add this line after FlutterDevToolkit.init();
FlutterDevToolkit.registerPlugin(
AppStateInspectorPlugin([
BlocAdapter(), // built-in
]),
);
This shows:
- State source (Bloc type)
- Timestamp
- Copy to clipboard support
π€ Exporting #
You can export logs and routes via the Actions Tab.
π Custom Logs #
Log custom messages using:
FlutterDevToolkit.logger.log('Hello!');
FlutterDevToolkit.logger.log('Something went wrong', level: LogLevel.error);
πΌοΈ Screenshots #
Log Console
[screenshots/logs.png]Bloc Inspector β Overview
[screenshots/bloc_inspector.png]Device Info
[screenshots/device_info.png]Network Interceptor
[screenshots/network_interceptor.png]Route Tracker
[screenshots/route.png]π License #
MIT