quickalert 1.0.1 icon indicating copy to clipboard operation
quickalert: ^1.0.1 copied to clipboard

With QuickAlert, instantly display animated alert dialogs such as success, error, warning, confirm, loading or even a custom dialog.

QuickAlert Banner

An instantly ready, full-featured alerts for development on any platform with flutter. Enabling you to complete projects and deploy quickly. With QuickAlert, you can display animated alert dialogs such as success, error, warning, confirm, loading or even a custom dialog.

Key Features 🔮 #

Easy To Use

The alerts are very flexible and can be customized very easily. In QuickAlert, the QuickAlert.show() triggers the alert, which informs the user about the situations that need acknowledgment.

Predefined Beautiful Alert Styles

Make use of the predefined alerts are very beautiful and can also be customized very easily. In QuickAlert there are 6 different types of alerts, they are Success, Error, Warning, Info, Confirm & Loading.

Predefined Title & Actions

In QuickAlert all the 6 different types of alerts have predefined title & actions matching the alert type.

Super Customizable

Build your custom alert with power of QuickAlert using the flutter widgets.

Change Animation

Set your favorite animation by choosing from scale, rotate, slideInDown, slideInUp, slideInLeft, slideInRight.

Set Auto close

Auto close the alert by setting auto close duration.

Set Overlay Tap to Dismiss

Control the alert's Barrier Dismissible Property by setting barrierDismissible to true or false.

And Many More...

QuickAlert Demo

QuickAlert Demo

Getting Started 🔥 #

Start by adding the library as a dependency to your project.

  QuickAlert: <latest version>

Run the command get the dependency

$ flutter pub get

Import it in your dart code, you can use

import 'package:quickalert/quickalert.dart';

To display alert use QuickAlert.show() and define the type of alert.

  context: context,
  type: QuickAlertType.success,
); // That's it to display an alert, use other properties to customize.

Examples ⚡ #

There is a detailed example project in the example folder. You can directly run and play on it. There are code snippets from example project below.

Success #

   context: context,
   type: QuickAlertType.success,
   text: 'Transaction Completed Successfully!',

Error #

   context: context,
   type: QuickAlertType.error,
   title: 'Oops...',
   text: 'Sorry, something went wrong',

Warning #

   context: context,
   type: QuickAlertType.warning,
   text: 'You just broke protocol',

Info #

   context: context,
   type: QuickAlertType.info,
   text: 'Buy two, get one free',

Confirm #

   context: context,
   type: QuickAlertType.confirm,
   text: 'Do you want to logout',
   confirmBtnText: 'Yes',
   cancelBtnText: 'No',
   confirmBtnColor: Colors.green,

Loading #

   context: context,
   type: QuickAlertType.loading,
   title: 'Loading',
   text: 'Fetching your data',

Custom #

    context: context,
    type: QuickAlertType.custom,
    barrierDismissible: true,
    confirmBtnText: 'Save',
    customAsset: 'assets/custom.gif',
    widget: TextFormField(
    decoration: const InputDecoration(
       alignLabelWithHint: true,
       hintText: 'Enter Phone Number',
       prefixIcon: Icon(
      textInputAction: TextInputAction.next,
        keyboardType: TextInputType.phone,
        onChanged: (value) => message = value,
      onConfirmBtnTap: () async {
       if (message.length < 5) {
        await QuickAlert.show(
         context: context,
         type: QuickAlertType.error,
         text: 'Please input something',
       await Future.delayed(const Duration(milliseconds: 1000));
       await QuickAlert.show(
        context: context,
        type: QuickAlertType.success,
        text: "Phone number '$message' has been saved!.",
   title: 'Custom',
   text: 'Custom Widget Alert',
   leadingImage: 'assets/custom.gif',

Screenshots ✨ #

Here are some screenshots of the QuickAlert Dialogs.

QuickAlert Options 📖 #

These are the options available in QuickAlert Class.

AttributeData typeDescriptionDefault Value
contextBuildContext@required BuildContextN/A
typeQuickAlertType@required - Type of alert dialog, ex: QuickAlertType.success for success dialogsNull
titleStringSet a custom title for dialogBased on the QuickAlertType selected
textStringSet the description text of the dialog.Null
widgetWidgetSet custom widget of the dialog.Null
confirmBtnTextStringText of confirm button'Okay'
confirmBtnTapFunctionFunction that handle click of confirm button() => Navigator.pop(context)
confirmBtnColorColorColor of confirm ButtonColors.blue
showCancelBtnboolDetermines if cancel button is shown or notfalse
cancelBtnTextStringText of cancel button'Cancel'
cancelBtnTapFunctionFunction that handle click of cancel button() => Navigator.pop(context)
barrierDismissibleboolDismiss dialog on touch overlaytrue
animTypeQuickAlertAnimTypeType of dialogue enter animationQuickAlertAnimType.scale
confirmBtnTextStyleTextStyleConfirm button text themeTextStyle(color: Colors.white, fontWeight:FontWeight.w600,fontSize: 18.0)
cancelBtnTextStyleTextStyleCancel button text themeTextStyle(color: Colors.grey, fontWeight:FontWeight.w600,fontSize: 18.0)
backgroundColorColorColor of dialog backgroundColors.white
titleColorColorColor of titleColors.black
textColorColorColor of textColors.black
barrierColorColorColor of BarrierNull
customAssetStringAsset path of your custom assetNull
autoCloseDurationDurationDetermines how long the dialog stays open for before closingNull
widthdoubleDialog widthMediaQuery.of(context).size.shortestSide
pub points


verified publisher iconbelovance.com

With QuickAlert, instantly display animated alert dialogs such as success, error, warning, confirm, loading or even a custom dialog.

Repository (GitHub)


API reference


Icon for licenses.MIT (LICENSE)


flutter, vector_math


Packages that depend on quickalert