dialog_utils 0.0.3 copy "dialog_utils: ^0.0.3" to clipboard
dialog_utils: ^0.0.3 copied to clipboard

Reusable Flutter dialogs with theme and subclass customization.

dialog_utils #

Reusable Flutter dialogs with application-wide theme support and overridable styles and icons.

Features #

  • Error, success, confirmation, information, and waiting dialogs
  • DialogUtilsStyle integration with ThemeData.extensions
  • Configurable text styles, colors, icon sizes, button sizes, shape, and barrier opacity
  • Subclass hooks for replacing styles and icon widgets
  • A reusable DialogUtils() factory instance

Available Dialogs #

  • showErrorDlg shows an error with OK and optional cancel actions.
  • showSuccessDlg shows a success message with OK and optional cancel actions.
  • showConfirmDlg shows cancel and confirm actions and returns the choice.
  • showInfoDlg shows an informational message with OK and optional cancel actions.
  • showWaitingDlg displays progress while an asynchronous FutureResult runs.

Installation #

Add the package to pubspec.yaml:

dependencies:
  dialog_utils: ^0.0.2

Then run flutter pub get and import the public entrypoint:

import 'package:dialog_utils/dialog_utils.dart';

Examples #

Error, success, and information dialogs #

The following example displays an error dialog:

DialogUtils().showErrorDlg(
  context,
  title: 'Error',
  content: 'Something went wrong.',
);

okButtonText and cancelButtonText are optional and can be used to customize the buttons of error, success, and information dialogs. The cancel button is shown only when cancelButtonText is set.

showSuccessDlg and showInfoDlg are called in the same way. All dialog functions can be called directly without creating a global DialogUtils instance.

Confirmation dialog #

The following example displays a confirmation dialog and handles the user's choice:

final confirmed = await DialogUtils().showConfirmDlg(
  context,
  title: 'Delete item?',
  content: 'This action cannot be undone.',
  confirmButtonText: 'Delete',
);

if (confirmed) {
  // Delete the item.
}

Waiting dialog #

showWaitingDlg displays a progress dialog while an asynchronous operation runs. The operation returns a FutureResult from the result_utils package.

final result = await DialogUtils().showWaitingDlg<String>(
  context: context,
  message: 'Saving...',
  future: () async {
    await saveData();
    return FutureResult.success('Saved');
  },
);

if (result.hasError) {
  print('Error: ${result.error}');
} else {
  print('Data: ${result.value}');
}

See the complete runnable application in example/lib/main.dart, example/lib/dialog_examples_page.dart and example/lib/dialog_examples_page_ext.dart.
It demonstrates both direct factory usage and a custom theme with icon overrides.

Screenshots #

Error Success Confirm Info Waiting
Error dialog Success dialog Confirm dialog Info dialog Waiting dialog

Theming #

DialogUtilsStyle is a Flutter ThemeExtension. Declare it alongside standard Flutter theme configuration. The reusable DialogUtils() instance reads the nearest style from the BuildContext when a dialog is shown. If the theme has no DialogUtilsStyle extension, the constructor defaults on DialogUtilsStyle are used.

MaterialApp(
  theme: ThemeData(
    extensions: const [
      DialogUtilsStyle(
        titleTextStyle: TextStyle(fontSize: 22),
        contentTextStyle: TextStyle(fontSize: 17),
        errorIconColor: Colors.deepOrange,
        iconSize: 48,
        dialogRadius: 16,
        buttonMinimumSize: Size(120, 50),
      ),
    ],
    elevatedButtonTheme: ElevatedButtonThemeData(
      style: ElevatedButton.styleFrom(
        minimumSize: Size(120, 50),
      ),
    ),
  ),
  home: Builder(
    builder: (context) => ElevatedButton(
      onPressed: () => DialogUtils().showErrorDlg(
        context,
        title: 'Unable to save',
        content: 'Please try again.',
      ),
      child: const Text('Show dialog'),
    ),
  ),
);

Custom Icons And Styles #

Subclass DialogUtils and override any style method, icon method, or dialog method. Icon hooks return Widget, so they can return an Icon or a completely custom widget. Use DialogUtils.withStyle for an independent instance instead of the shared factory instance.

class AppDialogUtils extends DialogUtils {
  const AppDialogUtils() : super.withStyle();

  @override
  Widget errorIcon(BuildContext context) {
    return const Icon(Icons.warning_amber_rounded, size: 48);
  }

  @override
  ButtonStyle primaryButtonStyle(BuildContext context) {
    return ElevatedButton.styleFrom(
      backgroundColor: Colors.teal,
      foregroundColor: Colors.white,
    );
  }
}

Builder(
  builder: (context) => ElevatedButton(
    onPressed: () => const AppDialogUtils().showErrorDlg(
      context,
      title: 'Unable to save',
      content: 'Please try again.',
    ),
    child: const Text('Show dialog'),
  ),
);

The built-in override points are dialogTitleStyle, dialogContentStyle, dialogButtonTextStyle, defaultButtonStyle, primaryButtonStyle, errorIcon, successIcon, infoIcon, dialogBarrierColor, dialogShape, showErrorDlg, showSuccessDlg, showConfirmDlg, showInfoDlg, and showWaitingDlg.

License #

See LICENSE.

0
likes
160
points
186
downloads

Documentation

API reference

Publisher

verified publishernessoftware.com

Weekly Downloads

Reusable Flutter dialogs with theme and subclass customization.

Repository (GitHub)
View/report issues

Topics

#dialogs #flutter #material #theming #ui

License

MIT (license)

Dependencies

flutter, result_utils

More

Packages that depend on dialog_utils