KAlertFlutter
A modern, professional, customizable Material-style alert dialog library for Flutter.
๐ 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
๐ Related Native Android Library
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:
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
๐ธ Screenshot Gallery
Add your screenshots inside the
art/new/folder using the same file names shown below.
Modern Success Dialog
|
Custom Radius, Elevation and Dim
|
Title and Content Font Weight
|
||
Basic Message Dialog
|
Error Dialog
|
Warning Confirm / Cancel Flow
|
Info Dialog
|
Question Dialog
|
Input Dialog with Validation
|
Custom View Dialog
|
|||
Custom Image Dialog
|
URL Image Circle Dialog
|
Big URL Image Dialog
|
||
Button Styling
|
Progress Dialog
|
Show and Dismiss Callbacks
|
๐ฆ 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
๐ค Related Projects
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
๐ 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.