Last updated:
0 purchases
sha alert
Sha alerts - Alert dialogs for flutter with UX in mind. #
Sha alert is alert dialogs designed by considering user experience and user interface in first place.
Sha alert supports 5 types of alert dialogs.
- Primary
Secondary
Positive
Negative
Warning
Features and UX #
Haptic feedbacks on supported devices.
Naturally animated (Not starting scale from 0 to 1 instead 0.7 to 1).
Scale animation + alpha animation.
Two action buttons.
Customizable title, message, action buttons and colors.
PRO TIP 🚀 : Read my article on fueler on how to design alert dialogs here
Screenshots #
Installation #
dependencies:
sha_alert: ^0.0.1
copied to clipboard
Usage #
ShaAlert.showHozzoAlert(
context: context,
title: 'Welcome Note',
message: 'Happy to see you on board! Please read the terms and conditions carefully.',
firstButtonTitle: "I Agree",
firstButtonType: ButtonType.primary,
onFirstButtonPressed: () {
// Code to be executed when the first button is pressed
},
secondButtonTitle: "Read Terms and Conditions",
onSecondButtonPressed: () {
// Code to be executed when the second button is pressed
},
);
copied to clipboard
Parameters: #
context (BuildContext) - (Required) This context should contain the navigator for the alert to work properly and pop itself.
title (String) - (Required) The title of the alert dialog.
message (String) - (Required) The main message/content of the alert dialog.
firstButtonTitle (String) - (Required) The title of the first action button.
secondButtonTitle (String, optional) - The title of the second action button. If not provided, only one button will be shown.
onFirstButtonPressed (Function, optional) - Function to be called when the first action button is pressed.
onSecondButtonPressed (Function, optional) - Function to be called when the second action button is pressed.
firstButtonType (ButtonType, optional) - The type of the first action button. Default is ButtonType.negative. Possible values are ButtonType.negative, ButtonType.positive, and ButtonType.secondary.
secondButtonType (ButtonType, optional) - The type of the second action button. Default is ButtonType.secondary. Possible values are ButtonType.negative, ButtonType.positive, and ButtonType.secondary.
height (double, optional) - Height of the alert dialog. Default is 280 pixels.
child (Widget, optional) - Use this for showing custom widgets or even images. This can be used to add additional content to the alert dialog. Make sure to set the height accordingly if you use this parameter.
backdropColor (Color, optional) - Backdrop color of the alert dialog. Default is Colors.black54 (black with 54% opacity).
transitionDuration (Duration, optional) - Default transition duration for the alert dialog. Default is 120 milliseconds (0.12 seconds).
onDismissed (Function, optional) - Function to be called when the alert is dismissed (e.g., when the user taps outside the dialog).
customHapticFeedback (Function, optional) - Custom haptic feedback function to be called when the alert is displayed. If not provided, default haptic feedback will be used. This function will be called after 100 milliseconds.
secondaryColor (Color, optional) - Custom color for secondary elements in the alert dialog (e.g., button backgrounds). If overrideTheme is set to false, this color will be set to the secondary color of the current theme. Otherwise, the default is Colors.grey.shade100.
primaryColor (Color, optional) - Custom color for primary elements in the alert dialog (e.g., button text). If overrideTheme is set to false, this color will be set to the primary color of the current theme. Otherwise, the default is Colors.blue.
errorColor (Color, optional) - Custom color for error elements in the alert dialog (e.g., error button backgrounds). If overrideTheme is set to false, this color will be set to the error color of the current theme. Otherwise, the default is Colors.red.
successColor (Color, optional) - Custom color for success elements in the alert dialog (e.g., success button backgrounds). If overrideTheme is set to false, this color will be set to the primary color of the current theme. Otherwise, the default is Colors.green.
overrideTheme (bool, optional) - If set to true, the custom colors specified (primaryColor, secondaryColor, errorColor, successColor) will be used. If set to false, the colors will be set based on the current theme.
Author #
Shajin KP - shajin.in
Contributing #
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
For personal and professional use. You cannot resell or redistribute these repositories in their original state.
There are no reviews.