True dynamic layout

Get help with using AutoHotkey and its commands and hotkeys
Daniel Beardsmore
Posts: 13
Joined: 23 Jul 2016, 15:57

True dynamic layout

27 Jul 2016, 07:55

Looking around, it seems that the conventional approach to AutoHotkey GUIs is to hard-code all control sizes and positions and ignore concerns over DPI, language and system font.

Web searches for simple concepts like making all control captions the same width, making a control caption the same height as its control, making buttons share the same size, and making a set of buttons centred in the window find little or nothing of use.

Example code:

Code: Select all

goBackBy := 0

Gui, Add, Text, , Go back by:
Gui, Add, Edit, vGoBackBy Number Right Limit4 ym

Gui, Add, Button, Default, OK
Gui, Add, Button, Cancel x+m, Cancel

Gui, Show, Center, Go back
The result, for me:

[attachment=0]Resulting applet.png[/attachment]


It seems illogical to me to have to specify all the captions first, and then all the controls later, as captions and controls are not paired in the code. However, putting all the captions first, then using ym to start a new column, seems to be the only way to make the controls go in a column beside the captions.

Then we have the caption ("Go back by") vertically offset relative to its control. Since the GUI has no idea which captions belong with which controls, it couldn't make them align properly if it wanted. Also, if the control heights vary (e.g. a listbox or multi-line text box is taller than an edit field), column-based layout will be impossible.

The idea of using the size from the previous control only works if the previous control was larger. You need a TARDIS to make the OK button the same width as Cancel, as at the time that OK is being added, the size of Cancel isn't know. In fact, depending on language, either one could be larger.

Has anyone here ever programmed in OPL for an EPOC32 Psion? (Series 5/5mx/Revo etc) Psion figured that most dialog boxes can be achieved by placing all the controls one above another, each one with a caption to its left. Buttons could be placed in a row across the bottom, or in a column down the right. Instead of having controls in a grid, if you needed more space, instead of starting a new column on the right, you'd start a new tab with the dialog (although OPL didn't offer this!)

The EIKON GUI – dialogs (sadly no code examples)

Is there any means in AutoHotkey (or through a library) to achieve basic dialog layout, i.e. just add a series of controls, that stack vertically, with correctly-aligned captions on the left (and captions visibly associated in the code with their related controls), optionally some form of panel selector (icons down the left, or tabs), and with one or more buttons of equal size at the bottom centre or top right, that is completely free of any hack that would break support for DPI, localisation or typeface and font size?
Attachments
Resulting applet.png
Resulting applet.png (3.72 KiB) Viewed 823 times
guest3456
Posts: 3142
Joined: 09 Oct 2013, 10:31

Re: True dynamic layout

27 Jul 2016, 08:26

you saw the ym feature, but why didn't you try ys? its listed directly under it in the help page, with an example:

https://autohotkey.com/docs/commands/Gui.htm#Position

as for vertical alignment, controls are usually positioned by their upper-left corner, which means the alignment is correct, the top border of the controls align. you are wanting center alignment of the first text (caption) relative to the text box to its right, but the text box isn't even created yet, so how can the first text caption even know where to center itself? consider if that textbox was really 2 lines high instead of 1

but you can throw in a simple offset to accomplish it, but it won't always be perfect:

Code: Select all


gui, add, text, section, First Name:  ; Save this control's position and start a new section.
gui, add, text,, Last Name:
gui, add, text,, Go back by:
gui, add, edit, ys-2            ; Start a new column within this section.
gui, add, edit
gui, add, edit, vGoBackBy, 
gui, show

GuiControl,, GoBackBy, 0
prepopulating the gui edit field caused it to shrink its width, thats why i used GuiControl instead

Daniel Beardsmore
Posts: 13
Joined: 23 Jul 2016, 15:57

Re: True dynamic layout

27 Jul 2016, 12:09

The alignment I seek is baseline. For multi-line controls, the baseline position is that of the first line of text, which should align with the baseline of the caption (or the caption's first line, should it wrap). For labels, baseline is trivial. For box controls (text, list etc) the baseline position is also offset by the border and padding, which varies by OS/theme.

Adding items one by one doesn't work: you need to list all the controls first (in an array), calculate all the sizes and offsets, and then physically append them to the window. Hence the idea that somewhere a library might exist for AutoHotkey, already tried and tested for various flavours of Windows.

This isn't make-believe: many graphical toolkits have full, true, live dynamic and flexible window layout, including XUL (used by Firefox and Thunderbird), GTK+ (used by a huge amount of software, including Pidgin and Inkscape), Qt (also widely used), and of course HTML (found at least as far back as XP). I doubt that you had any live flexibility with EIKON, but you certainly never had to calculate control sizes; with AutoHotkey I would expect at the very least to not be worrying about baseline offsets or buttons that should be as big as a button that's not even added yet.

ys doesn't solve the problem where captions aren't listed in the code next to the control to which they refer. Think HTML tables, where the caption and control are in adjacent cells.

Return to “Ask For Help”

Who is online

Users browsing this forum: Bing [Bot], lluke, songdg, wineguy and 35 guests