※この記事は四工大アドベントカレンダー 2023の参加記事です。
背景
こんにちは、うだいです。
昨日の記事に引き続いてVSCodeの話をします。
今回はVSCodeでかっこいいスクリーンショットを撮るお話です。
「Polacode」
早速ですが、VSCodeには「Polacode」という拡張機能があります。
この拡張機能を使うと以下のようなきれいなスクリーンショット(より正確に言うとコードのスナップショット)が撮れます。
この拡張機能は120万を超える圧倒的なダウンロード数を誇りますが、いくつかのUX的な問題を抱えています。
- 2020年に開発・サポートが終了している
- 背景色が完全な白(
#ffffff)ではない - 背景を透明にできない
- 影をオフにできない
- 撮影するのにVSCodeのコマンドパレットを開きコマンドを打ち込む必要がある
そのためこのプロジェクトは多くのフォークを生み出しており、VSCodeの拡張機能検索画面で「Polacode」と入力すると多くの類似拡張機能を発見できます。
ベストな選択
そこで私は上記の問題を解決するために2つの拡張機能を組み合わせることで対処をしています。
Polacode-2022
polacode-button
Polacode-2022
「Polacode-2022」は jeff-hykin氏によるPolacodeのフォークです。
標準の機能に加え、
- 背景色の変更
- 背景の透明化オンオフ
- 影のオンオフ
の機能があります。
polacode-button
「polacode-button」は私が自作した拡張機能です。
この拡張機能自体はスクリーンショットを撮影する機能を持たず、VSCode最下部のステータスバーにPolacodeを開くためのボタンを追加します。
VSCodeの拡張機能アクティベーションは、コマンドさえわかれば他の拡張機能から発火させることが簡単にできます。
まとめ
これらの拡張機能によってパッと簡単にコードのスクリーンショット(スナップショット)を撮影してスライドなどに埋め込むことができるようになりました。
また、VSCodeの拡張機能開発は非常に敷居が低いのでぜひ物足りなさを感じたら作ってみてくださいね。