FlaxEngine UI resizing

[AlecioFuranze]

I’m trying to create a cross-platform interface in FlaxEngine, I’m not finding a specific feature (I don’t know if this feature is non-existent or I don’t know how to use it, but since I’m not finding information about it I’m guessing it’s non-existent) , the feature that I consider “mandatory” for an engine that compiles for Mobile is that it has a responsive UI (I can’t make my UI in FlaxEngine be responsive), that is, if it adjusts according to the aspect ratio of the screen, the pixels are fixed. If this functionality does not exist, I would kindly ask you to add it in the next version, if this functionality exists, you could help me by showing me how to integrate it into my project.

Engine as unity fixed this problem using the following property (Image below), (Image is just a reference, not meant to be a guide)

[niles]

Hi, have you tried CanvasScaler UI Control?

Canvas Scaler | Flax Documentation

I think this may fit your needs, it has Scale With Resolution mode. Put this as a parent to many UI controls under it to make sure it works

[AlecioFuranze]

Yes it works, but the box of an image is much bigger than normal (that’s because only the content is resized, but the size of the original remains, I don’t know if this is a bug or something normal). I was breaking my head was using Flax 1.4, and this feature is only for Flax >= 1.5. Thanks anyway! And it’s working perfectly, and I just hope that when I’m creating touch mobile it doesn’t get in the way, I expected the UIControl to be resized too not just the content inside it.

[Tryibion]

Something that may help you figure out UI sizing stuff is the new viewport size feature introduced in the 1.5 update. Here is the snip from the docs.

[AlecioFuranze]

@Tryibion @niles @mafiesto4

Definitely I’m very confused with all this, the question is the problem is the engine or I’m not able to use it, The flax UI doesn’t do what I want!

[Tryibion]

When your canvas scalar is in Scale With Resolution go ahead and change the resolution max to something like 1920, 1080. then change the resolution mode to Longest Side (I have found that best for longer width aspects). **FYI the highlighting of the UI with a canvas scalar is broken right now.

This is what I am using right now.

[AlecioFuranze]

@Tryibion @niles @mafiesto4
No matter what I do, the result is the same as the video example, even if I compile and resize the window, the result does not change, the elements have a fixed size and are not dynamic. And another thing that I noticed in the “image below” the green border should fit in the game window, right? I have a question, does your flax have the same behavior as the unit example “comment above”?

[Tryibion]

Yes, the green outline (UI highlighting) is broken right now.

here is a video of what it looks like for me with the settings I gave you.

2023 03 31 19 01 23

[AlecioFuranze]

In your project it seems to be working as I would like it to work in mine . but I’m using the latest version of flex 1.5, now I’m going to cry and I reinstall flax and I hope it works .

free(printf("Thanks for help me ❤"))

[Tryibion]

What resolution is your monitor? Maybe there is some issue with resolution?

[AlecioFuranze]

It’s a 1920x1080 TV and I use 1360x768 due to TV pixel distortion

[Tryibion]

Do you have a different monitor that you could try it on?

[AlecioFuranze]

Yes, I will try now!

[AlecioFuranze]

I switched monitors, restarted the pc and created a new project! but the result is the same, I have the same problem, and one thing that bothers me is that the content is not in its context “image below”

[Tryibion]

Do you have a video with you resizing it with the same setting I have? I also think there is a minimum for resizing, so at a certain point it will stop shrinking.

[AlecioFuranze]

Even if I change the scale of the monitor to 1920x1080 the problem continues, and I already reinstalled flax and the result does not change!

Unlisted: FlaxEngine UI Problem

[Tryibion]

Try changing the resolution mode to the longest side instead of shortest side

[AlecioFuranze]

How? I don’t understand it.

[Tryibion]

In the canvas scalar if you have it set to scale with resolution. There is a resolution mode that you can change. You should set that to longest side.

[AlecioFuranze]

Not working!