agora_debug_panel

A lightweight Flutter debug panel for collecting and inspecting Agora RTC runtime events, connection state, audio stats, network quality, errors, and debug logs.

Features

  • Runtime enable switch for turning collection on or off.
  • Built-in debug panel page and slide-in overlay.
  • Connection, audio, network quality, RTC stats, local audio stats, remote audio stats, volume, event, and debug log sections.
  • Capped event, debug log, and remote audio user buffers.
  • Snapshot copying as formatted JSON.
  • Framework-agnostic data APIs that can be adapted to any Agora RTC integration.

Installation

Add the package to your Flutter app:

dependencies:
  agora_debug_panel:
    path: packages/agora_debug_panel

Then import it:

import 'package:agora_debug_panel/agora_debug_panel.dart';

Quick Start

Record runtime data through the shared controller:

final controller = AgoraDebugPanelController.instance;

controller.configure(enable: true);

controller.updateConnection(
  roomId: 'room-1',
  channelId: 'room-1',
  localUid: '1001',
  connectionState: 'connected',
  markJoined: true,
);

controller.updateNetworkQuality({
  'txQuality': 'good',
  'rxQuality': 'good',
});

controller.recordEvent(
  'join_success',
  details: {
    'roomId': 'room-1',
    'uid': 1001,
  },
);

controller.recordError(
  code: 'rtc_error',
  message: 'Something went wrong',
);

Open the panel as a page:

Navigator.of(context).push(
  MaterialPageRoute<void>(
    builder: (_) => const AgoraDebugPanelPage(),
  ),
);

Or show it as an overlay:

AgoraDebugPanelOverlay.toggle(context);

API

AgoraDebugPanelController

AgoraDebugPanelController.instance is the default shared controller.

Common methods:

  • configure(enable: bool) controls whether new data is collected.
  • clear() resets the current snapshot while keeping the enable state.
  • updateConnection(...) updates room, channel, uid, connection, role, publish, and audio state fields.
  • updateNetworkQuality(Map<String, Object?> quality) updates network quality data.
  • updateRtcStats(Map<String, Object?> stats) updates RTC stats.
  • updateLocalAudioStats(Map<String, Object?> stats) updates local audio stats.
  • updateRemoteAudioStats(String uid, Map<String, Object?> stats) updates remote audio stats for a user.
  • updateAudioVolumes(Map<String, double> volumes) updates audio volume levels.
  • recordEvent(String name, {String? message, Map<String, Object?> details}) records a normal event.
  • recordDebugLog(String name, {String? message, Map<String, Object?> details}) records a debug log.
  • recordError({required String code, required String message, Map<String, Object?> details}) records an error event.

AgoraDebugPanelPage

AgoraDebugPanelPage is a full-screen Flutter page for inspecting the current controller state.

AgoraDebugPanelOverlay

AgoraDebugPanelOverlay shows or hides the panel in the current app overlay:

AgoraDebugPanelOverlay.show(context);
AgoraDebugPanelOverlay.hide();
AgoraDebugPanelOverlay.toggle(context);

AgoraDebugPanelState

AgoraDebugPanelState stores the current snapshot and can be exported as JSON:

final json = AgoraDebugPanelController.instance.state.value.toPrettyJson();

Other Information

This package does not require a direct dependency on agora_rtc_engine. Pass Agora callback data into the controller or wrap it with an app-specific adapter. This keeps the debug panel reusable across different Agora integration styles.

Libraries

agora_debug_panel