Width equal to Height

If I have a Panel with a Width of 100% of the screen, how can I set the Height equals to the value of Width (I want a square Panel of 100% of screen width but the screen height of the devices are diferent).

Thanks!

There’s unfortunately no easy way to do this right now. You’ll have to use some Uno code, and likely a custom control to do the layout.

Can you give me an example of what you have now and tell me which part you’d like to have with a fixed aspect ratio? I can then maybe look at putting together an example for you.

But better make a simpler example instead of upload my project that have many things.

If you have time, how can I do something like this:

<Image ux:Name"MyImage" WidthUnit="Percent" Width="90" StretchMode="UniformToFill" />

How can in Uno make that the MyImage.Height = MyImage.Width?

I know this is out of date but maybe it will help other people who run into the problem. Here’s a solution that solves a similar problem, relying on a square transparent image to set the proper aspect ratio of the container (width=height) and then “floating” on top of it the actual content you want to display:

We’ve actually added an aspect layout option since then.

<Panel Width="100%" BoxSizing="FillAspect" Aspect="1">

The panel will be the same height as the width. The key bit is BoxSizing="FillAspect" Aspect="1" which enables aspect based sizing (to fill the space that is has, or with an explicit width/height). The Aspect is the X/Y ratio.

Nice. Keep up the good work!