VS Codeの新機能がすごく便利! ツリービューのスティッキースクロール機能をオンにすると格段に使いやすくなります
Post on:2024年2月15日
先日アップデートされた、VS Code v1.86で、スティッキースクロールがツリービューでも使用できるようになったので、紹介します。
エディタのスティッキースクロール(紹介記事)ができるようになった時もその便利さに喜びましたが、ツリービューでもできるようになり、深い階層でもすべての親を常に表示しておくことができます。
ツリービューのスティッキースクロールを使用するには、デフォルトではオフになっているので、機能をオンにする必要があります。
※オンになっている人もいるようですね。

ツリービューのスティッキースクロール
ツリービューのスティッキースクロールは、VS Code v1.86で実装された新機能で、プロジェクトツリーをより簡単にナビゲートできるようになります。

Sticky Scroll in tree views -VS Code v1.86のアップデート情報
ツリービューの上部に親がスティッキーされ、常に現在の場所を把握することができます。また、スティッキースクロールは、ツリービューでスペースを取り過ぎないように、ビューの高さの最大40%に制限されています。

ツリービューのスティッキースクロール
スティッキー要素の最大数は、デフォルトでは7に設定されています。7は多いなという人は、workbench.tree.stickyScrollMaxItemCount
で数を変更できます。
さらに、スティッキー要素を選択して、ツリー内の要素に直接ジャンプしたり、親要素の山形をクリックしてすべての子要素を非表示することもできます。さらに、チェックボックスやアクション項目へのアクセスも簡単になります。

ツリービューのスティッキースクロール
「ツリービューのスティッキースクロール」を使用するのは、簡単です。
VS Codeの設定(command + ,)を開き、「Workbench > Tree: Enable Stick Scroll」のチェックをオンにします。

VS Codeの設定画面
「workbench.tree.enableStickyScroll」で検索するとすぐ見つかります。

VS Codeの設定画面
settings.json(設定の上部アイコン)に記述する場合は、下記の通り。
1 |
"workbench.tree.enableStickyScroll": true |
これで、ツリービューのスティッキースクロールができるようになります。

ツリービューのスティッキースクロール
sponsors