Sorry your browser is not supported!

Hello,

I'm experimenting with writing some programs for the raspberry pi with 7" raspberry pi display. The trouble is the raspberry pi display has non-square pixels (800x480 resolution but has an aspect ratio of approx 16:9). I could create all graphics to take account of this but it would then cause issues if you wanted to rotate sprite etc. as they would then look distorted.

My idea to account for this was to actually render everything at 853x480 (this is 16:9 aspect) and then have AppGameKit just scale this to fit the screen but it hasn't turned out to be as easy as I thought as AppGameKit adds borders to the top and bottom of the screen. What I actually need it to do is squash/stretch the image so that it completely fills the screen.

So far I've tried using various combinations of SetVirtualResolution, SetScreenResolution, SetDisplayAspect but nothing seems to work. Does anyone have any ideas how I can achieve this?

Thanks in advance for your help.

If you SetScissor() you can remove the borders.
Then you simply need to make sure your graphics account for the possibility of still being visible where the borders used to be.
For example, your background should extend further than if you were filling the Virtual Resolution of the screen.

Thanks for the reply. However that won't fix the issue I have as the graphics would still be slightly stretched as the pixels are not square (they are a rectangular ). Because of this if I was to draw a circle in AppGameKit then it would be a slightly squashed oval on the raspberry pi display. (800x480 as square pixels is an aspect ratio of 5:3 but the physical dimensions of the display are approx 16:9). The distortion due to this is fairly minor but as I'm a bit of a perfectionist it would be nice to correct for it. Below is a picture to illustrate the problem.

Are you using the pixel-based virtual resolution (800x600 = 800x600), or percentage-based (800x600 = 100x100)?
I always use pixel based, and consequently, everything is always drawn as I expect it. If you use a percentage system, then you will need to do some correction in your code for different aspects (GetDeviceResolution).

Yes, I'm using virtual resolution of 800x480 (resolution of the display) as apart from anything it's just easier to use imo. However I'm not sure you are understanding the issue - the pixels on the '7" raspberry pi display' are not square . This means for example as in my explanation picture if you create a perfect circle for use as a sprite on your desktop PC (square pixels) and then display this same circle on the raspberry pi display it will then be slightly stretched horizontally. This is because the actual shape of the raspberry pi display pixels are rectangular.

I can design my graphics with this in mind (basically create them slightly squashed horizontally) but if I then wanted to rotate that sprite the distortion would be amplified. It would also mean that the graphics would look wrong if I wanted to port the game to other devices.

The ideal solution would be to render the image wider than the display and then squash/stretch to fill the screen but it doesn't seem to be possible. The only option seems to be to have the black bars or use the setscissor() comand but this simply exends the draw area into the black bar area so the graphics are still distorted. My guess is that the AppGameKit developers never considered rectangular pixels as they aren't particularly common so there is no easy way to correct this.

The only possible programmatic solution I can think of is to render everything to an image using SetRenderToImage() and then resize the result to fill the screen but it would add an extra layer of complexity which as this is my first program with AppGameKit I'm not sure I'm ready for.