CODEWITHSUNDEEP
xamarin.formsuwp
Finitely Failed
Finitely Failed

Reputation: 129

UWP, how to handle images and scaling?

We have a Xamarin Forms project which shall run on Android, iOS and UWP. On Android you have a number of different images in different folder to support a vast number of different screens (and PPIs) on iOS you have a similar system (@2x, @3x etc.). I can't for the life of me find how to achive something similar for UWP. When I run the project on a Windows tablet with a recommended scaling of 150 % or 200 % all the images are also scaled up, which results in a blurry image. I can't find any thing on how to handle images in an UWP app, even for a "native" (not using Xamarin) UWP app.

Upvotes: 2

Views: 1301

Answers (1)

Depechie
Depechie

Reputation: 6142

Scaling images in UWP native is done by supplying different scaled versions in the Assets folder.

The file naming pattern is like so : ****.scale-100.png or ****.scale-200.png The actual file name to use in your app is still ****.png but the system will auto detect the needed scaled version and use that.

For reference the doc on this is here https://learn.microsoft.com/en-us/windows/uwp/app-resources/images-tailored-for-scale-theme-contrast and here https://learn.microsoft.com/en-us/windows/uwp/app-resources/tailor-resources-lang-scale-contrast

Recommended scale factors are 100, 200 and 400.

Upvotes: 5

Related Questions