Extra margin or boarder space around apps in 20a/20b.

I am getting extra margin or boarder space with apps made with or run in 20a/20b. They look fine in app designer but when run I get extra space as seen below in the red squiggle line area. I do not get this extra space with apps run in 19a or earlier. I have not seen this extra space in any screen shots of the demo apps online so I assume it is not normal. How do I get rid of the extra margin?

Answer 1

[Pratyush Roy]

CEF (Chromium Embedded Framework) windows scale up pixel positions for any DPI higher than 96 on a Windows system. However, it appears that Chromium does not do this scaling on Windows platforms until the DPI is greater than 120. This corresponds to a scaling setting of 125% on several monitors. Since App Designer relies on this framework for rendering, positioning of app elements might not behave correctly if the app is made with the Windows DPI scaling set to 125%.

To work around this issue:

1) Set the Windows DPI scaling to 100% or to something above 125%. This setting is part of the system display settings, but its specific location may vary based on the particular version of Windows.

2) Open the '.mlapp' file inside App Designer and resave it.

3) Run the app again. The issue should be resolved. The DPI scaling can now be reverted back to 125%.