how to get different resolutions and different file names in the drawable- folders for custom resources

[louisdoe]

Hi,

regarding android_custom_resources.js, how should I name the several custom icon file that I put in the resources/android/custom folder so that they go to the right drawable-* folder ?

I am working with OneSignal notifications, as you can see here they mention several size for the icons files.
Or maybe do I have to only use one format and this hook takes care of degrading the file to other resolutions ?

I tried to put all the drawable-* folders containing their respective custom icon to resources/android/custom but it doesn't work with ionic package...

Thanks

[imhoffd]

@louisdoe Just put your icon image file in resources/android/custom.

ionic resources will create files for all the various resolutions automatically.

Let us know if you have any problems.

[louisdoe]

Hi @dwieeb

Can you reopen the thread please, you closed it too quickly ! I modified the title...it's more complicated than this.

Actually, your solution partially works, the custom icons are there in the .apk. But there are 2 issues:

1. the icons generated by ionic package and placed in the .apk in the drawable-* folders do not have the right resolutions...they all have the same resolution as the original file (512x512 in my case). Please see my build number 190 (app id: bc689f0f). The icon files resolutions must be as recommended by https://documentation.onesignal.com/docs/customize-notification-icons

2. the other problem is that OneSignal requires that the largest icon be named differently as they say in the doc:

    /drawable-[SIZE_NAMES]/ic_stat_onesignal_default.png
    /drawable-xxxhdpi/ic_onesignal_large_icon_default.png (Large Icon)

there's _large_icon in the name of the largest icon...

Any idea how to manage that ?

I am showing this thread to a guy at OneSignal so they know.

[louisdoe]

@dwieeb should I open another issue ? I am not sure what are the best practices here

[jkasten2]

@louisdoe From the developer's comment and reviewing the android_custom_resources.js source you should only need 2 files if you want both a large and small default icon from your app.

(72x72) (small icon)
<project-root>/resources/android/custom/ic_stat_onesignal_default

(256x256) (large icon)
<project-root>/resources/android/custom/ic_onesignal_large_icon_default

@dwieeb
I am not very familiar with your code but I don't see where the images are being resized in the correct resolutions.

[imhoffd]

@jkasten2 @louisdoe Hmm... I had the wrong impression on how this script worked. I thought once the image was placed in resources/android/custom, the Ionic CLI command $ ionic resources automatically scaled the image, but it looks like this script is just copying the drawables and not resizing them appropriately.

We'll have to plan out some time to fix this on our end.

[louisdoe]

Ok thanks for your response @dwieeb .
Can you give me a temporary workaround so I can push the correct custom icons to my app ?

Thanks

[themastersoda]

@louisdoe i don't know if you figured it out already by now or no, but this might help someone having the same problem. Replace the fs.stat() call after the copy function with this:

fs.stat(customResourcesDir, function(err, stats) {
    if (err || !stats.isDirectory()) {
      return deferred.resolve();
    }

    fs.readdir(customResourcesDir, function(err, files) {
      var copies = [];
      for (var i in files) {
        var innerDir = path.join(customResourcesDir, files[i]);
        var innerFiles = fs.readdirSync(innerDir);
        for (var k in innerFiles){
          var innerFilePath = path.join(innerDir, innerFiles[k]);
          var innerDestPath = path.join(androidPlatformDir, 'res', files[i], innerFiles[k]);

          copies.push([innerFilePath, innerDestPath]);
        }
      }

      copies.map(function(args) {
        return copy.apply(copy, args);
      });

      Q.all(copies).then(function(r) {
        deferred.resolve();
      }, function(err) {
        console.error(err.stack);
        deferred.reject(err);
      });
    });
  });

this script assumes that inside your <project root>/resources/android/custom directory, files are placed in the folders named the same as the ones you expect them to be copied to. For example, if I have a file <my project>/resources/android/custom/drawable-xxhdpi/myfile.png, it will be copied to:
<my project>/platforms/android/res/drawable-xxhdpi/myfile.png

It will surely break if you have files in the /custom directory itself, but otherwise it did the job for me and I hope it helps someone else looking for a temporary solution.

[marcthomsen]

Thanks @themastersoda
Your fix made the difference.

[themastersoda]

@marcthomsen happy I could help someone

[ZenSide]

@themastersoda thanks for your suggestion, but how do you do to modify the hook code as it's executed by Ionic Package cloud service ?