Custom window dimension shortcuts

Ryan Hanson
Dec 12, 2020 · 3 min read

One of the most common requests I have received for Rectangle is the addition of shortcuts for more window dimensions that are not currently in the app. The preferences window for Rectangle is already pretty packed with shortcuts, and in my opinion, there is a limit to how many shortcuts are desirable in its current UI.

In Hookshot, I went with a table view so that it isn’t quite so overwhelming to have more shortcuts. This frees Hookshot from a UI restriction on the quantity of shortcuts, but it removes an element of simplicity and immediate accessibility. It also breaks from a convention set by other window managers.

I spent a while thinking about a UI that could handle any window dimension that a user wants, and also allow the user to configure the subsequent dimensions when the shortcut is repeatedly pressed. Initially, I built this UI for Rectangle so that I could alleviate all of the window dimension requests I received at once. After building it, I felt like it just didn’t fit in Rectangle. The simplicity of Rectangle is, in my opinion, one of its best features.

While the main feature of Hookshot is also quite simple, there’s more depth to the app so this custom window dimension UI doesn’t feel out of place here. Let’s see how this custom dimension UI works.

  1. Go to the wrench & ruler tab in the Hookshot preferences window.
  2. Press the + button to add a new shortcut.
  3. A new shortcut item is added in the table, and a popover is displayed for configuration. Here you can record your keyboard shortcut, select a docking position, and set window dimensions for the shortcut.

The docking position selection should be pretty straightforward — top, bottom, corners, sides, center, etc. There’s also a “Custom” selection that lets you specify where the bottom left corner of the window should go.

The fields for entering width and height, or x/y coordinates of the window can take the following inputs:

Fractions, decimal numbers, whole numbers, or blank

  • Inputs that are less than or equal to 1 will correspond to a percentage of the screen.
  • Inputs that are greater than 1 will correspond to pixel sizes.
  • Inputs that are left blank will correspond to keeping the current dimension.
This shortcut will make the window leave a 10% screen width gap on the left and have a width of 50% the screen.

Last, let’s add window dimensions for repeated executions of the same shortcut. To do this, we simply hover the cursor over the configuration we want to add the next repetition, and click the + to bring up the same configuration popover.

The repeated executions will loop through each configuration in the order that they appear. Here’s an example of a vertical sixths configuration that will move the window 1/6 width and full height of the screen on each repeated shortcut press:

That’s it! Configuring custom window dimension shortcuts still takes a little bit of time and know-how, but to me it’s a pretty good tradeoff between configuration time and power over your windows. Give Hookshot a try!