HeroEngine Forums
Welcome, Guest. Please login or Register for HeroCloud Account.

Author Topic: GUI positions on screen  (Read 2883 times)

Viper155

  • World Owners
  • ****
  • Posts: 73
    • View Profile
GUI positions on screen
« on: May 02, 13, 07:46:15 PM »

How would I go about setting the Gui positions on the screen?

I know that if I move them in the GUI creation it will always load where I set it, but at home on a different monitor its actually positioned off the screen.

I'm trying to get my chat window to load on the bottom left and my ability bar to be centered. 

Thanks!


Logged

Thazager

  • General Accounts
  • *
  • Posts: 1160
  • Never stop learning
    • View Profile
Re: GUI positions on screen
« Reply #1 on: May 02, 13, 11:09:09 PM »

There are 2 ways that I know (might be more). In scripting you need to find the offset of name.

you can set them through script using:

name as NodeRef of Class GUIControl = FindGuiControlByName(None, "name")  // here you need the full path to the GUI
name.position.x = val     // where you set the value
name.position.y = val

you can set them directly in the GUI editor, poisition is located in the Layout section of the properties panel.

position x,y


You could also get fancy with some other options like checking the screen size, and set them at the bottom less the height of the GUI. There are also autoCenter Horz and Vert in the properties panel.
Logged
Lead scripter for EO, Repop helper.
HSL Video tutorials:
https://community.heroengine.com/forums/index.php/topic,1719.msg36858.html#msg3685

Viper155

  • World Owners
  • ****
  • Posts: 73
    • View Profile
Re: GUI positions on screen
« Reply #2 on: May 02, 13, 11:19:35 PM »

Thanks, I guess I need to start working on your last suggestion as that's the only way to resolve the issue I was having.

If i were to just set it under layout, it wouldn't necessarily be the bottom left on everyones screen.
Logged

Thazager

  • General Accounts
  • *
  • Posts: 1160
  • Never stop learning
    • View Profile
Re: GUI positions on screen
« Reply #3 on: May 03, 13, 12:29:17 AM »

Something like this:

var screen = GetViewportSize()
  name.position.x = (screen.x / 2) - (name.size.x / 2)    // mid screen
  name.position.y = (screen.y / 2) - (name.size.y / 2)

name.position.y = screen.y - name.size.y         // screen bottom - gui height
name.position.x = screen.x - name.size.x         // screen right - gui width
Logged
Lead scripter for EO, Repop helper.
HSL Video tutorials:
https://community.heroengine.com/forums/index.php/topic,1719.msg36858.html#msg3685

FI-ScottZ

  • General Accounts
  • *
  • Posts: 1407
    • View Profile
    • Forever Interactive, Inc.
Re: GUI positions on screen
« Reply #4 on: May 03, 13, 11:28:53 AM »

As far as centering the ability bar, it is easiest to just set its autoCenter.horizontal property in the editor to true.  Having it centered on the screen would require either that it is an immeditate child of its layer, or that its parent control is centered.  That depends how you are setting up your control hierarchy (tree).

To have the chat at the bottom left:

to stay on the left is easy enough: have position.x = 0, anchor.left = true, and anchor.right=false.  That again assumes that it is a child of the layer, or that all ancestor controls of it are also at 0.

For it to be at the bottom as well, there are ways to use the anchor property for that, too, but I would recommend using dockmode as such:

You would have a _spacer control (which is the equivalent of a _panel control with defaultPresentationSettings.color.a = 0) which is docked to the left and whose width is at least that of the chat window, then another _spacer which is a child of that first one but is docked to the bottom and whose height is equal to that of the chat window.  Then make the chat window a child of that second spacer and have the chat window at position 0,0.  The docking of the spacers will ensure that the chat window is always in the bottom left corner, regardless of the screen size or aspect.



The takeaway is that autocenter, anchor and dockmode are the primary ways to maintain relative positions.
Also, of note:
  • anchor is ignored if dockmode is anything other than NONE
  • the repositioning of a docked or anchored control when its parent is resized only occurs if the child control is visible.  I have had problems with this in the past, where things would not be properly positioned, and I finally realized it was because they were invisible and so not being repositioned properly. The workaround was to make them invisible by setting opacity = 0 while still keeping visible = true.
« Last Edit: May 03, 13, 11:33:44 AM by ScottZarnke »
Logged
Scott Zarnke
Lead Programmer, Visions of Zosimos
CTO, Forever Interactive, Inc.

Viper155

  • World Owners
  • ****
  • Posts: 73
    • View Profile
Re: GUI positions on screen
« Reply #5 on: May 03, 13, 05:13:21 PM »

Thank you Thazager and ScottZarnke!
Logged