How to add Notification in Flutter | 2023 | Awesome Notification Flutter

in this video we will see how to create a local notification now in order to integrate the local notification we gonna use a awesome package called awesome modification so first let's go to its pub.dev page and here we'll copy this package Name by clicking on this copy icon and then inside our project you will paste it inside the Box peg.tml file and then make sure you save the file or click on the download button in order to face the package and after that let's do the setup for Android and iOS respectively now for the Android setup now here inside the peel.gradle file we have to change the minimum SDK version to 21 and compile and Target SDK versions to 33. so to do that open the project and navigate to build.gradle file which is inside the Android slash app so in it we will change the compile SDK version to 33 then change the minimum SDK version to 21 and Target SDK version to 33 then inside the Android manifest file we need to add Android exported equal to 2 so back to the project here we will open the Android manifest file then inside the activity tag just make sure to add this Android exported equal to True attribute and that's all the setup we are required to get started in Android now for the iOS setup and by surprise we actually don't require that much setup for iOS if I am being honest it will be just verifying if this require variable have their desired value so to check this go back to your project and right click on the iOS folder and click on open in xcode and inside the xcode make sure to select the runner in the upper left corner and click on the build setting now here we'll make sure that this variables are set to the appropriate value so first let's find the peel library for distribution and it is set to no check then the save if your extension and that's to set to no check and lastly make sure that the iOS deployment Target is set to iOS 11 and that's all the things we need to verify in order to get started in iOS now we will initialize the awesome notification so that if we can create notifications in the later videos so in the main.dot file inside the main function call the also notification Constructor and then call Dot initialize now this method will initialize the plug again and as you can see it takes four parameters a default icon channels group channels and debug so first for the default icon we'll pass a null value so that it uses the default icon of the application but later we will see how to add a custom icon then we will pass a list of notification Channel which are essential for creating the notification so in it we will specify the channel key channel name Channel description which will be shown in the notification setting of the application like this and then set the debug to true and then inside my home page stateful widget we will override the init State method now as per the latest version of Android and iOS we are required to ask the user's permission to send notification so to do that we will call also notification dot is notification allowed and this will give us the current status of the notification and based on that we will check if is allowed is false then call also notification dot request permission to send notification and that's all for the initialization now if you hot restart the application we will get a pop-up inside the application which says allow notification course to send you notification now the user can click on allow or don't allow please click on the allow button now let's create the notification so let's do it now inside the code I have made this small change I have added an elevated button with a child of text trigger notification and an empty on press callback now can only trigger a notification we have to create a function name trigger notification so first let's change this empty callback to trigger notification and then up here we'll create the trigger notification function and inside it call also notifications dot create notification this method requires the notification content so let's add contained equal to notification content now here we are required to specify a unique ID and a channel key and a lot of other properties which spoiler alert we're gonna look in the coming videos but in order to create a basic notification we only need to specify title and body so inside the notification content first we'll specify a unique ID then the channel key equal to basic Channel which we have created inside the initialize method as you can see here then we will add a title equal to simple notification but it could be whatever you want then add a body and now if we hot restart and as I click on this trigger notification you can see we get a new notification here with the exact same title and body now feel free to play around with it and if you like to learn more about other types or notifications such as notification with an action button progress bar a group chat notification and a media playback notification and a lot more then check the link in the description thank you

Channel: Flutter UI Dev

Views: 29,676

Keywords: flutter, flutternotifications, notification in flutter, flutter notification, awesome notificaiton, flutter awesome notification, how add notifications in flutter, how to add awesome notification in flutter, awesome notification package flutter, awesome notification pub, awesome notification dart, push notifications in flutter

Id: -W2LDnWKhag

Length: 5min 43sec (343 seconds)

Published: Thu Jan 26 2023