fcm_config

Description:

fcm config

fcm_config #
What can this packge do #

Show fcm notification while app is in forground
Easly recieve incoming notification where you are
Easly recieve clicked where you are
Notification is an object

Setup #
Android #


Follow steps here https://firebase.flutter.dev/docs/installation/android
open android/app/src/main/AndroidManifest.xml file
Add the following meta-data schema within the application component



after or befaore this

<meta-data android:name="flutterEmbedding" android:value="2" />
copied to clipboard

set this

<meta-data
android:name="com.google.firebase.messaging.default_notification_channel_id"
android:value="high_importance_channel" />
copied to clipboard

you can change to your own value high_importance_channel but note it will be used later



if you want to change default icon you can do this


<meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@mipmap/custom_icon" />
copied to clipboard

you can change @mipmap/custom_icon to any icon from mipmap or drawable its up to you but note this will be applied for background only
you can set foreground from dart code

Ios #



Follow steps here https://firebase.flutter.dev/docs/installation/ios




Then here https://firebase.flutter.dev/docs/messaging/apple-integration


iOS 10 is now the minimum supported version by FlutterFire. Please update your build target version.
you can not change default icon

MacOs #



Follow steps here https://firebase.flutter.dev/docs/installation/macos




Then here https://firebase.flutter.dev/docs/messaging/apple-integration


you can not change default icon

Web #



Follow steps here https://firebase.flutter.dev/docs/installation/web




Add fcm js liberary like here https://firebase.flutter.dev/docs/messaging/overview#5-web-only-add-the-sdk




Add firebase-messaging-sw.js in your web folder see the example to see what this file contains





Dart/Flutter #

Initialize

void main() async {
await FCMConfig.instance
.init(
defaultAndroidForegroundIcon: '@mipmap/ic_launcher', //default is @mipmap/ic_launcher
defaultAndroidChannel: AndroidNotificationChannel(
'high_importance_channel',// same as value from android setup
'Fcm config',
importance: Importance.high,
sound: RawResourceAndroidNotificationSound('notification'),
),
);
runApp(MaterialApp(
home: MyHomePage(),
));
}
copied to clipboard

Background messages(Web not supported)


To handle message in background you can do that

Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
print("Handling a background message: ${message.messageId}");
}

void main() async {
FCMConfig.instance.init(onBackgroundMessage:_firebaseMessagingBackgroundHandler);
runApp(MaterialApp(
home: MyHomePage(),
));
}
copied to clipboard

To know more about background handler please https://firebase.flutter.dev/docs/messaging/usage#background-messages


Get token

FCMConfig.instance.messaging.getToken().then((token) {
print(token);
});
copied to clipboard

To get notification that launched the application

await FCMConfig.instance.getInitialMessage();// may be null

copied to clipboard

Listen to incomming notification :


First option

class MyScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return FCMNotificationListener(
onNotification:
(RemoteMessage notification, void Function() setState) {},
child: SizedBox(),
);
}
}
copied to clipboard

Second option

class MyScreen extends StatefulWidget {
@override
_MyScreenState createState() => _MyScreenState();
}

class _MyScreenState extends State<MyScreen>
with FCMNotificationMixin {
@override
Widget build(BuildContext context) {
return SizedBox();
}

@override
void onNotify(RemoteMessage notification) {
// do some thing
}
}

copied to clipboard

Listen to notification tap:


First option

class MyScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return FCMNotificationClickListener(
onNotificationClick:
(RemoteMessage notification, void Function() setState) {},
child: SizedBox(),
);
}
}
copied to clipboard

Second option

class MyScreen extends StatefulWidget {
@override
_MyScreenState createState() => _MyScreenState();
}

class _MyScreenState extends State<MyScreen>
with FCMNotificationClickMixin {
@override
Widget build(BuildContext context) {
return SizedBox();
}

@override
void onClick(RemoteMessage notification) {
// do some thing
}
}

copied to clipboard

Localize your notification #

see https://pub.dev/packages/fcm_localization