CurryKitten / CurryKitten-Sim

FPV quad simulator
70 stars 7 forks source link

Fix UI layout on aspect aspect ratios that are not 16:9 #28

Closed CurryKitten closed 4 years ago

CurryKitten commented 4 years ago

I developed the Sim using a 16:9 aspect ratio, but hadn't realised this would have a potential effect on other aspect ratios.... it does. An easy way to domonstrate this would be to look at the puse and radio calibration screen on a 16:9 display

Screenshot 2020-01-20 at 14 39 02

Screenshot 2020-01-20 at 14 39 07

If we take the same code and run it at a 4:3 resolution, we get -

Screenshot 2020-01-20 at 14 38 27

Screenshot 2020-01-20 at 14 38 36

I think this is down to incorrect anchors in the floating logo and text, but I also need to see if I can reserve the aspect ratio of the radio graphic, or anchor the axis text/buttons to the radio graphics instead of the screen layout

CurryKitten commented 4 years ago

This was quite a quick and easy fix. I thought I might be able to have the axis labels as children of the radio graphic in order to set text by using the corners as anchors. As it turned out, they were already children, but they still used the parent panel as anchor points. Instead, I forced the graphic into keeping its aspect ratio which stopped the weird stretching and kept the labels in the correct place.

The floating logo and buttons was just a case of those pieces of UI being anchored from the centre of the screen and thus going wrong in 4:3 (and other) aspect ratios. These were correct to use the bottom corners as anchors. I retested in many other resolutions and the fix holds well