flutter_devlens 0.1.3

A premium, production-quality developer debugging toolkit for Flutter. Features glassmorphism UI, network inspector (Dio), route tracker, and custom logger.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flutter_devlens/flutter_devlens.dart';
import 'package:dio/dio.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  DevLens.initialize();
  runApp(const DevLensShowcaseApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'DevLens Showcase',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(
          seedColor: const Color(0xFF6366F1),
          brightness: Brightness.light,
        ),
        useMaterial3: true,
      ),
      navigatorObservers: [DevLens.routeObserver],
      home: const DashboardScreen(),
    );
  }
}

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

  @override
  State<DashboardScreen> createState() => _DashboardScreenState();
}

class _DashboardScreenState extends State<DashboardScreen> {
  final Dio _dio = Dio();

  @override
  void initState() {
    super.initState();
    _dio.interceptors.add(DevLensDioInterceptor());
    _dio.options.baseUrl = 'https://jsonplaceholder.typicode.com';

    DevLens.log('Application initialized successfully');
    DevLens.log('Analytics session started: v1.0.4');
  }

  Future<void> _runDemoSuite() async {
    DevLens.log('Running automated demo suite...');
    await _dio.get('/posts/1');
    DevLens.log('Fetched post data: ID 1');
    DevLens.warn('Slow network detected (Simulated)');
    try {
      await _dio.get('/invalid/status/500');
    } catch (_) {}
    DevLens.error('Failed to sync background tasks');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFFF8FAFC),
      appBar: AppBar(
        title: const Text('DevLens Deluxe',
            style: TextStyle(fontWeight: FontWeight.w800)),
        backgroundColor: Colors.white,
        elevation: 0,
        actions: [
          IconButton(
            onPressed: _runDemoSuite,
            icon: const Icon(Icons.play_circle_outline_rounded,
                color: Color(0xFF6366F1)),
          ),
          const SizedBox(width: 8),
        ],
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.all(20),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            _buildStatGrid(),
            const SizedBox(height: 24),
            const Text('QUICK ACTIONS',
                style: TextStyle(
                    fontSize: 12,
                    fontWeight: FontWeight.w800,
                    color: Colors.black38,
                    letterSpacing: 1)),
            const SizedBox(height: 16),
            _buildActionCard(
              'Network Inspector',
              'Monitor real-time Dio traffic with full payload visibility.',
              Icons.hub_rounded,
              const Color(0xFF6366F1),
              onTap: () => _dio.get('/users'),
            ),
            _buildActionCard(
              'Contextual Logging',
              'Structured logs with severity levels and timestamps.',
              Icons.notes_rounded,
              const Color(0xFFF59E0B),
              onTap: () => DevLens.warn('User performed unauthorized action'),
            ),
            _buildActionCard(
              'Route Tracking',
              'View the navigation timeline of your application.',
              Icons.alt_route_rounded,
              const Color(0xFF10B981),
              onTap: () => Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => const SettingsScreen(),
                  settings: const RouteSettings(name: 'SettingsScreen'),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildStatGrid() {
    return Row(
      children: [
        _buildStatCard(
            'Active Users', '1.2k', Icons.people_outline, Colors.blue),
        const SizedBox(width: 12),
        _buildStatCard('API Health', '99.8%', Icons.bolt, Colors.green),
      ],
    );
  }

  Widget _buildStatCard(
      String label, String value, IconData icon, Color color) {
    return Expanded(
      child: Container(
        padding: const EdgeInsets.all(16),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(16),
          border: Border.all(color: Colors.black.withValues(alpha: 0.05)),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Icon(icon, color: color, size: 20),
            const SizedBox(height: 12),
            Text(value,
                style:
                    const TextStyle(fontSize: 20, fontWeight: FontWeight.w800)),
            Text(label,
                style: const TextStyle(fontSize: 12, color: Colors.black38)),
          ],
        ),
      ),
    );
  }

  Widget _buildActionCard(
      String title, String subtitle, IconData icon, Color color,
      {VoidCallback? onTap}) {
    return Container(
      margin: const EdgeInsets.only(bottom: 12),
      child: InkWell(
        onTap: onTap,
        borderRadius: BorderRadius.circular(16),
        child: Container(
          padding: const EdgeInsets.all(16),
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(16),
            border: Border.all(color: Colors.black.withValues(alpha: 0.05)),
          ),
          child: Row(
            children: [
              Container(
                padding: const EdgeInsets.all(12),
                decoration: BoxDecoration(
                    color: color.withValues(alpha: 0.1),
                    borderRadius: BorderRadius.circular(12)),
                child: Icon(icon, color: color, size: 24),
              ),
              const SizedBox(width: 16),
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(title,
                        style: const TextStyle(
                            fontWeight: FontWeight.bold, fontSize: 15)),
                    const SizedBox(height: 2),
                    Text(subtitle,
                        style: const TextStyle(
                            fontSize: 12, color: Colors.black45)),
                  ],
                ),
              ),
              const Icon(Icons.chevron_right_rounded, color: Colors.black12),
            ],
          ),
        ),
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Settings')),
      body: Center(
        child: ElevatedButton(
          onPressed: () => Navigator.pop(context),
          child: const Text('Return to Dashboard'),
        ),
      ),
    );
  }
}