headsUpNotification function
Displays a heads-up notification overlay.
This function displays a heads-up notification overlay with the provided
title
and body
text. The overlay consists of a container containing an
icon, title, and body text, displayed in a row layout. The notification
overlay is designed to be displayed at the top of the screen within a safe
area. The overlay will automatically disappear after a duration of 5 seconds.
@param title The title text of the notification overlay.
@param body The body text of the notification overlay.
@return An OverlaySupportEntry
representing the displayed notification overlay.
Implementation
OverlaySupportEntry headsUpNotification(String? title, String? body) {
return showOverlayNotification(
(BuildContext context) {
return SafeArea(
child: Container(
width: double.infinity,
margin: const EdgeInsets.symmetric(vertical: 8, horizontal: 8),
padding: const EdgeInsets.all(10),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8.0),
),
child: Row(
children: <Widget>[
Container(
width: 60,
height: 60,
padding: const EdgeInsets.all(10.0),
margin: const EdgeInsets.only(right: 8),
decoration: BoxDecoration(
color: Theme.of(context).primaryColor.withOpacity(0.2),
borderRadius: BorderRadius.circular(8.0),
),
child: SvgPicture.asset(
notificationIcon,
colorFilter: ColorFilter.mode(
Theme.of(context).primaryColor, BlendMode.srcIn),
),
),
Expanded(
child: DefaultTextStyle(
style: normalSize13Text(greyTextColor),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
title ?? '',
style: boldSize15Text(blackColor),
overflow: TextOverflow.ellipsis,
maxLines: 1,
),
Text(
body ?? '',
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
],
),
),
),
],
),
),
);
},
duration: const Duration(seconds: 5),
);
}