-
Notifications
You must be signed in to change notification settings - Fork 1.9k
Phonegap Build: Notification doesn't show app icon #118
Comments
@shamank the problem is PhoneGap Build. You don't have access to the res/drawables folder on PGB. You can only upload your www folder and hooks don't run on PGB as well. So there is no way for you to upload the icon you want to use to PGB. The two possible workarounds are:
|
But I want to use my default app icon, the icon that is already there in the res/drawables folder. Why is it not taking it as the default? That icon is 57x57 png, the same that is in the root folder |
Is there some example icon I could see to be able to understand the properties I need for the icon? |
Sorry to insist in this, but I would really appreciate your help. |
@shamank here is an example icon. You'll notice that the image only has two color pixels, black and transparent. Android 5+ will take your image and replace all non transparent pixes with white. So when you are creating an icon you should take the transparency factor into account. If there is no transparency the who image turns white. That's why we give you the option to supply a different icon for the push notification. |
Oh god... That's really bad news. The guys from Build Phonegap told me I can't upload custom images to the drawable folder. Is there a way I could hide the little icon and just show the bigger image (when available)? It would be really really helpful to me (and users migrating to this plugin since the most popular one -I was using it- stoped working in Android 5 and the project is not being updated anymore) if:
Is it possible? Thanks! |
@shamank this is how I fixed the white icon in my Ionic app. If you have specific questions, just let me know. http://forum.ionicframework.com/t/android-lolipop-nexus-push-notifications-plugin-icon-is-white/29724 |
Thank you! That site is really a very valuable resource and will save me a lot of time in the future :) |
The images don't go in the www folder. They go into the platform specific folder for Android. Idk, what those are in a phone gap project, but I'd assume it's fairly similar to Ionic. I'm using Ionic's CLI tool to build. If I were you, I'd really consider switching to Ionic, the performance is much better as well as a whole host of other reasons. |
I use ionic too (my current project I built using jqm however). compiling from the cli is different, there you can access those folders. The problem is that in Phonegap Build you can't. I use Build because it's a lot of easier compiling for iOS too (I'm on Linux). Now I have a vm with the last OSX installed and is what I use to send to AppStore, but I'm very used to use this cloud service, and switching will imply a lot of things I don't want to do :P |
A quick fix for this although not ideal is to set your targetSdkVersion to 20 (anything less than 21) as per this stack overflow. http://stackoverflow.com/questions/30795431/icon-not-displaying-in-notification In your config.xml add.. If you really want the new layout, you could try creating a plugin. Plugins are able to copy resources into the res folder of your android project. If you are paying for PG Build you can have private plugins otherwise you need to publish to npm. In your plugin.xml add a resource line for each icon resolution.. |
Wow! The last solution sounds really good! I will build this plugin and tell if that worked. Thank you! |
@shamank thank you, I've just posted question on Phonegap build forum, before reading your answer here. I would like to use custom icons/images for notification bar actions buttons. Of course it works fine with cordova-cli, but in phonegap build apk they're missing :-(. @smdvdsn is there any plugin in the wild, we can use? |
+1 I'm having this issue as well.
Question: if I lower my targetSdkVersion, does that mean my app doesn't work for any users on lolipop? |
@smdvdsn, I don't understand how a plugin will help here. Plugins get registered and invoked after the apk has been built - more specifically during run time. Phonegap Build won't move things into the res directory, so the only alternative is to copy the icons from the www directory to the res directory after starting the app. If a plugin was going to copy something from the www to the res directory after the application has started, the R class has already been generated (it's dynamically generated) and ids are assigned. I don't think you could access a new resource added later. Please prove me wrong if that's not the case (see the link below for someone who thinks it might be possible). I did find that in the newest android API (23 or code name M) they let you build your own Icon object, so that will work - dependent on PGB letting you build with targetSdkVersion of 23 and users having that version, nether which is the case. When that happens, it would look like:
@shamank and @mauron85, any luck on other solutions? Lastly, I saw this guy post a similar question to SO: http://stackoverflow.com/questions/30802589/how-to-add-native-image-with-phonegap-build |
@kentmw what I'm suggesting is using/abusing the way plugins are installed in your project. The plugin.xml contains entries that tell plugman where to install the files into your project. By creating a plugin that contains your notification icons and plugin.xml with resource-file entries it should copy the icons over for you. Your plugin would have no runtime components. The inappbrowser is an example of a plugin that has resource images. You can see it here https://github.com/apache/cordova-plugin-inappbrowser/blob/master/plugin.xml#L53 |
Hmm... it seems that the resources that the plugin can grab have to be inside the plugin itself... which makes making a generic one impossible. |
I haven't released the plugin publically, just trying it out privately so far. But you can take a look at: https://github.com/kentmw/secondary-icon |
@kentmw secondary-icon looks nice, but how will you propagate it to PGB? The only way in my mind is npm. But I don't encourage anybody to do so. It's a crazy idea to polute npm with res only plugins. |
Well, you have to fork the project as resources are only accessible to the plugin project and when you do so, the plugin contains your propriatary content, so it should be a private plugin. If it's a private plugin, it shouldn't be on npm or PGB as a public plugin, so I'm submitting my fork as a private plugin to PGB. |
Ahh. I forgot that there are private plugins on PGB. Then it sounds like solution. Anybody who needs this should create their own private res only plugin. For me it means to start paying adobe tho. :-( |
If you found it useful, plus one the answer to SO: http://stackoverflow.com/questions/30802589/how-to-add-native-image-with-phonegap-build/33221780#33221780 so people know to look here and contribute to the conversation. |
Well, I got to the same conclusion than you guys, so after spending some time developing such plugin I desisted and updated my app icon instead (I know, it sucks). |
PS: Any of you is having issues with iOS push notifications? It doesn't work anymore since I implemented this plugin. |
Implemented which plugin? Phonegap-plugin-push or secondary-icon? On Tue, Oct 20, 2015, 9:44 AM Luciano Fantuzzi notifications@github.com
|
Phonegap-plugin-push. I didn't use the last one. |
Getting Adobe attention? |
Maybe your problem is similiar to this: http://stackoverflow.com/questions/20596213/white-notification-icon-for-android-with-phonegap-build-and-pushplugin/34089596#34089596 Check if my answer solves the problem: http://stackoverflow.com/a/34089596/3948755 |
Please go comment on this issue. The best way forward is to get this into a new version of Cordova that can be picked up by PGB. |
And after 3 months we are still stuck here, with a "workaround" (using all my app main icons set with transparencies -to fit the different sizes and screens-) because there's no way to reach the resources directory. Did someone solved this in any way? To PGB developers: Would it be possible for you to allow adding custom icons / images exactly the same you do for app / splash images? Ie.:
|
@shamank see my previous comment. Getting this added into Cordova is the best way to go. |
http://phonegap.com/blog/2015/11/19/config_xml_changes_part_two About the last part ("Splashscreens and Icons"), where inside the iOS tag you don't specify things like gap:something:
Is it possible now to do this...
...with custom.png being moved to native Android's assets folder? |
@shamank no, the tags |
@macdonst but if those paths (src attribute) are target locations, how does PGB builder know the source file to be copied from? I think they act the same as before but just inside a tag defining the scope (platform name="X"). My hope was because of the contents (icon & splash tags) inside the ios platform tag, where they don't specify "gap" attributes, so I thought they are now being copied to the assets folder as is (right now, if they don't match a gap:qualifier pattern they will be ignored). |
guys, it looks like there's support from november for including custom files in the res directory (and subdirectories): phonegap/build#401 (comment) |
I can confirm it works :D problem solved! |
@shamank Could you explain more detail ? About how to use custom image, and how to configure PushNotification to use my custom icon. |
@kun192 Short solution:
To allow the plugin to use a custom icon (pin.png) and not taking the default app icon (icon.png) just add the locales/android/drawable folder structure in the root of your project (Ie. where it's supposed you have your main index.html) and add the custom icon file (pin.png) inside: locales/android/drawable/pin.png I'm using phonegap-version cli-5.2.0. |
The stackoverflow question was updated with @shamank's suggestion. |
I'm going to re-open this so I will remember to document it. 😄 |
Anybody know what size the icon PNG should be? |
@benmcmaster 24x24px |
I am using the image, generated by https://romannurik.github.io/AndroidAssetStudio/icons-notification.html#source.type=image&source.space.trim=1&source.space.pad=0&name=system even but the icon is still white. In my init I use
|
This thread has been automatically locked. |
Hi. I'm using build.phonegap.com to compile my app. I'm using the last available version (cli-5.1.1) and the last version of this plugin (1.2.3, updated 2 hours ago and tested everything again). My phone is a Nexus 5 running Android 5.1.1.
This is my current config:
And this is the result:
![screenshot_2015-09-09-01-36-58](https://cloud.githubusercontent.com/assets/819192/9762927/0c2278fc-56dd-11e5-853e-f1e856be98b7.png)
![screenshot_2015-09-09-01-37-44](https://cloud.githubusercontent.com/assets/819192/9762928/0c22f69c-56dd-11e5-89c9-0a562214505e.png)
My app icon is present everywhere in drawable folders (ldpi, mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi). My phone is using xxxhdpi. I tried adding the custom var icon:
...and only worked as expected the iconColor property, but the icon is still missing.
![icon-192-xxxhdpi](https://cloud.githubusercontent.com/assets/819192/9763093/f6d83b66-56dd-11e5-8664-f55f7ee1f604.png)
![screenshot_2015-09-09-01-38-48](https://cloud.githubusercontent.com/assets/819192/9762929/0c278d2e-56dd-11e5-8d2d-5b1939c699b0.png)
This is the icon I'm using for xxxhdpi (res/drawable-xxxhdpi, size 192x192):
The size of the icon present in the fallback drawable folder (res/drawable) is 57x57.
It has a transparent background (to make it look a round) and a solid white for the circle background.
It's working since my app is using it for showing everywhere:
Am I missing something? I read all the other threads about, checked the new android doc regarding this (as you recommended) and even so I can't get it.
The text was updated successfully, but these errors were encountered: