UI aspect ratio / scaling

Help & Support
, ,
1

Hi there!

Currently im working on a ui for an app. The thing is, it has several areas which could change dynamically (text info with video, text with image and video, text without video, etc.).

Furthermore it has to fit mobile (portrait) and desktop browser (landscape) aspect ratio.

My first question is: ive settet up the contiainer (parent) with child elements. Is there an option, so the child elements keep their size in relation to its parent container? Im not talking about the scaling value - if changing the width and height of the parent element, the child elements are unaffected.

The second question: is there an universal option for mobile and desktop browser development? Or do i have to create two differend canvas or a script, which handles the dimensions of the canvas and its child elements? I saw some posts about this topic but maybe there has something changed? I have experience in unity layout development but it seems PC is kind differend in handling ui which makes sense due to the html / css.

Thanks for your inputs!

2
  1. I don’t fully understand this, can you provide and example?
  2. If I had to support both aspect ratios, I normally have two separately layouts that I switch between depending on the aspect ratio on the resize event. I did this here in this demo https://playcanvas.com/project/1053800/overview/area-lights-demo (it needs to be updated for the new Engine APIs but you can play the older build to see the effect https://playcanv.as/p/kudd62ky/)