Distorted shapes with adaptive scaling and hidden bottom navigation on android devices

Audio and Graphics
#1

Hi, I am having this issue with shapes (circle in this case) being distorted when viewed on android device with content scaling set as “adaptive” and the bottom navigation bar hidden with the following code:

if ( system.getInfo("platformName") == "Android" ) then
local androidVersion = string.sub( system.getInfo( "platformVersion" ), 1, 3)
if( androidVersion and tonumber(androidVersion) >= 4.4 ) then
 native.setProperty( "androidSystemUiVisibility", "immersiveSticky" )
 --native.setProperty( "androidSystemUiVisibility", "lowProfile" )
elseif( androidVersion ) then
 native.setProperty( "androidSystemUiVisibility", "lowProfile" )
end
end

image
image360×533 14.8 KB

Any ideas on how to fix this? I couldn’t find any docs on the matter. Thanks in advance.

test project: distortion_test.zip

#2

The famous egg-shape effect. :slightly_smiling_face:
What happens if you don’t hide the navigation bar?

I’m suspecting the display content is being stretched after hiding the navigation bar.
I’m not too familiar with “adaptive”, I ditched it once I saw everything looked different from one device to another and couldn’t find “middle ground” settings. :smile:

#3

Hi @andrei18 - all my apps grab the resolution of the device and all shapes are then drawn based upon placement, so a circle is always a circle. This requires more work when considering wider devices (i.e. iPads) or taller devices (i.e. iPhoneX), but it gives me the assurance that the proportions are always right. To place something, I use a % of width or % of height value to position things, and this works for me and when you write code for the wider or taller devices, it assures that it looks good on all devices; just my two cents.

#4

Then circle renders correctly.