Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/RatelHub/rflutter_alert
RFlutter Alert is super customizable and easy-to-use alert / popup dialog library for Flutter. You may create reusable alert styles or add buttons as much as you want with ease.
https://github.com/RatelHub/rflutter_alert
alert android dart dartlang dialog flutter ios rflutter rflutter-alert
Last synced: 6 days ago
JSON representation
RFlutter Alert is super customizable and easy-to-use alert / popup dialog library for Flutter. You may create reusable alert styles or add buttons as much as you want with ease.
- Host: GitHub
- URL: https://github.com/RatelHub/rflutter_alert
- Owner: RatelHub
- License: mit
- Created: 2018-12-06T11:20:37.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2023-10-05T19:01:51.000Z (about 1 year ago)
- Last Synced: 2024-07-19T11:47:51.540Z (4 months ago)
- Topics: alert, android, dart, dartlang, dialog, flutter, ios, rflutter, rflutter-alert
- Language: Dart
- Homepage: https://ratel.com.tr
- Size: 300 KB
- Stars: 384
- Watchers: 10
- Forks: 117
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- awesome-coding - rflutter_alert
README
# RFlutter Alert
RFlutter Alert is super customizable and easy-to-use alert/popup dialogs for Flutter. You may create reusable alert styles or add buttons as much as you want with ease.
[![Version](https://img.shields.io/badge/version-2.0.7-blue.svg)](https://pub.dartlang.org/packages/rflutter_alert)
## Features
- Single line basic alert
- Adding buttons dynamically (as much as you want)
- Predefined beautiful alert styles (success, error, warning, info)
- Reusable alert styles
- Super customizable
- Change animation (fromTop, fromBottom, fromRight, fromLeft, grow, shrink) & Custom Animation
- Set animation duration
- Show/hide close button
- Set overlay tap to dismiss
- Assign Title and desc styles
- Change dialog border style
## Getting startedYou must add the library as a dependency to your project.
```yaml
dependencies:
rflutter_alert: ^2.0.7
```You can also reference the git repo directly if you want:
```yaml
dependencies:
rflutter_alert:
git: git://github.com/RatelHub/rflutter_alert.git
```You should then run `flutter packages get`
## Example Project
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.
## Basic Alert
```dart
Alert(context: context, title: "RFLUTTER", desc: "Flutter is awesome.").show();
```## Alert with Button
```dart
Alert(
context: context,
type: AlertType.error,
title: "RFLUTTER ALERT",
desc: "Flutter is more awesome with RFlutter Alert.",
buttons: [
DialogButton(
child: Text(
"COOL",
style: TextStyle(color: Colors.white, fontSize: 20),
),
onPressed: () => Navigator.pop(context),
width: 120,
)
],
).show();
```## Alert with Buttons
```dart
Alert(
context: context,
type: AlertType.warning,
title: "RFLUTTER ALERT",
desc: "Flutter is more awesome with RFlutter Alert.",
buttons: [
DialogButton(
child: Text(
"FLAT",
style: TextStyle(color: Colors.white, fontSize: 20),
),
onPressed: () => Navigator.pop(context),
color: Color.fromRGBO(0, 179, 134, 1.0),
),
DialogButton(
child: Text(
"GRADIENT",
style: TextStyle(color: Colors.white, fontSize: 20),
),
onPressed: () => Navigator.pop(context),
gradient: LinearGradient(colors: [
Color.fromRGBO(116, 116, 191, 1.0),
Color.fromRGBO(52, 138, 199, 1.0)
]),
)
],
).show();
```## Alert with Style
### AlertStyleUse the `AlertStyle` class to customize.
```dart
var alertStyle = AlertStyle(
animationType: AnimationType.fromTop,
isCloseButton: false,
isOverlayTapDismiss: false,
descStyle: TextStyle(fontWeight: FontWeight.bold),
descTextAlign: TextAlign.start,
animationDuration: Duration(milliseconds: 400),
alertBorder: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(0.0),
side: BorderSide(
color: Colors.grey,
),
),
titleStyle: TextStyle(
color: Colors.red,
),
alertAlignment: Alignment.topCenter,
);
```
And assign your `AlertStyle` object to Alert's `style` field.
```dart
Alert(
context: context,
style: alertStyle,
type: AlertType.info,
title: "RFLUTTER ALERT",
desc: "Flutter is more awesome with RFlutter Alert.",
buttons: [
DialogButton(
child: Text(
"COOL",
style: TextStyle(color: Colors.white, fontSize: 20),
),
onPressed: () => Navigator.pop(context),
color: Color.fromRGBO(0, 179, 134, 1.0),
radius: BorderRadius.circular(0.0),
),
],
).show();
```## Alert with Custom Image
```dart
Alert(
context: context,
title: "RFLUTTER ALERT",
desc: "Flutter is better with RFlutter Alert.",
image: Image.asset("assets/success.png"),
).show();
```## Alert with Custom Content
```dart
Alert(
context: context,
title: "LOGIN",
content: Column(
children: [
TextField(
decoration: InputDecoration(
icon: Icon(Icons.account_circle),
labelText: 'Username',
),
),
TextField(
obscureText: true,
decoration: InputDecoration(
icon: Icon(Icons.lock),
labelText: 'Password',
),
),
],
),
buttons: [
DialogButton(
onPressed: () => Navigator.pop(context),
child: Text(
"LOGIN",
style: TextStyle(color: Colors.white, fontSize: 20),
),
)
]).show();
```## Contributions
* If you **found a bug**, open an issue.
* If you **have a feature request**, open an issue.
* If you **want to contribute**, submit a pull request.
## Version compatabilitySee CHANGELOG for all breaking (and non-breaking) changes.
Made with ❤ by Ratel