v2.3.0giffy_dialog
A Flutter package for a quick, handy and beautiful giffy dialogs and bottom sheets.
A Flutter package for a quick and handy giffy dialog.
{"sdk":"flutter"}^0.13.10^3.1.0{"sdk":"flutter"}>=4.0.0 <6.0.0English project snapshot. Visit GitHub for the latest content.
Open Source Love License Dart CI CodeCov Version
A beautiful and custom alert dialog for flutter highly inspired from FancyAlertDialog-Android.
Show some ❤️ and star the repo to support the project
Live Demo: https://xsahil03x.github.io/giffy_dialog
An animated image of the GiffyDialog
Please refer to the migration guide to migrate from v1 to v2.
Add the following to your pubspec.yaml and replace [version] with the latest version:
dependencies:
giffy_dialog: ^[version]
Import the package:
import 'package:giffy_dialog/giffy_dialog.dart';
Use it like a dialog:
showDialog(
context: context,
builder: (BuildContext context) {
return GiffyDialog.image(
Image.network(
"https://raw.githubusercontent.com/Shashank02051997/FancyGifDialog-Android/master/GIF's/gif14.gif",
height: 200,
fit: BoxFit.cover,
),
title: Text(
'Image Animation',
textAlign: TextAlign.center,
),
content: Text(
'This is a image animation dialog box. This library helps you easily create fancy giffy dialog.',
textAlign: TextAlign.center,
),
actions: [
TextButton(
onPressed: () => Navigator.pop(context, 'CANCEL'),
child: const Text('CANCEL'),
),
TextButton(
onPressed: () => Navigator.pop(context, 'OK'),
child: const Text('OK'),
),
],
);
},
);
Or use it like a bottom sheet:
showModalBottomSheet(
context: context,
clipBehavior: Clip.antiAlias,
isScrollControlled: true,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(
top: Radius.circular(useMaterial3 ? 32 : 4),
),
),
builder: (BuildContext context) {
return GiffyBottomSheet.image(
Image.network(
"https://raw.githubusercontent.com/Shashank02051997/FancyGifDialog-Android/master/GIF's/gif14.gif",
height: 200,
fit: BoxFit.cover,
),
title: Text(
'Image Animation',
textAlign: TextAlign.center,
),
content: Text(
'This is a image animation bottom sheet. This library helps you easily create fancy giffy bottom sheet.',
textAlign: TextAlign.center,
),
actions: [
TextButton(
onPressed: () => Navigator.pop(context, 'CANCEL'),
child: const Text('CANCEL'),
),
TextButton(
onPressed: () => Navigator.pop(context, 'OK'),
child: const Text('OK'),
),
],
);
},
);
| Giffy Dialog | Giffy BottomSheet | |||||||
|---|---|---|---|---|---|---|---|---|
| Material 2 | Material 3 | Material 2 | Material 3 | |||||
| Image Giffy | Image Giffy Dialog | Image Giffy Dialog | Image Giffy Dialog | Image Giffy Dialog | ||||
| Rive Giffy | Image Giffy Dialog | Image Giffy Dialog | Image Giffy Dialog | Image Giffy Dialog | ||||
| Lottie Giffy | Image Giffy Dialog | Image Giffy Dialog | Image Giffy Dialog | Image Giffy Dialog | ||||
The GiffyDialog widget provides several customization options, such as the dialog title, description, buttons, animations, and more. Please refer to the documentation for a complete list of available options.
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!