VSCode：よく使うレイアウト（画面分割）を一発で呼び出す

こんにちは、さちです。

普段、ウェブサイトを作るときは「Visual Studio Code（以下：VSCode）」を使っています。動作が軽く色々な機能も追加できるのに、無料で利用できる最強のコードエディターアプリです。

今回は、この VSCode で、よく使う「エディターレイアウト（画面分割）」を一発で呼び出せるようにしてみます。

よく使うレイアウトを一発設定したい
自作のレイアウトをショートカット登録する
- 操作手順
- 「keybindings.json」の記述方法
【おまけ】一発で「1画面（シングル）」に戻す

よく使うレイアウトを一発設定したい

私が VSCode でよく使う「エディターレイアウト（画面分割）」はこんな感じです。

VSCode の標準機能だけでも実現はできるんですが、意外と手間がかかります。

下記の記事の Sublime Text のときのように、一発でこのレイアウト（画面分割）を呼び出せるようにしてみます。

Sublime Text 3：画面を変則的に分割する方法

こんにちは、さちです。今更ながら、最近「Sublime Text 3」を使い始めました。起動と動作が軽い、編集機能が秀逸、カスタマイズ性が高いと三拍子そろったサイト制作に非常に便利なテキストエディターで評判の良さが分かった気がします。た

自作のレイアウトをショートカット登録する

操作手順

左側のアクティビティバーにある「管理（歯車）」アイコンをクリックします。
「キーボードショートカット」をクリック。（ショートカットは Ctrl を押しながら K S の順にキーを押す）
右上にある「キーボードショートカットを開く（JSON）」アイコンをクリック。
開いた「keybindings.json」に次のように追記します（一番外の { と } の中に書く）。key は割り当てるショートカットキーです。今回は、Alt + 3（テンキー）キーにしました。完成したら「保存」しましょう。（記述方法の詳細は次項で書きます）
```
{
  "key": "alt+numpad3",
  "command": "layoutEditorGroups",
  "args": {
    "orientation": 0,
    "groups": [
      { "size": 0.7, "groups": [ {}, {} ] },
      { "size": 0.3 },
    ]
  }
},
```
これで、設定したショートカットキー（ Alt + 3（テンキー））を押すだけで、エディターレイアウト（画面分割）を一発で呼び出せるようになりました。

「keybindings.json」の記述方法

別の形の「レイアウト（画面分割）」を登録したい人もいると思うので、「keybindings.json」での記述方法ついて解説します。

例として、前述の設定を詳しく見ていきましょう。（ "command": "layoutEditorGroups", は固定なので省略）

{
  "key": "alt+numpad3",
  "command": "layoutEditorGroups",
  "args": {
    "orientation": 0,
    "groups": [
      { "size": 0.7, "groups": [ {}, {} ] },
      { "size": 0.3 },
    ]
  }
},