ume_kit_monitor 2.0.7

use ume_kit_monitor to show more infomation contain log,page,curl,response,json

UME Kit Monitor Guide

English | 中文 | Deutsch | Português | 日本語 | 한국어

UME Kit Monitor is a Flutter debugging toolkit that provides network request logging, console output, page tracking and more debugging features. It integrates with flutter_ume_plus to provide an easy-to-use debugging interface.

I. Installation & Setup

1. Add dependencies to pubspec.yaml:

dependencies:
  ume_kit_monitor: ^2.0.5

dev_dependencies:
  flutter_ume_plus: ^4.0.0
  flutter_ume_kit_ui_plus: ^4.0.0 
  flutter_ume_kit_device_plus: ^4.0.0
  flutter_ume_kit_perf_plus: ^4.0.0
  flutter_ume_kit_show_code_plus: ^4.0.0
  flutter_ume_kit_console_plus: ^4.0.0

copied to clipboard

2. Register plugins in main.dart:

void main() {
  PluginManager.instance
    ..register(const MonitorPlugin())
    ..register(const MonitorActionsPlugin());
    
  runApp(const UMEWidget(
    enable: true, 
    child: MyApp()
  ));
}

copied to clipboard

3. Initialize Monitor in your app:

void initState() {
  super.initState();
  Monitor.init(
    context,
    actions: [
      MonitorActionWidget(
        title: "Debug", 
        onTap: () { /* ... */ }
      ),
      // Add more action buttons...
    ],
  );
}

copied to clipboard

II. Core Features

1. Console Logging

// Output logs to console panel
Monitor.instance.putsConsole(["Log message"]); 

copied to clipboard

2. Network Request Logging

• Automatically records network requests in curl format for easy debugging
• View and copy curl commands from the Curl panel

3. JSON Response Viewer

// Log and view JSON responses with collapsible tree view
Monitor.instance.put('Response', 'api_name\n$jsonString');

copied to clipboard

4. Page Tracking

// Automatically track current page/route
Monitor.instance.putPage("CurrentPage");

copied to clipboard

5. Custom Tag Monitoring

// Create custom monitoring panels
Monitor.instance.put('CustomTag', 'Custom debug info');

copied to clipboard

6. GetX Lifecycle Monitoring

• Automatically tracks GetX widget lifecycles when enabled

III. API Reference

1. Monitor Class

// Initialization
Monitor.init(context, actions: [...]);

// Core logging methods
Monitor.instance.put(String tag, String content)
Monitor.instance.puts(String tag, List<String> contents) 
Monitor.instance.putsConsole(List<String> contents)
Monitor.instance.putPage(String page)
Monitor.instance.putCurl(String curl)

// Clear logs
Monitor.instance.clear(String tag)

copied to clipboard

2. MonitorActionWidget

MonitorActionWidget({
  required String title,
  required VoidCallback onTap,
})

copied to clipboard

IV. Usage Example

void main() {
  PluginManager.instance
    ..register(const MonitorPlugin())
    ..register(const MonitorActionsPlugin());

  runApp(const UMEWidget(
    enable: true,
    child: MyApp()
  ));
}

class _MyHomePageState extends State<MyHomePage> {
  @override 
  void initState() {
    super.initState();
    
    // Initialize monitor
    Monitor.init(
      context,
      actions: [
        MonitorActionWidget(
          title: "Debug",
          onTap: () { /* ... */ }
        ),
      ],
    );

    // Log some data
    Monitor.instance.putsConsole(["App started"]);
    Monitor.instance.put('CustomTag', 'Debug info');
    Monitor.instance.putPage('HomePage');
  }
}

copied to clipboard

V. Important Notes

1. Monitor is disabled by default in release builds
2. Maximum log entries per tag is limited to 20
3. JSON responses are automatically formatted and collapsible
4. Network requests containing "ac=last_msg" are filtered out