flutter_voice_otp 1.0.2

flutter_voice_otp: ^1.0.2 copied to clipboard

example/lib/main.dart

import 'package:flutter/material.dart';

import 'demos/auto_completion_demo.dart';
import 'demos/basic_demo.dart';
import 'demos/custom_styling_demo.dart';
import 'demos/manual_input_demo.dart';
import 'demos/shared_controller_demo.dart';
import 'demos/validation_demo.dart';
import 'demos/voice_input_demo.dart';

void main() {
  runApp(const VoiceOtpExampleApp());
}

/// Root widget for the flutter_voice_otp example application.
///
/// Presents a home screen linking to seven focused demos, each isolating
/// one capability of [VoiceOtpField] as requested in the package spec:
/// basic usage, custom styling, validation, voice input, manual keyboard
/// input, shared controller usage, and auto-completion callbacks.
class VoiceOtpExampleApp extends StatelessWidget {
  const VoiceOtpExampleApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'flutter_voice_otp Demo',
      theme: ThemeData(
        colorSchemeSeed: const Color(0xFF2962FF),
        brightness: Brightness.light,
        useMaterial3: true,
      ),
      darkTheme: ThemeData(
        colorSchemeSeed: const Color(0xFF82B1FF),
        brightness: Brightness.dark,
        useMaterial3: true,
      ),
      themeMode: ThemeMode.system,
      home: const HomeScreen(),
    );
  }
}

class _DemoEntry {
  const _DemoEntry(this.title, this.subtitle, this.builder);
  final String title;
  final String subtitle;
  final WidgetBuilder builder;
}

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

  @override
  Widget build(BuildContext context) {
    final demos = <_DemoEntry>[
      _DemoEntry(
        '1. Basic Voice OTP Field',
        'Minimal setup with default styling',
        (_) => const BasicDemo(),
      ),
      _DemoEntry(
        '2. Custom Styling',
        'Fully customized colors, radius, spacing, size',
        (_) => const CustomStylingDemo(),
      ),
      _DemoEntry(
        '3. Validation',
        'Built-in and custom validators with error borders',
        (_) => const ValidationDemo(),
      ),
      _DemoEntry(
        '4. Voice Input',
        'Fill the OTP by speaking digits aloud',
        (_) => const VoiceInputDemo(),
      ),
      _DemoEntry(
        '5. Manual Keyboard Input',
        'Type the OTP using the device keyboard',
        (_) => const ManualInputDemo(),
      ),
      _DemoEntry(
        '6. Shared TextEditingController',
        'Read/write the OTP value from outside the widget',
        (_) => const SharedControllerDemo(),
      ),
      _DemoEntry(
        '7. Auto-Completion Callback',
        'React the instant the OTP is fully entered',
        (_) => const AutoCompletionDemo(),
      ),
    ];

    return Scaffold(
      appBar: AppBar(title: const Text('flutter_voice_otp')),
      body: ListView.separated(
        padding: const EdgeInsets.symmetric(vertical: 8),
        itemCount: demos.length,
        separatorBuilder: (_, __) => const Divider(height: 1),
        itemBuilder: (context, index) {
          final demo = demos[index];
          return ListTile(
            title: Text(demo.title),
            subtitle: Text(demo.subtitle),
            trailing: const Icon(Icons.chevron_right),
            onTap: () => Navigator.of(context).push(
              MaterialPageRoute(builder: demo.builder),
            ),
          );
        },
      ),
    );
  }
}