同じファイルを分割して複数のエディターグループで表示する

Visual Studio Code ではファイルが表示されているエディターを左右または上下に分割して同じファイルを複数のエディタで同時に表示することができます。非常に長いテキストが含まれるファイルを開いている場合に、異なる場所をそれぞれのエディター上で表示して作業したい場合に便利です。ここでは Visual Studio Code で同じファイルを分割して複数のエディターグループで表示する方法について解説します。

(Last modified: )

開いているファイルを分割して表示する

現在開いているファイルを分割して同じファイルを複数のエディタで表示する方法です。非常に長いテキストが含まれるファイルの別々の場所同時に見たい場合に便利です。

例として次のようなファイルを開いている状態から試してみます。

開いているファイルを分割して表示する(1)

ファイルを分割して表示するには「表示」メニューの中の「エディターレイアウト」にマウスを合わせてください。サブメニューとして「分割(上)」「分割(下)」「分割(左)」「分割(右)」の 4 つが表示されます。

開いているファイルを分割して表示する(2)

「分割(上)」メニューをクリックすると、現在アクティブになっているエディターが上下に分割され、現在のエディターの上に新しいエディターが表示されて同じファイルが表示されます。

開いているファイルを分割して表示する(3)

開いているファイルを分割して表示する(4)

「分割(下)」メニューをクリックした場合も同じように上下に分割されて、現在のエディタの下に新しいエディターが表示されて同じファイルが表示されます。

「分割(左)」メニューをクリックすると、現在アクティブになっているエディターが左右に分割され、現在のエディターの左に新しいエディターが表示されて同じファイルが表示されます。

開いているファイルを分割して表示する(5)

開いているファイルを分割して表示する(6)

「分割(右)」メニューをクリックした場合も同じように左右に分割されて、現在のエディタの右に新しいエディターが表示されて同じファイルが表示されます。

分割は 1 回だけではなくさらに続けて行うことができます。例えば左右に分割したあとで、そのうちの一つのエディターをさらに上下に分割することもできます。

開いているファイルを分割して表示する(7)

上下に分割したエディターをさらに上下に分割することもできます。

開いているファイルを分割して表示する(8)

分割されたエディターは、ひとつひとつをエディターグループと呼びます。エクスプローラーを表示すると、現在開いているエディターグループを確認することができます。

開いているファイルを分割して表示する(9)

開いているファイルを分割して表示する(10)

エディターグループで別のファイルを開く

エディターを分割した場合、デフォルトでは同じファイルが開きますが、エディター毎に別のファイルを開くこともできます。別のファイルを開きたいエディターをクリックしてアクティブにしたあとで、例えば「ファイル」メニューの中の「ファイルを開く」をクリックして別のファイルを開いてください。

エディターグループで別のファイルを開く(1)

アクティブにしていた左側のエディターで別のファイルが開きました。

エディターグループで別のファイルを開く(2)

今回ファイルが開いている状態で別のファイルを開いたので、左側のエディターには 2 つのファイルが開いている状態になっています。このようにエディター毎に複数のファイルを開くことができます。

エディターグループで別のファイルを開く(3)

エディターグループを閉じる

エディターグループを閉じるには、閉じたいエディターグループの右上に表示されている「・・・」をクリックし、表示されたメニューの中から「すべて閉じる」をクリックしてください。

エディターグループを閉じる(1)

左側にあったエディターグループを閉じることができました。(エディターグループの中に保存していないファイルがあった場合は保存するかどうかの確認ダイアログが表示されます)。

エディターグループを閉じる(2)

なおエディターグループはエディターグループの中で開いているファイルをすべて閉じると自動的に閉じますので、エディターグループで開いているすべてのファイルのタブの「×」をクリックしてファイルを閉じるとエディターグループを閉じることができます。

エディターグループを閉じる(4)

エディターグループを閉じる(5)

左側にあったエディターグループを閉じることができました。

エディターグループを閉じる(6)

-- --

Visual Studio Code で同じファイルを分割して複数のエディターで同時に表示する方法について解説しました。

( Written by Tatsuo Ikura )

Profile
profile_img

著者 / TATSUO IKURA

プログラミングや開発環境構築の解説サイトを運営しています。