Cherry Toast


A new way to display toasts in Flutter in an elegant design and animations

info_cherry_toast.giferror_cherry_toast.gifbottom_cherry_toast.gif
warning_cherry_toast.gifsuccess_cherry_toast.gifright_layout_cherry_toast.gif

Cherry Toast v1.0.2

  • Support all platforms
  • Top and Bottom display position
  • Multiple built-in themes
  • Built-in animations
  • Support null safety
  • Elegant design
  • Full customizable
  • Heartbeat animation on icons
  • Customizable icon size and color and display

Installation

To add cherry toast to your project add this line to your pubspec.yaml file

dependencies:
	cherry_toast: ^1.0.2

Parameters

NameDescriptionRequiredDefault Value
titleThe toast title StringtrueN/A
descriptionthe toast description text (nullable)falsenull
actionthe toast action text (clickable text)falsenull
titleStylethe title text stylefalseTextStyle(color: Colors.black, fontWeight: FontWeight.bold)
descriptionStylethe description text stylefalseTextStyle(color: Colors.black)
actionStylethe action text stylefalseTextStyle(color: Colors.black, fontWeight: FontWeight.bold)
displayTitleindicates whether the title will be rendered or notfalsetrue
iconthe toast displayed icon (IconData)required when using the default constructor otherwise it's not requiredN/A
toastPositionthe position of the toast (Top/Bottom)falsePOSITION.TOP
themeColorthe color that will be applied on the icon back circle (for built-in themes it will match the action text colorrequired when using the default constructor otherwise it's not requiredN/A
actionHandlerFunction that will be invoked when clicking on the action textfalsenull
animationDurationthe duration of the animation display and hidefalseDuration(milliseconds: 1500)
animationCurvethe display animation curvefalseCurves.ease
animationTypethe type of the animation that will be applied on the toast (From left, From right, From top)falseANIMATION_TYPE.FROM_LEFT
autoDismissindicates whether the toast will be dismissed automatically or notfalsefalse
toastDurationthe duration of the toast when autoDismiss is truefalseDuration(milliseconds: 3000)
layoutthe taost's layout rendering (LTR, RTL)falseTOAST_LAYOUT.LTR
displayCloseButtonindicates whether display or not the close buttonfalsetrue
borderRadiusdefine the toast border radiusfalse20
iconColordefine the icon colorfalseColors.black
displayIconhide or show the icon on the toastfalsetrue
enableIconAnimationdefine wether apply an animation on the icon or notfalsetrue
iconSizedefine the icon sizefalse20

Usage

  • Simple cherry toast with only title

CherryToast.success(
	title:  "The simplest cherry toast"
).show(context);

  • Simple cherry toast with action button

CherryToast.info(
	title:  "User added",
	action:  "Display information",
	actionHandler: (){
		print("Action button pressed");
	},
).show(context);


A new way to display toasts in Flutter in an elegant design and animations

  • Toast with description without title

CherryToast.warning(
	title:  "",
	displayTitle:  false,
	description:  "All information may be deleted after this action",
	animationType:  ANIMATION_TYPE.FROM_TOP,
	action:  "Backup data",
	actionHandler: (){
		print("Hello World!!");
	},
).show(context);

  • Toast with nothing but description with different animation type and auto dismiss
CherryToast.error(
	title:  "",
	displayTitle:  false,
	description:  "Invalid account information",
	animationType:  ANIMATION_TYPE.FROM_RIGHT,
	animationDuration:  Duration(milliseconds:  1000),
	autoDismiss:  true)
.show(context);

  • Bottom displayed cherry toast
CherryToast(
	icon:  Icons.alarm_add,
	themeColor:  Colors.pink,
	title:  "",
	displayTitle:  false,
	description:  "A bottom cherry toast example",
	toastPosition:  POSITION.BOTTOM,
	animationDuration:  Duration(milliseconds:  1000),
	autoDismiss:  true)
.show(context);

  

  • Right layout rendered cherry toast
CherryToast(
	icon:  Icon(Icons.car_repair),
	themeColor:  Colors.green,
	title:  "",
	displayTitle:  false,
	description:  "هذا مثال تصميم من اليمين",
	toastPosition:  POSITION.BOTTOM,
	layout:  TOAST_LAYOUT.RTL,
	animationType:  ANIMATION_TYPE.FROM_RIGHT,
	action:  "انقر هنا",
	actionStyle:  TextStyle(color:  Colors.green),
	animationDuration:  Duration(milliseconds:  1000),
	autoDismiss:  true)
.show(context);

Contribution

Of course the project is open source, and you can contribute to it repository link

  • 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.

Libraries

arrays
cherry_toast
cherry_toast_icon
colors
constants