How to generate icons for Xamarin file/ folder structure with two images in each folder

Issue

The default structure for icons in a Xamarin application for an android app at the moment is:

folders:

mipmap-hdpi

mipmap-mdpi

mipmap-xhdpi

mipmap-xxhdpi

mipmap-xxxhdpi

And within each of these folders there are two PNG images that are named:

icon.png

launcher_foreground.png

I have searched for a couple of hours to find some sort of generator that can generate the "launcher_foreground.png" image. All the generators I have seen only generate ONE image in each of these folders.

According to Xamarin, including two images in each of these folders is "good practice" but every generator I have seen does not generate icons this way. Is there a tool that anyone knows of that can generate each of these images in the format stated above?

If not, is there a way I can use a single SVG file as an icon? Since an SVG file can scale dynamically and has been able to do so for a very long time. Is there a better way to do this?

Solution

You cannot use an svg as your app icon because Android doesn't support that, but you can resize your images (svg or png) automatically to the Android, iOS, UWP standard required sizes using ResizetizerNT package.

1. Download and Install the Nuget Package in all your projects (shared and native).
2. Add your image to the shared project, and set it build action to "SharedImage" (this build option will only be available after package is installed).
3. In your shared project .csproj file, specify the BaseSize property for your image: It should correspond to the x1 size or in Android the mdpi size 48,48 source and for the second one 108,108.

 <ItemGroup>
  <SharedImage Include="icon.svg" BaseSize="48" />
  <SharedImage Include="icon.svg" BaseSize="108" Link="launcher_foreground.png" />
</ItemGroup>

4. Output (resized) images will be found in folder: obj\[Debug|Release]\100\resizetize\r\

Resources

Documentation: How to use it

Author explanation video

Official repo

Answered By - Cfun