開発者のためのRectangle:実際に使えるIDE・ターミナル・ブラウザのレイアウト

開発作業の大部分は、同じ3つか4つのウィンドウの間を行き来することで成り立っている。エディタやIDE、ターミナル、ドキュメントや実行中のアプリを表示するブラウザ、そして時には無視しようとしているメッセージアプリだ。Rectangle appの標準ショートカットセットは、無料アプリに最初から入っているもの以外何も必要とせずに、そのローテーションにきれいに対応する。ここでは、知っておく価値のあるレイアウトと、開発者向けツールで具体的に発生する問題を扱う。

単一モニター:2つのウィンドウ

もっとも単純で、もっともよくあるケースだ。もっとも見る頻度の高いほうをエディタに、もう一方をターミナルやドキュメントに割り当てる。

• ⌃⌥← — エディタを左半分へ
• ⌃⌥→ — ターミナルやブラウザを右半分へ

エディタにとって50/50の分割が狭く感じる場合(13〜14インチの画面では、コードエディタがターミナルよりも横幅を必要とするため、よくある不満だ)、まったく別のレイアウトに切り替えるのではなく、⌃⌥=(拡大)を数回押して片側を大きくするといい。組み込みの「60/40の半分」というアクションは存在しないため、すでに半分に分割されたウィンドウに対して拡大・縮小を使うのが、それに近づける方法になる。

単一モニター:3つのウィンドウ

ここで、半分よりも3分の1が本領を発揮する。理にかなった分割の一例:

• ⌃⌥E(最初の3分の2)— エディタ。コードはターミナルよりも横幅の恩恵を受けやすいため
• ⌃⌥G(最後の3分の1)— ターミナル

これにより、エディタが画面の3分の2を、ターミナルが3分の1を占めることになり、どちらも仕切り線をドラッグすることなくキーボードだけで到達できる。代わりにほぼ均等な3列にしたい場合は、⌃⌥D(最初の3分の1)でウィンドウを巡回させる。同じウィンドウでもう一度押すと中央の3分の1に、さらに押すと最後の3分の1に切り替わるので、エディタ・ターミナル・ブラウザをそれぞれ3つの位置に個別に配置すればいい。

2台のモニター:開発者によくある構成

ノートパソコンに外部ディスプレイをつないでいる場合、典型的な分割はこうなる。

• エディタを外部ディスプレイで最大化(⌃⌥↩)する。もっとも大きく鮮明な画面には、1日中見つめるものをふさわしく配置する。
• エディタの隣にターミナルを表示したいなら、外部ディスプレイの半分か3分の1に置く。外部ディスプレイを1つのアプリ専用にしたいなら、⌃⌥⌘←でノートパソコンの画面に移動させる。
• ブラウザやドキュメントはノートパソコンの画面に置き、最大化するか、メッセージアプリと半分ずつに分ける。

どのアプリをどの画面に置くかを頻繁に入れ替える場合、たとえばノートパソコンの画面を投影しながら外部ディスプレイにメモを残しておくような場合、次のディスプレイと前のディスプレイを使えば、ドラッグし直すことなくアクティブなウィンドウを移動できる。この操作が指の記憶になれば、手作業でドラッグするより速い。

開発者向けツールに特有の、既知の摩擦ポイント

ターミナル系アプリと文字幅単位のサイズ変更。 iTerm2はデフォルトでは、任意のピクセル単位ではなく文字幅の整数倍単位でしかサイズを変更しない。そのため、Rectangle macが計算した半分や3分の1のサイズが、通常のGUIアプリで得られるものからわずかにずれることがある。文書化されている修正方法は次の通りだ。

defaults write com.googlecode.iterm2 DisableWindowSizeSnap -integer 1

実行後はiTerm2を再起動する。Rectangle app自身のメンテナーによれば、Apple純正のTerminal.appも同じ丸め誤差の挙動を示すが、現時点で同等の修正方法は文書化されていない。ピクセル単位で正確なターミナルサイズにこだわりたいなら、この設定を適用したiTerm2のほうが、Terminal.appよりも予測しやすい挙動になる。

独自のキーボードショートカットを持つIDE。 VS CodeやJetBrains系のIDE、その他似たようなツールは、パネル間の移動やリファクタリング用のショートカットなど、自分たちのコマンドにControl + Optionの組み合わせをよく使っており、Rectangle appの標準設定と衝突することがある。Rectangle appをグローバルに再割り当てするのではなく、そのIDEに対してだけアプリを無視を使うといい。IDEをアクティブにし、Rectangleのメニューを開いて「アプリを無視」を選ぶ。これにより、そのIDEが最前面にある間だけRectangleのショートカットが登録解除され、IDE自身のキー割り当てが通常通り機能する。別のアプリに切り替えれば、Rectangleのショートカットは自動的に元に戻る。

フルスクリーンモードは、ウィンドウの本質を変えてしまう。 エディタやターミナルが、通常の最大化されたウィンドウとしてではなく、macOSネイティブのフルスクリーン(専用のスペース)として動作している場合、Rectangleのディスプレイ移動やサイズ変更の操作は、通常のウィンドウモードのアプリに対するようには適用されない。フルスクリーンアプリは、普通の移動可能なウィンドウではないからだ。Rectangleに管理させたいアプリは、ウィンドウモードのままにしておこう。

レイアウトを手作業ではなくスクリプトで組む

RectangleはURLスキームを公開しているため、毎朝4回別々にキーを押す代わりに、決まった日々のレイアウトを1つのスクリプトにまとめてしまえる。

open -a "Visual Studio Code"
sleep 0.5
open -g "rectangle://execute-action?name=first-two-thirds"

open -a "iTerm"
sleep 0.5
open -g "rectangle://execute-action?name=last-third"

それぞれのブロックはアプリをアクティブにし、そのアプリが最前面に来るまで少し待ってから、対応するRectangleのアクションを実行する。これをシェルスクリプトとして保存するか、ホットキーで発動するKeyboard Maestroのマクロに組み込めば、「自分のコーディング用レイアウトを整える」という作業が、4回ではなく1回のキー入力で済むようになる。ただし、これは手作業で組み立てる必要があり、どのディスプレイが接続されているかに応じて自動的に切り替わるわけではない。ディスプレイの接続をトリガーにした自動化は、無料版のスクリプトできれいに再現できるものではなく、Rectangle Proに組み込まれた専用機能だ。

クイックリファレンス

レイアウト	ショートカット
エディタ+ターミナル、単一モニター	⌃⌥← / ⌃⌥→
エディタ+ターミナル、非対称の分割	⌃⌥E(エディタ)/ ⌃⌥G(ターミナル)
エディタ+ターミナル+ブラウザ、3列	⌃⌥D、繰り返し押して巡回
エディタを2台目のディスプレイへ	⌃⌥⌘→ の後に ⌃⌥↩
IDE自身のショートカットを無視する	IDEをアクティブに → Rectangleメニュー → アプリを無視