Author Topic: UIStretch documentation  (Read 6325 times)

kork

  • Guest
UIStretch documentation
« on: April 24, 2012, 08:55:12 AM »
Hi,

i am currently trying to figure out what the different modes of UIStretch are doing. Until now, i only used "BasedOnHeight" but even there the x and y values don't seem to make sense to me.

For example i got a big background image in 5:4 that I want to scale up according to the screen height and I want to keep the aspect ratio. So I set the mode to "BasedOnHeight" and enter the aspect ratio of the image into x, y: that is  X = 1.25, Y = 1.   Works.  Now I try to do the same for a button. I add a panel, center this and add a button to the panel. Now I attach the UIStretch to the button. The button is 175x78, so I enter X=2.24, Y=1. Now the button is displayed HUGE, it is drawn even bigger than the background image. So I gather that the thing seems to work different when you are below a panel. I enter X=0.0024, Y=0.001. Now the button is much smaller, but stretched horizontally. I change it to X=0.001, Y=0.001, now the button is displayed like i want it. I don't get why it is behaving that way.

Is there some documentation about how these modes work and what the X and Y values are doing for each mode and if there are other rules when working below a panel?

Nicki

  • Global Moderator
  • Hero Member
  • *****
  • Thank You
  • -Given: 33
  • -Receive: 141
  • Posts: 1,768
    • View Profile
Re: UIStretch documentation
« Reply #1 on: April 24, 2012, 09:35:44 AM »
UI Stretch always uses the Screen size for its relative height/width.

kork

  • Guest
Re: UIStretch documentation
« Reply #2 on: April 24, 2012, 11:14:36 AM »
Ok, but then using X=1.25 should actually stretch the image to be larger than the screen size, shouldn't it?

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: UIStretch documentation
« Reply #3 on: April 24, 2012, 02:17:44 PM »
It's always the screen width or height. 1.0 = full width or height of the screen, meaning if it's 1080 height, your button will have a size of 1080. If you want it to be only 108 pixels, set 0.1.

In general UIStretch is for stretching backgrounds though. You can have your UI scale with the resolution by simply specifying a manual height on UIRoot (your target resolution), and your UI will stay exactly the same scale regardless of whether you're on 480p or 1080p.

You can use UIAnchor to glue things to sides and corners of the screen (so even if aspect ratio changes, your elements will stay where you want them).

kork

  • Guest
Re: UIStretch documentation
« Reply #4 on: April 24, 2012, 02:27:25 PM »
Hmm, strange. Have a look at the screenshot. The scale is set to 0.01, so at 1280 the button should be 12 pixels wide/high. But as you can see it is huge. I'm obviously doing something wrong but I don't see what...

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: UIStretch documentation
« Reply #5 on: April 24, 2012, 02:45:52 PM »
The scale of your button is fine. If you look at its transform, it's "6". The thing is, the button has children widgets which have their own scale. 200 pixels * 6 = 1200.

You're using UIStretch for something it's not meant to be used for btw. As I said, simply set your screen size manually on UIRoot.

kork

  • Guest
Re: UIStretch documentation
« Reply #6 on: April 24, 2012, 03:17:45 PM »
OMG, it's really THAT easy. Just set the size manually to 1280, enter full pixel size everywhere and the stuff scales up and down by itself.  :o  I'm so used to the clumsy stuff that we needed to code for the other GUI frameworks that I overlooked the obvious. Thanks so much :)