CODEWITHSUNDEEP
androidiosxamarinxamarin.iosxamarin.forms
TheDeveloper
TheDeveloper

Reputation: 1217

Image resolutions for iOS and Android apps

I am creating an application in Xamarin forms both both iOS and Android which will also have images in it. I have two questions.

  1. Can I have one image and use some API calls to modify the resolutions based on the device.

  2. If not, what are the different resolutions needed, for targeting iOS and Android devices both phones and tablets

Upvotes: 1

Views: 347

Answers (1)

jgoldberger - MSFT
jgoldberger - MSFT

Reputation: 6088

  1. You certainly could, but this could slow down performance especially if you are loading a lot of images and need to resize often.

  2. I believe it is better to pre-supply images at the correct resolutions. Both Android and iOS have good mechanisms for doing so and the way to do it is identical in Xamarin as in a native app project.

In iOS you can add an image set to your asset catalog for each image you will use and the three different resolutions for that image will go in that Image set, helping to keep things organized. There are no set resolutions, but you would want 1x, 2x and 3x versions where 1x is the "base" version that will be used on non-retina devices, 2x should be double the resolution of 1x and will be used on retina devices, where 3x should be 3x the res of 1x and (I believe) will be used for the 6 Plus and 7 Plus iPhone models.

For Android, it gets a bit more complex, but basically you provide multiple resource image folders (usually named "drawable" but can also be "mipmap") with screen density qualifiers in the names of the folders, e.g. drawable-hdpi or mipmap-hdpi. See this Android document for more info: https://developer.android.com/guide/practices/screens_support.html

Here are the screen density qualifiers you can use: ldpi (low) ~120dpi mdpi (medium) ~160dpi hdpi (high) ~240dpi xhdpi (extra-high) ~320dpi xxhdpi (extra-extra-high) ~480dpi xxxhdpi (extra-extra-extra-high) ~640dpi

Again the actual size of the image is up to you, but the resolution of, e.g. the mdpi version would want to be ~30% larger that the version in the ldpi folder and so on.

Upvotes: 1

Related Questions