Mathmatical GUI Layouts

[Blue_Drache]

Ok, I know this sounds a little strange, but how does everyone plan out the GUI layout? I wanted a 3 column layout and didn't want to figure it out by hand for button locations, so I just whipped up a formula. The entire layout is based off the button size and initial "Y" location of the first button.

Is this standard practice?

Is it recommended practice?

This particular one is for function, not style.... and I'm only including the GUI portion, not the primary data loop...mainly because it's not complete and is looking to be almost 1500 lines of code.

#include <GUIConstants.au3>
Dim $prevclip = ClipGet(), $bX1 = 5, $bY1 = 5, $bX2 = 50, $bY2 = 25, $spaceX = 5, $spaceY = 5
; Width/Height:
; Total Width = (((#of columns + 1) * X spacer value) + (#of columns * Button Width))
; Total Height = (some padding value + (((#of rows + 1) * Y spacer value) + (#of rows * Button Height)))
rows * Button Height)))
$width = ( (4 * $spaceX) + ( 3 * $bX2))
$height = (5 + ( (4 * $spaceY) + (3 * $bY2)))
; Create the GUI Window and assign the handle to a variable.
$ssr = GUICreate("SRR Assist", $width, $height, 50, 50)
; Create the GUI Buttons and Text and assign the control handles to variables
; GUICtrlCreateButton("name",X1,Y1,X2,Y2)
; vertical location formula is $button_# where Y1 = ((#*$spaceY) + INT(((#-1)*$bY2))) IFF # > 1
; horizontal formula is the same but for column number, not row.
$button_1 = GUICtrlCreateButton("Lumping", $bX1, $bY1, $bX2, $bY2)
$button_2 = GUICtrlCreateButton("PFR/FPF", $bX1, (2 * $bY1 + $bY2), $bX2, $bY2)
$button_3 = GUICtrlCreateButton("Pricing", ( (2 * $spaceX) + INT( ( (2 - 1) * $bX2))), $bY1, $bX2, $bY2)
$button_4 = GUICtrlCreateButton("Inroads", ( (2 * $spaceX) + INT( ( (2 - 1) * $bX2))) , ( (2 * $spaceY) + INT( ( (2 - 1) * $bY2))), $bX2, $bY2)
$button_5 = GUICtrlCreateButton("Reg DCN", ( (3 * $spaceX) + INT( ( (3 - 1) * $bX2))), $bY1, $bX2, $bY2)
$button_6 = GUICtrlCreateButton("HMO", ( (3 * $spaceX) + INT( ( (3 - 1) * $bX2))) , ( (2 * $spaceY) + INT( ( (2 - 1) * $bY2))), $bX2, $bY2)
$button_CANCEL = GUICtrlCreateButton("Cancel", Int( ($width / 2) - ($bX2)) , ( (3 * $spaceY) + INT( ( (3 - 1) * $bY2))), 2 * $bX2, $bY2)

; Show the GUI before going into the loop
GUISetState(@SW_SHOW, $ssr)

; Primary Data Loop
While 1
   Sleep(10)
   Select
      Case $msg_button = $GUI_EVENT_CLOSE Or $msg_button = $button_CANCEL
         Exit
   EndSelect
WEnd

Yeah, it wins NO prizes for flash or flair, but it works how I wanted it to....and I know that per standard Hungarian Notation, my X/Y variables are marked as "boolian" and should be "i"..... In my case it's "b" for "button".

Edit: OK, I realized a critical error in the formula. It's using the start X/Y values for spacing. Oops. Not bad, BUT...I changed it to $spaceX and $spaceY...otherwise we'd get some sort of HUGE GUI if the start positions were changed. Sorry about that....but the questions still apply.

Edit2: Damn, order of operations get me every time. Fix it in the comments section and removed unnecessary functions.

Edited February 14, 2005 by Blue_Drache

[Zaxon]

Ok, I know this sounds a little strange...The entire layout is based off the button size and initial "Y" location of the first button.

Is this standard practice? 

Is it recommended practice?

<{POST_SNAPBACK}>

Yes, that's a great approach. There is also relative GUI coordinates (two different types) that can also be used - MouseCoordMode (Option).

The less you hard code in and the more you make coordinates relative or mathematically generated, the greater flexibility you'll have inbuilt for future GUI additions and subtractions

[Nova]

I first take an estimated guess as to where an control shoudl be placed, then I run the GUI and take a screenshot with mspaint.

Using selection tools you can then clearly see in which directions the control you just placed needs pushing and how far.

Wonders if anyone else dose the same

[Blue_Drache]

I first take an estimated guess as to where an control shoudl be placed, then I run the GUI and take a screenshot with mspaint.

Using selection tools you can then clearly see in which directions the control you just placed needs pushing and how far.

Wonders if anyone else dose the same

<{POST_SNAPBACK}>

Well, I usually draw the GUI up ahead of time on paper then in a paint program, and finally, after I get the layout worked out right, I'll code it. I work better off of visual concepts to code than just coding the idea out of my head. Granted, the code that's referenced in the first post was just something quick and dirty, and didn't need any fancy layout procedure...but I got the answer I was looking for. It's usually better to use math and variables, especially if you're going to have a "table" of buttons, that way you can keep the buttons centered if the user re-sizes the window, or you need to add a new row/column, the formula just adapts...you change one or two variables and then code the extra buttons.

Heck, half the fun for me is tinkering the visual layout before the actual code goes in place, so yeah, I do something similar to your method.