Problem with adaptToDeviceRatio and adaptiveScaling

Hi, I pass adaptToDeviceRatio=true to Engine for better rendering quality and adaptiveScaling=true to AdvancedDynamicTexture.CreateFullscreenUI to restore the output size.
If I want to move the GUI to an edge (e.g. vertical alignment: top), it disappears completely on the mobile phone.

Please check this out with PC vs mobile phone:

cc @RaananW

Instead of the constructor option, please use the newly added flag (line 34):

I will make sure both constructor and this flag work the same. Thanks for reporting!

Here is the fix :-1:

Hi, thank you. I’ve been able to position the elements.

Is there a chance to get the better rendering quality? The text could be a little crisper.

I think that scaleX and scaleY (context) are important here so that the canvas renders the text in better quality.

Screenshot with blurry text on mobile:

i can look into that, of course

I have found a solution. It is possible to do the scaling outside of the ADT.

  const scalingLevel = engine.getHardwareScalingLevel();
  const scale = 1 / scalingLevel;
  const size = `${100 * scalingLevel}%`;
  texture.rootContainer.scaleX = scale;
  texture.rootContainer.scaleY = scale;
  texture.rootContainer.width = size;
  texture.rootContainer.height = size;

To get rid of drawing problems on mobile, it is possible to use

texture.useInvalidateRectOptimization = false;
1 Like