0% found this document useful (0 votes)
9 views

labTask12

This document outlines a lab task for implementing Toast and Local notifications in a Flutter application. It provides step-by-step instructions for creating a new project, adding necessary dependencies, and coding the notification functionalities in separate Dart files. The task also includes an exercise to apply these notifications to student management actions such as adding, deleting, and updating student information.

Uploaded by

yabsram94
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
9 views

labTask12

This document outlines a lab task for implementing Toast and Local notifications in a Flutter application. It provides step-by-step instructions for creating a new project, adding necessary dependencies, and coding the notification functionalities in separate Dart files. The task also includes an exercise to apply these notifications to student management actions such as adding, deleting, and updating student information.

Uploaded by

yabsram94
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 10

Task 12:

Topic: Toast and Local notification


Objective: This lab task is to exercise on Toast notification which is pop up at the bottom of the screen for
short duration and Local Notification used to inform users when a certain event happens.

To do Toast notification task please follow the following step: -


 create new flutter project with the name of notifications
 add fluttertoast dependency to pubspec.yaml
 to get the latest version you can visit pub.dev
Example

 as usual don’t forget running flutter pub get


 next create notification_file folder in lib directory
 inside notification_file folder create Toast_notificatio.dart file

 for Toast_notificatio.dart file

import 'package:flutter/material.dart';
import "package:fluttertoast/fluttertoast.dart";

class GetToastNotification {
static void showToastNotiction(String info_disp) {
Fluttertoast.showToast(
msg: info_disp,
89
toastLength: Toast.LENGTH_SHORT,
gravity: ToastGravity.BOTTOM,
timeInSecForIosWeb: 1,
backgroundColor: const Color.fromARGB(255, 60, 24,
161),
textColor: Colors.white,
fontSize: 16.0,
);
}
}

 main .dart

import 'package:flutter/material.dart';
import 'package:notifications/notification_file
/Toast_notificatio.dart';

void main() {
runApp(const MaterialApp(
home: Notification(),
debugShowCheckedModeBanner: false,
));
}

class Notification extends StatelessWidget {


const Notification({super.key});

@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: ElevatedButton(
90
onPressed: () {
GetToastNotification.showToastNotiction(
"Hi this is toast notification");
},
child: Text('Show Toast notification'),
),
),
);
}
}

After the above code run After show toast button clicked

The above toast notification defines once in Toast_notificatio.dart file and you can use in any place through
your application screens.

91
To do Local notification task please follow the following step: -
 continue with the above application
 add flutter_local_notifications dependency to pubspec.yaml next to fluttertoast
 to get the latest version you can visit pub.dev

 don’t forget flutter pub get


 inside notification_file folder creates local_notification.dart file

 local_notification.dart

import
'package:flutter_local_notifications/flutter_local_notif
ications.dart';

class GetLocalNotification {
static final FlutterLocalNotificationsPlugin
flutterLocalNotificationsPlugin =
FlutterLocalNotificationsPlugin();

static Future<void> initializeNotifications() async {


const AndroidInitializationSettings
initializationSettingsAndroid =

92
AndroidInitializationSettings('@mipmap/ic_launch
er');

const InitializationSettings initializationSettings


=
InitializationSettings(
android: initializationSettingsAndroid,
);

await
flutterLocalNotificationsPlugin.initialize(initializatio
nSettings);
}

static Future<void> showNotification(String title,


String info_disp) async {
const AndroidNotificationDetails
androidPlatformChannelSpecifics =
AndroidNotificationDetails(
'id',
'ch_name',
channelDescription: 'ch_description',
importance: Importance.max,
priority: Priority.high,
showWhen: false,
);

const NotificationDetails platformChannelSpecifics =


NotificationDetails(android:
androidPlatformChannelSpecifics);

93
await flutterLocalNotificationsPlugin.show(
0,
title,
info_disp,
platformChannelSpecifics,
payload: 'id',
);
}
}

 update the main.dart file

import 'package:flutter/material.dart';
import
'package:notifications/notification_file/Toast_notificat
io.dart';
import
'package:notifications/notification_file/local_notificat
ion.dart';

void main() async {


WidgetsFlutterBinding.ensureInitialized();
await GetLocalNotification.initializeNotifications();
runApp(const MaterialApp(
home: Notification(),
debugShowCheckedModeBanner: false,
));
}

class Notification extends StatelessWidget {


const Notification({super.key});

94
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
ElevatedButton(
onPressed: () {
GetToastNotification.showToastNotiction(
"Hi this is toast notification");
},
child: Text('Show Toast notification'),
),
SizedBox(
height: 20,
),
ElevatedButton(
onPressed: () {
GetLocalNotification.showNotification(
"Add student", "one student is
added");
},
child: Text('Show Local notification'),
),
],
)),
);
}
}

95
After run the above code After show local notification button clicked

96
After swiping down the phone top screen

 Exercise: apply this local and toast notification on previous task to get new notification when student
add, delete and update.
 Your expected screens are bellow

97
Add new student (add Update student data After swiping down the After expanding the
button clicked) ( update button clicked phone student_info notification

Happy codding !!

98

You might also like