15 min/d

ぼうずやのにっき

Visual Studio Code で制御文字を表示する

最近いろいろなところで制御文字を入力してしまっているようだ。キーボードの設定が悪いのかもしれない。誤って入力しても気づけるように Visual Studio Code で制御文字を表示したくなった。

まずは設定を変えて制御文字を表示する。 Preferences: Open User Settings コマンドを実行して設定を書き換える。

...
"editor.renderControlCharacters": true,
...

ただ、これだけだと文字色が同じで分かりづらいので Whitespace+ という拡張を入れる。

Whitespace+ Config コマンドを実行して設定を書き換える。ぼくは↓のようなものを入れた。ほかの設定からとってきて、 patterndark のときの backgroundColor を変えただけ。

...
{
    "name": "control",
    "enabled": true,
    "pattern": "[\\cA-\\cZ]+",
    "style": {
        "borderWidth": "1px",
        "borderRadius": "2px",
        "borderStyle": "solid",
        "light": {
            "backgroundColor": "rgba(58, 70, 101, 0.3)",
            "borderColor": "rgba(58, 70, 101, 0.4)"
        },
        "dark": {
            "backgroundColor": "rgba(255, 0, 0, 0.5)",
            "borderColor": "rgba(117, 141, 203, 0.4)"
        }
    }
}
...

あとは Whitespace+ Toggle で有効にすると……。いい感じだ。