Features

• Heartbeat animations
• Full customized text
• Built in animations
• Customize toast layout (LTR/RTL)
• Customize toast duration
• Customize toast position (Center, Bottom, Top)
• Animated toasts with animated icons
• Built-in types (Success, Warning, Error, Info, Delete)
• Possibility to design your own toast
• Support null safety
• Support long text

Getting started

In order to add custom toast to your project add this line to your pubspec.yaml file

dependencies:
	customtoastshow: ^1.6.0

Or you can reference the main repository directly by adding those lines

dependencies:
	customtoastshow:
		git: https://github.com/palashsethiya/ToastHandler.git

Attributes

Name	Type	Description	Required	Default Value
description	String	The description text	true	N/A
title	String	The toast title	false	empty string
descriptionStyle	TextStyle	The text style applied on the description text	false	TextStyle(color: Colors.black)
titleStyle	TextStyle	The text style applied on the title	false	TextStyle(color: Colors.black)
icon	IconData	The toast icon	required when creating a custom toast otherwise you don't have to pass it	N/A
color	Color	The custom toast background color (applied on the background, icon and side bar)	required when creating a custom toast otherwise you don't have to pass it	N/A
width	double	The custom toast width	false	350
height	double	The custom toast height	false	80
iconSize	double	The icon size	false	40
iconType	ICON_TYPE String	The design type of the icon (Material design or Cupertino) values: ICON_TYPE.MATERIAL_DESIGN or ICON_TYPE.CUPERTINO	false	ICON_TYPE.MATERIAL_DESIGN
enableAnimation	boolean	Whether enable or disable the animation applied on the icon (heartbeat animation)	false	true
layoutOrientation	ORIENTATION	the layout orientation of the toast (from left to right LTR or from right to left RTL	false	ORIENTATION.LTR
animationType	ANIMATION	the toast enter animation	false	ANIMATION.FROM_BOTTOM
animationDuration	Duration	the animation duration	false	Duration(milliseconds: 1500)
toastDuration	Duration	How much the toast will be shown	false	Duration(seconds: 3)
animationCurve	Curves	The toast animation curve	false	Curves.ease
position	MOTION_TOAST_POSITION	The position where the toast will be displayed (TOP, BOTTOM, CENTER)	false	MOTION_TOAST_POSITION.BOTTOM
borderRadius	double	define the radius of the toast	false	20
onClose	Function	function invoked once the toast in closed	false	null

• When creating you custom toast you don't have to use iconType it will not be used when rendering the toast

• For bottom toast you can't set the animation FROM_TOP as well as for top displayed toast you can't set the animation to FROM_BOTTOM

• for center custom toast it will be rendered without animations

Implementation

• Success Toast

CustomToast.success(
	title:  "Success Toast",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "Example of success custom toast",
	descriptionStyle:  TextStyle(fontSize:  12),
	width:  300
).show(context);

• Warning Toast

CustomToast.warning(
	title:  "Warning Toast",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "This is a Warning"
).show(context);

• Error Toast

CustomToast.error(
	title:  "Error",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "Please enter your name"
).show(context);

• Info Toast

CustomToast.info(
	title:  "Info Toast",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "Example of Info Toast"
).show(context);

• Delete Toast

CustomToast.delete(
	title:  "Deleted",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "The item is deleted"
).show(context);

• Custom Toast

To create your custom toast just use the default constructor,

icon description and color are required

CustomToast(
	icon:  Icons.alarm,
	color:  Colors.pink,
	title:  "Custom Toast",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "You can customize the toast!",
	width:  300
).show(context);

• Right-Designed Toast

To change the toast layout you need to use layoutOrientation, icon description and color are required

CustomToast.success(
	title:  "Toast",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "Customize Toast",
	descriptionStyle:  TextStyle(fontSize:  12),
	layoutOrientation:  ORIENTATION.RTL,
	animationType:  ANIMATION.FROM_RIGHT,width:  300,
).show(context);

• Top-displayed Toast

To change the display position of the custom toast use position attribute

CustomToast(
	icon:  Icons.zoom_out,
	color:  Colors.deepOrange,
	title:  "Top  Toast",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "Another custom toast example",
	position:  MOTION_TOAST_POSITION.TOP,
	animationType:  ANIMATION.FROM_TOP,
).show(context);

• Center-displayed Toast

CustomToast(
	icon:  Icons.zoom_out,
	color:  Colors.deepOrange,
	title:  "Center  Toast",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "Another custom toast example",
	position:  MOTION_TOAST_POSITION.CENTER
).show(context);

• Using onClose parameter (display two successive toasts)

CustomToast.success(
	title:  "User Data",
	titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
	description:  "Your data has been deleted",
	descriptionStyle:  TextStyle(fontSize:  12),
	onClose: (){
		CustomToast.error(
			title:  "User Data",
			titleStyle:  TextStyle(fontWeight:  FontWeight.bold),
			description:  "Your data has been deleted",
			descriptionStyle:  TextStyle(fontSize:  12),
		).show(context);
	},
).show(context);