Displaying whole screen image on multiple devices without stretching

Question

In my(Android) game, all of my sprites are scaled against to a particular ratio (this 'guide' ratio stays the same regardless of the actual ratio of the screen on which they are to be displayed) - these sprites are then displayed on screens of different ratios.

This way, the game can run full screen on any device, it simply means that more/less of the game is visible on some devices than it is on others.

However, I can't work out how to diaplay a large (full-screen) image on different devices.

The only thing I can think of is to simply create the original image for the larger display and the crop it down to fit other ratios. Something like this:

So here, the image on the right is how the picture will show on the original device (full-screen with no cropping), the device on the left has a smaller width. But what if this runs on a device with a larger screen?

In this case is it simply a case of (uniformly) stretching the image until it fills the screen?

Would be grateful for some guidance.

Answer 1

I think you don't have to make it full screen on all devices. Nowadays most of the modern devices uses 1920x1080 ratio. So making game run on that ratio will make it run full screen more than half of the devices. And in other devices you can scale your image until one of dimensions match and center it on screen. This way there will be empty places around your image but at least all of your image will be visible.