cordova-plugin-firebase
Advanced tools
Comparing version 2.0.5 to 2.0.6
@@ -6,39 +6,33 @@ # Notifications | ||
## Changing Notification Icon | ||
The plugin will use notification_icon from drawable resources if it exists, otherwise the default app icon is used. | ||
To set a big icon and small icon for notifications, define them through drawable nodes. | ||
Create the required `styles.xml` files and add the icons to the | ||
`<projectroot>/res/native/android/res/<drawable-DPI>` folders. | ||
By default Firebase will use the app icon as the notification icon. The icon is treated as a silhouette, so if the app icon has a background, it might appear as a large blob. To change the icon, you need to [add the icons](#add-the-icons) to the project and [configure firebase](#configure-firebase). | ||
The example below uses a png named `ic_silhouette.png`, the app Icon (@mipmap/icon) and sets a base theme. | ||
From android version 21 (Lollipop) notifications were changed, needing a separate setting. | ||
If you only target Lollipop and above, you don't need to setup both. | ||
Thankfully using the version dependant asset selections, we can make one build/apk supporting all target platforms. | ||
`<projectroot>/res/native/android/res/values/styles.xml` | ||
### Add the icons | ||
Add your icons to your project in your res directory, such as `<projectroot>/res/native/android/res/<drawable-DPI>`. Make sure the icons all have the same name (example has ic_silhouette). Next, we will need to copy the icons over to the Android project when it is created. To do this, add the following lines to your `config.xml`. | ||
``` | ||
<?xml version="1.0" encoding="utf-8" ?> | ||
<resources> | ||
<!-- inherit from the holo theme --> | ||
<style name="AppTheme" parent="android:Theme.Light"> | ||
<item name="android:windowDisablePreview">true</item> | ||
</style> | ||
<drawable name="notification_big">@mipmap/icon</drawable> | ||
<drawable name="notification_icon">@mipmap/icon</drawable> | ||
</resources> | ||
<platform name="android"> | ||
.... | ||
<resource-file src="res/native/android/res/drawable-hdpi/ic_silhouette.png" target="app/src/main/res/drawable-hdpi/ic_silhouette.png"/> | ||
<resource-file src="res/native/android/res/drawable-xhdpi/ic_silhouette.png" target="app/src/main/res/drawable-hdpi/ic_silhouette.png"/> | ||
... Repeated for each screen resolution you have a notification icons for... | ||
</platform> | ||
``` | ||
and | ||
`<projectroot>/res/native/android/res/values-v21/styles.xml` | ||
Note: the src of the files is not important, but the target directory with the proper dpi filter is very imporant. You will also need to name all the icons the same name. | ||
### Configure Firebase | ||
We need to copy a metadata flag into the Manifest to tell Firebase which icon to use. To do this, add the following line to your `config.xml`. | ||
``` | ||
<?xml version="1.0" encoding="utf-8" ?> | ||
<resources> | ||
<!-- inherit from the material theme --> | ||
<style name="AppTheme" parent="android:Theme.Material"> | ||
<item name="android:windowDisablePreview">true</item> | ||
</style> | ||
<drawable name="notification_big">@mipmap/icon</drawable> | ||
<drawable name="notification_icon">@drawable/ic_silhouette</drawable> | ||
</resources> | ||
<platform name="android"> | ||
.... | ||
<config-file parent="/manifest/application" target="AndroidManifest.xml"> | ||
<meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/ic_silhouette" /> | ||
</config-file> | ||
</platform> | ||
``` | ||
Note: If you have XML Namespace issues, which I encountered when trying to build in Android Studio, add this `xmlns:android="http://schemas.android.com/apk/res/android"` to the widget element at the root of the `config.xml`. | ||
## Notification Colors | ||
To add color to the custom icon, you will need to [create a color definition](#create-a-color-definition) and [configure firebase color](#configure-firebase-color). | ||
### Create a Color Definition | ||
On Android Lollipop and above you can also set the accent color for the notification by adding a color setting. | ||
@@ -55,1 +49,46 @@ | ||
``` | ||
You will again need to copy this file over to your project to get it to work by adding these lines to your `config.xml` | ||
``` | ||
<platform name="android"> | ||
... | ||
<resource-file src="res/native/android/res/values/colors.xml" target="app/src/main/res/values/colors.xml"/> | ||
</platform> | ||
``` | ||
### Configure Firebase Color | ||
We need to copy a metadata flag into the Manifest to tell Firebase which color to use for the icon. To do this, add the following line to your `config.xml`. | ||
``` | ||
<platform name="android"> | ||
.... | ||
<config-file parent="/manifest/application" target="AndroidManifest.xml"> | ||
<meta-data android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/primary" /> | ||
</config-file> | ||
</platform> | ||
``` | ||
Note: If you have XML Namespace issues, which I encountered when trying to build in Android Studio, add this `xmlns:android="http://schemas.android.com/apk/res/android"` to the widget element at the root of the `config.xml`. | ||
# Final Result | ||
If you added a custom icon and color, your `config.xml` should include something like this. | ||
``` | ||
<widget .... xmlns:android="http://schemas.android.com/apk/res/android"> | ||
... | ||
<platform name="android"> | ||
<!-- Copy the color definition --> | ||
<resource-file src="res/native/android/res/values/colors.xml" target="app/src/main/res/values/colors.xml"/> | ||
<!-- Copy the icons --> | ||
<resource-file src="res/native/android/res/drawable-hdpi/ic_silhouette.png" target="app/src/main/res/drawable-hdpi/ic_silhouette.png"/> | ||
<resource-file src="res/native/android/res/drawable-xhdpi/ic_silhouette.png" target="app/src/main/res/drawable-xhdpi/ic_silhouette.png"/> | ||
<resource-file src="res/native/android/res/drawable-xxhdpi/ic_silhouette.png" target="app/src/main/res/drawable-xxhdpi/ic_silhouette.png"/> | ||
<resource-file src="res/native/android/res/drawable-xxxhdpi/ic_silhouette.png" target="app/src/main/res/drawable-xxxhdpi/ic_silhouette.png"/> | ||
<!-- Configure Firebase --> | ||
<config-file parent="/manifest/application" target="AndroidManifest.xml"> | ||
<meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/ic_silhouette" /> | ||
<meta-data android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/primary" /> | ||
</config-file> | ||
</platform> | ||
</widget> | ||
``` |
@@ -11,3 +11,3 @@ { | ||
"name": "cordova-plugin-firebase", | ||
"version": "2.0.5", | ||
"version": "2.0.6", | ||
"description": "Cordova plugin for Google Firebase", | ||
@@ -14,0 +14,0 @@ "cordova": { |
@@ -1,3 +0,1 @@ | ||
[![Build Status](https://travis-ci.org/arnesson/cordova-plugin-firebase.svg?branch=master)](https://travis-ci.org/arnesson/cordova-plugin-firebase) | ||
# cordova-plugin-firebase | ||
@@ -61,1 +59,5 @@ This plugin brings push notifications, analytics, event tracking, crash reporting and more from Google Firebase to your Cordova project! Android and iOS supported. | ||
See the full [API](docs/API.md) available for this plugin. | ||
## Supporters | ||
[PassportReader](https://passportreader.app) identity verification API - Get started for free - $0.01 per verification |
@@ -26,3 +26,3 @@ var fs = require("fs"); | ||
// modify the line to add the necessary dependencies | ||
var googlePlayDependency = whitespace + 'classpath \'com.google.gms:google-services:4.1.0\' // google-services dependency from cordova-plugin-firebase'; | ||
var googlePlayDependency = whitespace + 'classpath \'com.google.gms:google-services:4.2.0\' // google-services dependency from cordova-plugin-firebase'; | ||
var fabricDependency = whitespace + 'classpath \'io.fabric.tools:gradle:1.25.4\' // fabric dependency from cordova-plugin-firebase' | ||
@@ -119,2 +119,2 @@ var modifiedLine = match[0] + '\n' + googlePlayDependency + '\n' + fabricDependency; | ||
} | ||
}; | ||
}; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Deprecated
MaintenanceThe maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.
Found 1 instance in 1 package
98476666
676
0
63
211