AutoHotkey GUI (Graphical User Interface) Controls Gives Us Powerful Tools for Building Apps, But Sometimes We Need to Get Creative to Solve the Space Problem

My book AutoHotkey Applications: Ideas and Tips for Writing Practical AutoHotkey Scripts introduces the various GUI (Graphical User Interface) Controls available in the Windows operating system. I offer practical examples of how you can use single controls in a script. Yet each GUI control comes with its own particular limitations. Sometimes it takes a combination of techniques to get the full benefit from a unique control feature.

For example, you may find it a challenge to pack a multitude of items into a single GUI without expanding it beyond the screen. Many controls such as an Edit and ListView control allow you to limit the size of the control—then add scrollbars when the volume exceeds the confines of the space. Not so for AutoHotkey GUI Link controls.

In my last blog, “Cull Web Links from a Web Page and Activate Each in a Pop-up GUI“, I built a GUI pop-up window listing the external links scraped from a Web page (WebLinkFindURL.ahk script). In some cases, the number of links far exceeded the space allowed on my computer screen. Since the GUI Link control does not support scrollbars, I added Tab controls to expand the available GUI space without overwhelming the screen.

In Chapter 11.1.3 “Packing More Info into Apps with GUI Tabs” of the book Jack’s Motley Assortment of AutoHotkey Tips, I added the Tab control to support a food dictionary built from the history in the CalorieCount.ahk script. However, this WebLinkFindURL.ahk script represents the first time that I’ve used the Tab control to expand the GUI working area for an unknown number of data items and Tab controls.

The GUI Link Control

The GUI Link control constitutes a Text control that allows you to add HTML code to create active links. For example (from the online AutoHotkey documentation):

Gui, Add, Link,, This is a <a href="https://www.autohotkey.com">link</a>
Gui, Add, Link,, Links may be used anywhere in the text like <a id="A">this</a> or <a id="B">that</a>

Appearance:

This Link control circumvents the need to add special subroutines (gLabels) for launching Web pages but contains all the other limitations of the Text control. When the script matches too many links for a reasonable GUI size, I found no easy way to add scrollbars to a set of Text controls—I needed to locate an alternative approach.

Wrapping Controls to Save GUI Real Estate

With limited computer screen space, we often turn to special object features to facilitate the reading of lists. AutoHotkey Edit boxes and ListView controls (plus, a few other controls) automatically add scrollbars when the contents outstrip the available territory—not so, for GUI Text controls. That means we need to find other ways to keep the content in view.

For Menu objects, we can break long lists into columns—or, if it makes logical sense, add items to hidden, but accessible, submenus. We can also use the GUI formatting options to create columns of text data. However, even with multiple columns, we might eventually run out of screen space—especially when encountering lists of hundreds of items.

To resolve the unknown length problem, I added the GUI Tab control, using the same column-wrapping technique found in the SynonymLookup.ahk scrip —except I replaced new Menu column breaks with Tab controls. By adding Tab controls to a GUI, we can lay data on top of other data—selecting it with the click of the Tab button.

Note: For packing in pages of data, the Tab control outperforms even the use of column breaks in menus. Tab controls lay the GUI space on top of each other creating virtually an unlimited number of working areas. The only problem concerns the growing number of tab protrusions, but I’ve found a possible solution for even that. (If I figure out how to do it, I’ll offer more on how to do it at a later date.)

Breaking Data into Columns or Tabs

Whether adding columns to a Menu object or Tab controls for breaking up GUI Text lists, the logic remains the same:

1. Fix the length of a column by creating a counting variable set to zero (e.g. Count := 0). This action occurs before and outside any loop which inserts either the Menu items or Text/Tab controls.
2. Just after (or before) each item insertion, increment the counting variable by one (e.g. Count := Count + 1).
3. Place a trap inside the loop for when the counting variable reaches the preselected max number of items (e.g. If Count = 20).
4. Insert code to create a new menu column or the code for a new Tab control (e.g. from SynonymLookup.ahk—Menu, Synonym, add, %Synonym1%, SynonymAction, +BarBreak).
5. Reset the counting variable to zero (e.g. Count := 0).

This process repeats until the loop runs out of data items.

The WebLinkFindURL.ahk script counts each item (LinkCount) while adding links to a GUI Tab control. When LinkCount hits 20, AutoHotkey adds a new Tab and resets LinkCount to zero:

  Next := 1
  LinkCount := 0
  TabCount := 1
  Gui, Add, Tab3,, 1
  Loop
  {
    FoundPos := RegExMatch(URLtemp
             , "<a.+?href=""(https?.+?)"".*?>(.+?)" 
             , Link, Next)
    If FoundPos = 0
      Break
    Else
      {
        Link2 := RegExReplace(Link2, "<.+?>")
        If (Link2 != "") 
        {
          Gui, Add, Link,, <a href="%Link1%">%Link2%</a>
          LinkCount := LinkCount + 1
          If LinkCount = 20
          {
            TabCount := TabCount + 1
            GuiControl, ,SysTabControl321, %TabCount%
            Gui,Tab, %TabCount%
            LinkCount := 0
          }
      	}
        LinkList := LinkList . Link2 . "`n" . Link1 .  "`n`n"
        Next := FoundPos + StrLen(Link)
      }
  }

The following sequence shows the five steps used to create the multiple tabs:

Step 1. Set initial values for LinkCount, TabCount, and set up the GUI Tab control:

LinkCount := 0 
TabCount := 1
Gui, Add, Tab3,, 1

The Gui, Add, Tab3,, 1 command places the first Tab control in the GUI. Since the script only adds Tab controls as needed, only the first Tab (“1”) appears in the list.

Step 2. Increment LinkCount after inserting a new data item:

Gui, Add, Link,, <a href="%Link1%">%Link2%</a>
LinkCount := LinkCount + 1

Step 3. When LinkCount hits 20:

If LinkCount = 20

Step 4. The Tab number increments:

TabCount := TabCount + 1

the GuiControl command adds another Tab:

GuiControl, ,SysTabControl321, %TabCount%

and the script activates the new Tab control:

Gui,Tab, %TabCount%

Step 5. Reset LinkCount to zero:

LinkCount := 0

This process continues adding links and tabs as long as AutoHotkey finds external links in the target Web page.

You can use this system anytime you need to numerically break a list of items into groups.

Click the Follow button at the top of the sidebar on the right of this page for e-mail notification of new blogs. (If you’re reading this on a tablet or your phone, then you must scroll all the way to the end of the blog—pass any comments—to find the Follow button.)

This post was proofread by Grammarly
(Any other mistakes are all mine.)

(Full disclosure: If you sign up for a free Grammarly account, I get 20¢. I use the spelling/grammar checking service all the time, but, then again, I write a lot more than most people. I recommend Grammarly because it works and it’s free.)

Find my AutoHotkey books at ComputorEdge E-Books!