A Flutter package for inspecting widgets
inspector
A Flutter package for inspecting widgets. Also comes with an eyedropper functionality. Useful for debugging widgets and for QA testing.
Supports keyboard shortcuts if you’re using a physical keyboard.
Inspired by inspx.
WIP
Warning, the development of this package is still in progress and some things may break your app.
Features
- Color picker
- Size inspection
- Padding inspection
- Keyboard shortcuts
-
BorderRadius
inspection -
TextStyle
inspection
Installing
Add the dependency:
$ flutter pub add inspector
Import the package:
import 'package:inspector/inspector.dart';
Wrap MaterialApp.builder
or WidgetsApp.builder
with Inspector
:
MaterialApp(
home: ExampleApp(),
builder: (context, child) => Inspector(child: child!), // Wrap [child] with [Inspector]
),
Optionally, you can pass isEnabled
to the Inspector
to disable it. By default, the inspector is disabled when kReleaseMode == true
.
Usage
If the inspector is enabled, then a panel appears on the right side of the screen,
with buttons to toggle size inspection and the color picker.
It’s quite straightforward to use, just tap on the widget that you want to measure
or tap on the pixel to get its color.
You can also use keyboard shortcuts – Shift
will toggle the color picker, and
Alt
or Cmd
will toggle the widget inspector.
Examples
Contact me
Feel free to contact me at:
E-mail: kk.erzhan@gmail.com