Can we have Multiple Resolution Images as Embedded Files in Xamarin Shared Project?

Question

In my app, I have a bunch of images that I currently reference them in my Xamarin Shared Project. For instance, I have the following code:

<Image x:Name="imgAddNewProject" HeightRequest="30" WidthRequest="30" Source="{imgres:ImageResource FoodApp.Images.addnew.png}"/>

The image files are located in the Images folder of the Shared Project. All of this works fine except that the images are jagged in low resolution environments. Instead of a single image called addew.png, can I have the following:

addnew.scale-100.png
addnew.scale-125.png
addnew.scale-150.png
addnew.scale-200.png
addnew.scale.400.png

The implication is that the image with the right resolution will be picked by the platform at runtime. I know this works when I refer to the images in the platform specific code. For instance in the assets folder of the UWP project or the assets\drawable folder of the Android project. I prefer to have all the images in the Shared Project and yet account for multiple screen resolutions.

Any and all guidance will be appreciated.

Answer 1

If we want to use Multiple Resolution Images, the Image files need to be added to each platform.

To use a single image across all apps, the same filename must be used on every platform, and it should be a valid Android resource name (i.e. only lowercase letters, numerals, the underscore, and the period are allowed).

• iOS - The preferred way to manage and support images since iOS 9 is to use Asset Catalog Image Sets, which should contain all of the versions of an image that are necessary to support various devices and scale factors for an application. For more information, see Adding Images to an Asset Catalog Image Set.
• Android - Place images in the Resources/drawable directory with Build Action: AndroidResource. High- and low-DPI versions of an image can also be supplied (in appropriately named Resources subdirectories such as drawable-ldpi, drawable-hdpi, and drawable-xhdpi).i).

For more details, please check the MS docs. https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/images?tabs=windows#local-images