flutter_vscode_logger 1.0.3

A Flutter logging package that integrates with VS Code for real-time log viewing. View structured logs directly in VS Code debug panel.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter_vscode_logger/flutter_vscode_logger.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();

  // Initialize the VS Code logger
  VscodeLogger.instance.init(
    appName: 'Example App',
    minLevel: LogLevel.debug,
    printToConsole: true,
  );

  logger.info('App starting...', tag: 'MAIN');

  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'VSCode Logger Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const LoggerDemoPage(),
    );
  }
}

class LoggerDemoPage extends StatefulWidget {
  const LoggerDemoPage({super.key});

  @override
  State<LoggerDemoPage> createState() => _LoggerDemoPageState();
}

class _LoggerDemoPageState extends State<LoggerDemoPage> {
  final TextEditingController _messageController = TextEditingController();
  final TextEditingController _tagController = TextEditingController();
  LogLevel _selectedLevel = LogLevel.info;
  int _counter = 0;

  @override
  void initState() {
    super.initState();
    logger.debug('LoggerDemoPage initialized', tag: 'LIFECYCLE');
  }

  @override
  void dispose() {
    _messageController.dispose();
    _tagController.dispose();
    logger.debug('LoggerDemoPage disposed', tag: 'LIFECYCLE');
    super.dispose();
  }

  void _sendLog() {
    final message = _messageController.text.isEmpty
        ? 'Test message #${++_counter}'
        : _messageController.text;
    final tag = _tagController.text.isEmpty ? null : _tagController.text;

    logger.log(message, level: _selectedLevel, tag: tag);

    _messageController.clear();

    ScaffoldMessenger.of(context).showSnackBar(
      SnackBar(
        content: Text('Sent: $message'),
        duration: const Duration(seconds: 1),
      ),
    );
  }

  void _sendMultipleLogs() {
    logger.debug('Starting batch log test...', tag: 'BATCH');

    for (int i = 1; i <= 10; i++) {
      Future.delayed(Duration(milliseconds: i * 100), () {
        logger.info('Batch log #$i', tag: 'BATCH', extra: {'index': i});
      });
    }

    logger.debug('Batch log test scheduled', tag: 'BATCH');
  }

  void _simulateError() {
    try {
      throw Exception('This is a simulated error!');
    } catch (e, stackTrace) {
      logger.error(
        'Caught an exception',
        tag: 'ERROR',
        error: e,
        stackTrace: stackTrace,
      );
    }
  }

  void _simulateFatal() {
    logger.fatal(
      'Critical system failure!',
      tag: 'FATAL',
      extra: {
        'timestamp': DateTime.now().toIso8601String(),
        'memoryUsage': '85%',
        'cpuUsage': '92%',
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text('VSCode Logger Demo'),
        actions: [
          IconButton(
            icon: const Icon(Icons.delete_outline),
            onPressed: () {
              VscodeLogger.instance.clearHistory();
              ScaffoldMessenger.of(context).showSnackBar(
                const SnackBar(content: Text('Logs cleared')),
              );
            },
            tooltip: 'Clear logs',
          ),
        ],
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Card(
              child: Padding(
                padding: const EdgeInsets.all(16.0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      'Custom Log',
                      style: Theme.of(context).textTheme.titleMedium,
                    ),
                    const SizedBox(height: 16),
                    TextField(
                      controller: _messageController,
                      decoration: const InputDecoration(
                        labelText: 'Message',
                        hintText: 'Enter log message...',
                        border: OutlineInputBorder(),
                      ),
                    ),
                    const SizedBox(height: 12),
                    TextField(
                      controller: _tagController,
                      decoration: const InputDecoration(
                        labelText: 'Tag (optional)',
                        hintText: 'e.g., API, UI, AUTH',
                        border: OutlineInputBorder(),
                      ),
                    ),
                    const SizedBox(height: 12),
                    DropdownButtonFormField<LogLevel>(
                      initialValue: _selectedLevel,
                      decoration: const InputDecoration(
                        labelText: 'Log Level',
                        border: OutlineInputBorder(),
                      ),
                      items: LogLevel.values.map((level) {
                        return DropdownMenuItem(
                          value: level,
                          child: Row(
                            children: [
                              Text(level.emoji),
                              const SizedBox(width: 8),
                              Text(level.name),
                            ],
                          ),
                        );
                      }).toList(),
                      onChanged: (value) {
                        setState(() {
                          _selectedLevel = value!;
                        });
                      },
                    ),
                    const SizedBox(height: 16),
                    SizedBox(
                      width: double.infinity,
                      child: FilledButton.icon(
                        onPressed: _sendLog,
                        icon: const Icon(Icons.send),
                        label: const Text('Send Log'),
                      ),
                    ),
                  ],
                ),
              ),
            ),
            const SizedBox(height: 16),
            Text(
              'Quick Actions',
              style: Theme.of(context).textTheme.titleMedium,
            ),
            const SizedBox(height: 8),
            Wrap(
              spacing: 8,
              runSpacing: 8,
              children: [
                ActionChip(
                  avatar: const Text('🔍'),
                  label: const Text('Debug'),
                  onPressed: () => logger.debug('Debug message', tag: 'QUICK'),
                ),
                ActionChip(
                  avatar: const Text('ℹ️'),
                  label: const Text('Info'),
                  onPressed: () => logger.info('Info message', tag: 'QUICK'),
                ),
                ActionChip(
                  avatar: const Text('⚠️'),
                  label: const Text('Warning'),
                  onPressed: () =>
                      logger.warning('Warning message', tag: 'QUICK'),
                ),
                ActionChip(
                  avatar: const Text('❌'),
                  label: const Text('Error'),
                  onPressed: _simulateError,
                ),
                ActionChip(
                  avatar: const Text('💀'),
                  label: const Text('Fatal'),
                  onPressed: _simulateFatal,
                ),
                ActionChip(
                  avatar: const Icon(Icons.burst_mode, size: 18),
                  label: const Text('Batch (10 logs)'),
                  onPressed: _sendMultipleLogs,
                ),
              ],
            ),
            const Spacer(),
            const Card(
              child: Padding(
                padding: EdgeInsets.all(16.0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      children: [
                        Icon(Icons.info_outline),
                        SizedBox(width: 8),
                        Text('How to use'),
                      ],
                    ),
                    SizedBox(height: 8),
                    Text(
                      '1. Install the Flutter Logger VS Code extension\n'
                      '2. Open VS Code with this Flutter project\n'
                      '3. Run this app in debug mode (F5)\n'
                      '4. Click buttons to send logs\n'
                      '5. View logs in VS Code\'s Flutter Logger panel',
                      style: TextStyle(fontSize: 13),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}