Skip to main content

Understanding Unity, understading-UI Layout elementElement - Min sizeMininum and preferible sizePreferred Size

I have been some time working with unityUnity for some time, and I am trying to get a better understand of the UI system.

I am a mobile developer and I am redesigning the UI but I am unable to achieve what I want.

My game is in portrait mode and I have a panel. I want the panel to have a maximum width of 1080 pixels. In case thatcases where the panel doesn't fit inon the screen whenbecause the aspect ratio is less ( likelike the new iPhone X) ., I want it to shrink it a bit with a minimum width of 700 pixels. In the case that the screen is larger than 10801080p ( likelike the iPad proPro). I want the panel to have the maximum size.

VisualHere are visuals of what I want to achieve.:

Nexus 6P ( 1080x1920)

enter image description hereLayout on Nexus 6P

iPhone X(1125x2436)

enter image description hereLayout on iPhone X

iPad pro (2048x2732)

enter image description hereLayout on iPad Pro

I have been playing with layout elementLayout Element and content size fitterContent Size Fitter components without good resultsuccess.

If I set the min width size to 700 pixels and preferred size to 1080 pixels nothing happenhappens (even playing withafter setting flexible width.)

If I set the content size fitter. If I chooseContent Size Fitter to the preferred size it just get always reverts to the preferred size and. The same thing happens with min.

How do these elements workscomponents work, and how I can achieve the desired effect?

Canvas configuration:   

enter image description herecanvas confifuration in inspector

Unity, understading Layout element - Min size and preferible size

I have been some time working with unity, and I am trying to get a better understand of the UI system.

I am a mobile developer and I am redesigning the UI but I am unable to achieve what I want.

My game is portrait and I have a panel. I want the panel to have a maximum width of 1080. In case that the panel doesn't fit in the screen when the aspect ratio is less ( like new iPhone X) . I want it to shrink it a bit with a minimum of 700. In the case that the screen is larger than 1080 ( like iPad pro). I want the panel to have the maximum size.

Visual of what I want to achieve.

Nexus 6P ( 1080x1920)

enter image description here

iPhone X(1125x2436)

enter image description here

iPad pro (2048x2732)

enter image description here

I have been playing with layout element and content size fitter without good result

If I set the min width size to 700 and preferred size to 1080 nothing happen (even playing with flexible width)

If I set the content size fitter. If I choose the preferred size it just get always the preferred size and same with min.

How these elements works, and how I can achieve the desired effect?

Canvas configuration:  enter image description here

Understanding Unity-UI Layout Element - Mininum and Preferred Size

I have been working with Unity for some time, and I am trying to get a better understand of the UI system.

I am a mobile developer and am redesigning the UI but I am unable to achieve what I want.

My game is in portrait mode and I have a panel. I want the panel to have a maximum width of 1080 pixels. In cases where the panel doesn't fit on the screen because the aspect ratio is less (like the new iPhone X), I want it to shrink it a bit with a minimum width of 700 pixels. In the case that the screen is larger than 1080p (like the iPad Pro) I want the panel to have the maximum size.

Here are visuals of what I want to achieve:

Nexus 6P ( 1080x1920)

Layout on Nexus 6P

iPhone X(1125x2436)

Layout on iPhone X

iPad pro (2048x2732)

Layout on iPad Pro

I have been playing with Layout Element and Content Size Fitter components without success.

If I set the min width size to 700 pixels and preferred size to 1080 pixels nothing happens (even after setting flexible width.)

If I set the Content Size Fitter to the preferred size it just always reverts to the preferred size. The same thing happens with min.

How do these components work, and how I can achieve the desired effect?

Canvas configuration: 

canvas confifuration in inspector

Bumped by Community user
Bumped by Community user
Bumped by Community user
Bumped by Community user
Source Link
D4rWiNS
  • 293
  • 1
  • 18

Unity, understading Layout element - Min size and preferible size

I have been some time working with unity, and I am trying to get a better understand of the UI system.

I am a mobile developer and I am redesigning the UI but I am unable to achieve what I want.

My game is portrait and I have a panel. I want the panel to have a maximum width of 1080. In case that the panel doesn't fit in the screen when the aspect ratio is less ( like new iPhone X) . I want it to shrink it a bit with a minimum of 700. In the case that the screen is larger than 1080 ( like iPad pro). I want the panel to have the maximum size.

Visual of what I want to achieve.

Nexus 6P ( 1080x1920)

enter image description here

iPhone X(1125x2436)

enter image description here

iPad pro (2048x2732)

enter image description here

I have been playing with layout element and content size fitter without good result

If I set the min width size to 700 and preferred size to 1080 nothing happen (even playing with flexible width)

If I set the content size fitter. If I choose the preferred size it just get always the preferred size and same with min.

How these elements works, and how I can achieve the desired effect?

Canvas configuration: enter image description here