dialog_builder 1.0.0 copy "dialog_builder: ^1.0.0" to clipboard
dialog_builder: ^1.0.0 copied to clipboard

A stunning, fully dynamic, and customizable dialog package for Flutter apps, natively supporting Android and iOS with professional-level UI alerts.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:iconly/iconly.dart';
import 'package:dialog_builder/dialog_builder.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Dialog Builder Showcase',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const DialogDemoScreen(),
    );
  }
}

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

  @override
  State<DialogDemoScreen> createState() => _DialogDemoScreenState();
}

class _DialogDemoScreenState extends State<DialogDemoScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey[100],
      appBar: AppBar(
        title: Text('dialog_builder',
            style: GoogleFonts.outfit(
                fontWeight: FontWeight.bold, letterSpacing: 1.2)),
        backgroundColor: Theme.of(context).colorScheme.primary,
        foregroundColor: Colors.white,
        centerTitle: true,
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 24.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            _buildSectionHeader('Dialog Builder Types'),
            const SizedBox(height: 12),
            _buildDescription(
                'Beautiful pre-configured dialog builder variants ready for use.'),
            const SizedBox(height: 16),
            ..._buildStandardExamples(context),
            const SizedBox(height: 48),
          ],
        ),
      ),
    );
  }

  Widget _buildSectionHeader(String title) {
    return Text(
      title,
      style: GoogleFonts.outfit(
        fontSize: 20,
        fontWeight: FontWeight.w800,
        color: Colors.black87,
      ),
    );
  }

  Widget _buildDescription(String text) {
    return Text(
      text,
      style: GoogleFonts.outfit(fontSize: 14, color: Colors.grey[700]),
    );
  }

  List<Widget> _buildStandardExamples(BuildContext context) {
    return [
      _buildCard(
        title: 'Success Dialog',
        icon: IconlyBold.tick_square,
        color: Colors.green,
        onTap: () => DialogBuilder.instance.show(
          context: context,
          type: DialogType.success,
          config: const DialogConfig(
            title: 'Payment Successful',
            description:
                'Your transaction was completed successfully. A receipt has been sent to your email.',
            primaryButtonText: 'Great',
          ),
        ),
      ),
      _buildCard(
        title: 'Error Dialog',
        icon: IconlyBold.danger,
        color: Colors.red,
        onTap: () => DialogBuilder.instance.show(
          context: context,
          type: DialogType.error,
          config: DialogConfig(
              title: 'Connection Failed',
              description:
                  'We could not reach the server. Please check your internet connection.',
              primaryButtonText: 'Retry',
              secondaryButtonText: 'Cancel',
              onPrimaryAction: () {
                Navigator.pop(context); // Custom logic
              }),
        ),
      ),
      _buildCard(
        title: 'Warning Dialog',
        icon: IconlyBold.danger,
        color: Colors.orange,
        onTap: () => DialogBuilder.instance.show(
          context: context,
          type: DialogType.warning,
          config: const DialogConfig(
            title: 'Delete Account?',
            description:
                'Are you sure you want to delete this? This action cannot be undone.',
            primaryButtonText: 'Delete',
            secondaryButtonText: 'Keep',
          ),
        ),
      ),
      _buildCard(
        title: 'Info / Confirmation Dialog',
        icon: IconlyBold.info_square,
        color: Colors.blue,
        onTap: () => DialogBuilder.instance.show(
          context: context,
          type: DialogType.info,
          config: const DialogConfig(
            title: 'Update Available',
            description: 'Version 2.0.1 is ready to be installed.',
            primaryButtonText: 'Update Now',
            secondaryButtonText: 'Remind me later',
          ),
        ),
      ),
      _buildCard(
        title: 'Loading Dialog (Dismissible)',
        icon: IconlyBold.setting,
        color: Colors.blueGrey,
        onTap: () async {
          DialogBuilder.instance.show(
            context: context,
            type: DialogType.loading,
            config: const DialogConfig(
              title: 'Processing...',
              description: 'Please wait, we are syncing data.',
              isDismissible: true, // User can click outside to close
            ),
          );
        },
      ),
    ];
  }

  Widget _buildCard({
    required String title,
    required IconData icon,
    required Color color,
    required VoidCallback onTap,
  }) {
    return Container(
      margin: const EdgeInsets.only(bottom: 16.0),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20),
        boxShadow: [
          BoxShadow(
            color: color.withValues(alpha: 0.15),
            blurRadius: 20,
            offset: const Offset(0, 8),
          ),
          BoxShadow(
            color: Colors.black.withValues(alpha: 0.03),
            blurRadius: 10,
            offset: const Offset(0, 4),
          ),
        ],
      ),
      child: Material(
        color: Colors.transparent,
        child: InkWell(
          borderRadius: BorderRadius.circular(20),
          onTap: onTap,
          highlightColor: color.withValues(alpha: 0.05),
          splashColor: color.withValues(alpha: 0.1),
          child: Padding(
            padding:
                const EdgeInsets.symmetric(vertical: 20.0, horizontal: 20.0),
            child: Row(
              children: [
                Container(
                  padding: const EdgeInsets.all(16),
                  decoration: BoxDecoration(
                    color: color.withValues(alpha: 0.1),
                    borderRadius: BorderRadius.circular(16),
                    border: Border.all(
                      color: color.withValues(alpha: 0.2),
                      width: 1.5,
                    ),
                  ),
                  child: Icon(icon, color: color, size: 28),
                ),
                const SizedBox(width: 20),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        title,
                        style: GoogleFonts.outfit(
                          fontSize: 18,
                          fontWeight: FontWeight.w700,
                          letterSpacing: 0.3,
                          color: Colors.black87,
                        ),
                      ),
                      const SizedBox(height: 4),
                      Text(
                        "Tap to preview dialog",
                        style: GoogleFonts.outfit(
                          fontSize: 13,
                          color: Colors.grey.shade500,
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  padding: const EdgeInsets.all(8),
                  decoration: BoxDecoration(
                    color: Colors.grey.shade100,
                    shape: BoxShape.circle,
                  ),
                  child: Icon(
                    Icons.arrow_forward_ios_rounded,
                    size: 16,
                    color: Colors.grey.shade600,
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
0
likes
160
points
20
downloads

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

A stunning, fully dynamic, and customizable dialog package for Flutter apps, natively supporting Android and iOS with professional-level UI alerts.

Repository (GitHub)
View/report issues

License

MIT (license)

Dependencies

flutter, google_fonts, iconly

More

Packages that depend on dialog_builder