KAlertFlutter Banner

KAlertFlutter

A modern, professional, customizable Material-style alert dialog library for Flutter.

pub.dev version pub.dev downloads Flutter platform MIT License

View on pub.dev GitHub Repository Native Android KAlertDialog


๐Ÿš€ What is KAlertFlutter?

KAlertFlutter is a lightweight, modern, and professional alert dialog package for Flutter.

It is inspired by the native Android Java library KAlertDialog and brings a similar beautiful dialog experience to Flutter apps.

With KAlertFlutter, you can quickly create:

  • Success dialogs
  • Error dialogs
  • Warning dialogs
  • Info dialogs
  • Question dialogs
  • Confirm dialogs
  • Prompt/input dialogs
  • Progress/loading dialogs
  • Custom image dialogs
  • URL image dialogs
  • Custom view dialogs
  • Modern styled dialogs
  • Dark mode friendly dialogs
  • Input validation dialogs
  • Fully customizable button dialogs

KAlertFlutter is designed to match the native Android Java library KAlertDialog.

If you are building a native Android app in Java, use the Android version here:

KAlertDialog Native Android Library

Native Android Java Library:
https://github.com/TutorialsAndroid/KAlertDialog


๐Ÿ”— pub.dev Package

https://pub.dev/packages/kalertflutter


โค๏ธ Support the Project

If you find KAlertFlutter useful, please support the project:

โญ Star this repository
๐Ÿ› Report issues
๐Ÿ’ก Suggest new features
๐Ÿ“ฆ Like the package on pub.dev
๐Ÿš€ Share it with other Flutter developers

Follow me on Instagram for more developer content:

๐Ÿ“ธ https://instagram.com/coderx09

Thanks for your support! ๐Ÿš€


โœจ Features

Dialog Types

  • โœ… Normal dialog
  • โœ… Success dialog
  • โœ… Error dialog
  • โœ… Warning dialog
  • โœ… Info dialog
  • โœ… Question dialog
  • โœ… Confirm dialog
  • โœ… Prompt/input dialog
  • โœ… Progress/loading dialog
  • โœ… Custom image dialog
  • โœ… URL image dialog
  • โœ… Custom view dialog

Styling Features

  • โœ… Modern Material-style UI
  • โœ… Rounded dialog corners
  • โœ… Modern style presets
  • โœ… Classic style preset
  • โœ… Minimal style preset
  • โœ… Rounded style preset
  • โœ… Custom dialog corner radius
  • โœ… Custom dialog elevation
  • โœ… Custom dialog dim amount
  • โœ… Dark mode support
  • โœ… Custom title text style
  • โœ… Custom content text style
  • โœ… Title font weight support
  • โœ… Content font weight support
  • โœ… Button font weight support
  • โœ… Button text size support
  • โœ… Button all-caps control
  • โœ… Custom button colors
  • โœ… Custom icon colors
  • โœ… Custom background colors

Advanced Features

  • โœ… Input validation
  • โœ… Input max length
  • โœ… Input keyboard type
  • โœ… Input confirm callback
  • โœ… Custom Flutter widget inside dialog
  • โœ… URL image big mode
  • โœ… URL image circle mode
  • โœ… URL image placeholder
  • โœ… URL image error widget
  • โœ… Progress dialog
  • โœ… Show callback
  • โœ… Dismiss callback
  • โœ… Confirm callback
  • โœ… Cancel callback
  • โœ… Backward compatible old API

Add your screenshots inside the art/new/ folder using the same file names shown below.

Modern Success Dialog

KAlert Flutter Dialog Modern Success Dialog
Custom Radius, Elevation and Dim

KAlert Flutter Dialog Custom Radius, Elevation and Dim
Title and Content Font Weight

KAlert Flutter Dialog Title and Content Font Weight
Basic Message Dialog

KAlert Flutter Dialog Basic Message Dialog
Error Dialog

KAlert Flutter Dialog Error Dialog
Warning Confirm / Cancel Flow

KAlert Flutter Dialog Warning Confirm / Cancel Flow
Info Dialog

KAlert Flutter Dialog Info Dialog
Question Dialog

KAlert Flutter Dialog Question Dialog
Input Dialog with Validation

KAlert Flutter Dialog Input Validation Dialog
Custom View Dialog

KAlert Flutter Dialog Custom View Dialog
Custom Image Dialog

KAlert Flutter Dialog Custom Image Dialog
URL Image Circle Dialog

KAlert Flutter Dialog URL Image Circle Dialog
Big URL Image Dialog

KAlert Flutter Dialog Big URL Image Dialog
Button Styling

KAlert Flutter Dialog Button Styling Dialog
Progress Dialog

KAlert Flutter Dialog Progress Dialog
Show and Dismiss Callbacks

KAlert Flutter Dialog Callbacks Dialog


๐Ÿ“ฆ Installation

Add this to your pubspec.yaml:

dependencies:
  kalertflutter: ^2.0.0

Then run:

flutter pub get

๐Ÿš€ Import

import 'package:kalertflutter/kalertflutter.dart';

โšก Quick Start

KAlertDialog.success(
  context: context,
  title: 'Success',
  content: 'Your changes were saved successfully.',
  confirmText: 'Done',
);

๐ŸŽจ Dialog Types

KAlertFlutter supports these dialog types:

KAlertType.normal
KAlertType.success
KAlertType.error
KAlertType.warning
KAlertType.info
KAlertType.question
KAlertType.progress
KAlertType.input
KAlertType.customImage
KAlertType.urlImage
KAlertType.customView

๐ŸŽญ Style Presets

KAlertFlutter includes modern style presets:

KAlertStyle.classic
KAlertStyle.modern
KAlertStyle.minimal
KAlertStyle.rounded

Example:

KAlertDialog.show(
  context: context,
  title: 'Modern Dialog',
  content: 'This dialog uses the modern style preset.',
  type: KAlertType.normal,
  style: KAlertStyle.modern,
);

โœ… Success Dialog

KAlertDialog.success(
  context: context,
  title: 'Success',
  content: 'Your action was completed successfully.',
  confirmText: 'OK',
);

โŒ Error Dialog

KAlertDialog.error(
  context: context,
  title: 'Oops...',
  content: 'Something went wrong. Please try again.',
  confirmText: 'Try Again',
);

โš ๏ธ Warning Dialog

KAlertDialog.warning(
  context: context,
  title: 'Are you sure?',
  content: 'This action cannot be undone.',
  confirmText: 'Confirm',
  cancelText: 'Cancel',
);

โ„น๏ธ Info Dialog

KAlertDialog.info(
  context: context,
  title: 'Information',
  content: 'Here is some useful information.',
  confirmText: 'Got it',
);

โ“ Question Dialog

final result = await KAlertDialog.question(
  context: context,
  title: 'Continue?',
  content: 'Do you want to continue with this action?',
  confirmText: 'Yes',
  cancelText: 'No',
);

if (result?.confirmed == true) {
  debugPrint('User selected yes');
}

๐Ÿ—‘๏ธ Confirm Dialog / Warning Flow

final result = await KAlertDialog.warning(
  context: context,
  title: 'Delete this file?',
  content: 'This action cannot be undone.',
  confirmText: 'Delete',
  cancelText: 'Cancel',
);

if (result?.confirmed == true) {
  KAlertDialog.success(
    context: context,
    title: 'Deleted',
    content: 'The file has been deleted successfully.',
  );
} else if (result?.cancelled == true) {
  KAlertDialog.error(
    context: context,
    title: 'Cancelled',
    content: 'Your file is safe. No changes were made.',
  );
}

๐Ÿ”„ Progress Dialog

KAlertDialog.progress(
  context: context,
  title: 'Processing',
  content: 'Please wait while we prepare your request.',
  barrierDismissible: false,
);

Example with auto close:

KAlertDialog.progress(
  context: context,
  title: 'Processing',
  content: 'Please wait while we prepare your request.',
  barrierDismissible: false,
);

await Future.delayed(const Duration(seconds: 3));

if (context.mounted) {
  Navigator.of(context).pop();

  KAlertDialog.success(
    context: context,
    title: 'Completed',
    content: 'Your request has been completed successfully.',
  );
}

โŒจ๏ธ Input Dialog with Validation

final result = await KAlertDialog.input(
  context: context,
  title: 'Create Project',
  content: 'Enter a project name with at least 3 characters.',
  hintText: 'Project name',
  initialValue: 'KAlertFlutter',
  maxLength: 30,
  validator: (input) {
    if (input.trim().length < 3) {
      return 'Project name must be at least 3 characters';
    }
    return null;
  },
  onInputConfirm: (input) {
    debugPrint('Created: $input');
  },
);

if (result?.confirmed == true) {
  debugPrint('Input value: ${result?.value}');
}

๐Ÿงฉ Custom View Dialog

You can place any Flutter widget inside the dialog.

final controller = TextEditingController();

KAlertDialog.customView(
  context: context,
  title: 'Custom View',
  content: 'This dialog uses your own custom Flutter widget.',
  showCancelButton: true,
  confirmText: 'Save',
  cancelText: 'Cancel',
  child: Column(
    mainAxisSize: MainAxisSize.min,
    children: [
      TextField(
        controller: controller,
        decoration: const InputDecoration(
          labelText: 'Project name',
          hintText: 'Example: KAlertFlutter Pro',
          border: OutlineInputBorder(),
        ),
      ),
      const SizedBox(height: 10),
      const Text(
        'You can place any custom widget inside KAlertFlutter.',
        textAlign: TextAlign.center,
      ),
    ],
  ),
  onConfirm: () {
    debugPrint('Saved: ${controller.text}');
  },
);

๐Ÿ–ผ๏ธ Custom Image Dialog

KAlertDialog.customImage(
  context: context,
  title: 'Custom Image',
  content: 'You can show an asset image, memory image or network image provider.',
  image: const AssetImage('assets/logo.png'),
  confirmText: 'OK',
);

Using network image provider:

KAlertDialog.customImage(
  context: context,
  title: 'Custom Image',
  content: 'This image uses NetworkImage.',
  image: const NetworkImage('https://example.com/image.png'),
);

๐ŸŒ URL Image Dialog

KAlertFlutter supports two URL image display types:

KAlertImageType.big
KAlertImageType.circle

Big URL Image

KAlertDialog.urlImage(
  context: context,
  title: 'Big URL Image',
  content: 'This image is loaded from a URL.',
  imageUrl: 'https://example.com/image.png',
  imageType: KAlertImageType.big,
  confirmText: 'Close',
);

Circle URL Image

KAlertDialog.urlImage(
  context: context,
  title: 'Circle URL Image',
  content: 'This image is shown in circle crop mode.',
  imageUrl: 'https://example.com/image.png',
  imageType: KAlertImageType.circle,
  confirmText: 'Nice',
);

๐ŸŽจ Custom Dialog Appearance

KAlertDialog.show(
  context: context,
  title: 'Custom Appearance',
  content: 'This dialog has custom radius, elevation and dim amount.',
  type: KAlertType.normal,
  style: KAlertStyle.modern,
  cornerRadius: 30,
  elevation: 20,
  dimAmount: 0.60,
  backgroundColor: Colors.white,
  confirmText: 'Looks Good',
);

Available appearance options:

cornerRadius: 30
elevation: 20
dimAmount: 0.60
maxWidth: 360
backgroundColor: Colors.white
titleColor: Colors.black
contentColor: Colors.grey
iconColor: Colors.green

๐Ÿ”  Font Weight and Text Styling

KAlertDialog.show(
  context: context,
  title: 'Font Weight Support',
  content: 'You can control title, content and button font weights.',
  type: KAlertType.normal,
  style: KAlertStyle.modern,
  titleFontWeight: FontWeight.w900,
  contentFontWeight: FontWeight.w500,
  confirmButtonFontWeight: FontWeight.w900,
  titleTextSize: 22,
  contentTextSize: 15,
  buttonTextSize: 15,
  confirmText: 'Awesome',
);

๐Ÿ”˜ Button Styling

KAlertDialog.show(
  context: context,
  title: 'Button Styling',
  content: 'This example shows button text size, font weight, all caps control and custom colors.',
  type: KAlertType.normal,
  style: KAlertStyle.minimal,
  showCancelButton: true,
  confirmText: 'Accept',
  cancelText: 'Decline',
  confirmButtonColor: const Color(0xFF10B981),
  cancelButtonColor: const Color(0xFFE2E8F0),
  cancelTextColor: const Color(0xFF334155),
  confirmButtonFontWeight: FontWeight.w900,
  cancelButtonFontWeight: FontWeight.w900,
  buttonTextSize: 15,
  confirmButtonAllCaps: false,
  cancelButtonAllCaps: false,
);

๐ŸŒ™ Dark Mode Support

KAlertFlutter automatically respects your Flutter app theme.

Example:

MaterialApp(
  themeMode: ThemeMode.system,
  theme: ThemeData(
    useMaterial3: true,
    brightness: Brightness.light,
  ),
  darkTheme: ThemeData(
    useMaterial3: true,
    brightness: Brightness.dark,
  ),
  home: const HomePage(),
);

KAlertFlutter will automatically adapt when the app is in dark mode.


๐Ÿ”” Callback APIs

KAlertDialog.show(
  context: context,
  title: 'Callbacks',
  content: 'This dialog shows callback APIs.',
  type: KAlertType.normal,
  showCancelButton: true,
  confirmText: 'Confirm',
  cancelText: 'Cancel',
  onShow: () {
    debugPrint('Dialog shown');
  },
  onDismiss: () {
    debugPrint('Dialog dismissed');
  },
  onConfirm: () {
    debugPrint('Confirmed');
  },
  onCancel: () {
    debugPrint('Cancelled');
  },
);

๐Ÿ”™ Backward Compatible Old API

Your previous API is still supported.


Old KAlert.show()

KAlert.show(
  context,
  title: 'Success',
  message: 'Saved successfully!',
  type: KAlertType.success,
);

Old KAlert.confirm()

bool? result = await KAlert.confirm(
  context,
  title: 'Delete file?',
  message: 'This action cannot be undone',
);

if (result == true) {
  debugPrint('User confirmed');
}

Old KAlert.prompt()

String? value = await KAlert.prompt(
  context,
  title: 'Enter your name',
  hintText: 'Your name',
);

debugPrint(value);

๐Ÿ“˜ Complete Example

import 'package:flutter/material.dart';
import 'package:kalertflutter/kalertflutter.dart';

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

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

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

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('KAlertFlutter Demo'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            KAlertDialog.success(
              context: context,
              title: 'Success',
              content: 'KAlertFlutter is working perfectly!',
              confirmText: 'Done',
            );
          },
          child: const Text('Show Dialog'),
        ),
      ),
    );
  }
}

๐Ÿงช Local Testing

If you are developing this package locally, run:

flutter clean
flutter pub get
flutter analyze
flutter test

To run the example app:

cd example
flutter pub get
flutter run

If the Android folder is missing inside example, run:

cd example
flutter create .
flutter pub get
flutter run

๐Ÿ“‚ Repository

GitHub:

https://github.com/TutorialsAndroid/KAlertFlutter

Issues and feature requests are welcome.


๐Ÿ“ฆ Package

pub.dev:

https://pub.dev/packages/kalertflutter


KAlertDialog for Native Android Java

If you are building a native Android app using Java, check out the original Android library:

KAlertDialog
https://github.com/TutorialsAndroid/KAlertDialog

KAlertDialog Native Android Library


๐Ÿ“ Migration from Older Version

Older versions used:

KAlert.show()
KAlert.confirm()
KAlert.prompt()

These methods are still available.

New recommended API:

KAlertDialog.success()
KAlertDialog.error()
KAlertDialog.warning()
KAlertDialog.info()
KAlertDialog.question()
KAlertDialog.progress()
KAlertDialog.input()
KAlertDialog.customView()
KAlertDialog.customImage()
KAlertDialog.urlImage()

๐Ÿ“Œ API Summary

Dialog Types

KAlertType.normal
KAlertType.success
KAlertType.error
KAlertType.warning
KAlertType.info
KAlertType.question
KAlertType.progress
KAlertType.input
KAlertType.customImage
KAlertType.urlImage
KAlertType.customView

Styles

KAlertStyle.classic
KAlertStyle.modern
KAlertStyle.minimal
KAlertStyle.rounded

Image Types

KAlertImageType.big
KAlertImageType.circle

Main Methods

KAlertDialog.show()
KAlertDialog.success()
KAlertDialog.error()
KAlertDialog.warning()
KAlertDialog.info()
KAlertDialog.question()
KAlertDialog.progress()
KAlertDialog.input()
KAlertDialog.customView()
KAlertDialog.customImage()
KAlertDialog.urlImage()

Backward Compatible Methods

KAlert.show()
KAlert.confirm()
KAlert.prompt()

๐Ÿ“œ License

MIT License

Free for personal and commercial use.

MIT License

Copyright (c) 2026 TutorialsAndroid

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files, to deal in the Software
without restriction, including without limitation the rights to use, copy,
modify, merge, publish, distribute, sublicense, and/or sell copies of the
Software, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

Made with โค๏ธ by TutorialsAndroid

If this package helps you, please โญ star the repository and ๐Ÿ‘ like the package on pub.dev.

Libraries

kalertflutter