VS Code 拡張 Background Phi Colors の紹介を兼ねた日本語ドキュメント
Background Phi Colors - Visual Studio Marketplace
エディタ内のテキストの背景を様々に着色する VS Code 拡張 Background Phi Colors を作り、公開しました。
この拡張は対象となるテキストファイルの種類の問わず、動作としてはただ背景を着色するだけですが、事実上、常に検索がフルオートで動作する状態になり、触覚によって手探りで物体を認識している状態から視覚によって視て物体を認識する状態になるような、そういう方向の認識力補正が働き、コードに対する認識力向上を体験して頂けると思います。残念ながら、恐らく万人向けではなく人によって合う合わないの差が激しいのではないかと思いますが、合う人にとってはとても強力な拡張になるかと。
デモとなるアニメーション GIF をここに貼り付けてたんですが、内容を更新してサイズがデカくなると Qiita 内で表示されなくなってしまったので、こちらのツイートに添付してる動画を参照してください。
Visual Studio Code 拡張の Background Phi Colors v1.0.0 をリリースしました。このバージョンからプレビューではなく正式リリースです。v0.9.0からかなり細々と弄ったので修正内容は CHANGLOG をご確認ください。 https://t.co/Nj0LAelzoG pic.twitter.com/N67OEPm6Ni
— 👻 道化師 🃏 (@wraith13) 2019年5月4日
機能
この拡張は以下の着色を行います。
- インデントの深さに応じた着色
- エラーインデント
- 現在行
- トークン
- 記号類( default ではオフ)
- 行頭と行末を除く連続した二つ以上の半角スペース
- 行末のスペース
コマンド
コマンドパレット( Mac:F1 あるいは Shift+Command+P, Windows および Linux: F1 あるいは Shift+Ctrl+P )から以下のコマンドを利用できます。
-
Background Phi Colors: Active Scrope: Editor: アクティブスコープをエディタ単位に設定します。ハイライト表示は他のエディタと共有されません。 -
Background Phi Colors: Active Scrope: Document: アクティブスコープをドキュメント単位に設定します。ハイライト表示が同じドキュメントを開いている他のエディタと共有されます。 -
Background Phi Colors: Active Scrope: Window: アクティブスコープをウィンドウ単位に設定します。ハイライト表示が全てのエディタと共有されます。 -
Background Phi Colors: Toggle Mute: フォーカスの当たっているテキストエディタの着色を無効化します。コマンドをもう一度実行すると有効化します。backgroundPhiColors.enabled設定より優先されます。 -
Background Phi Colors: Toggle Mute All: 全てのテキストエディタの着色を無効化します。コマンドをもう一度実行すると有効化します。backgroundPhiColors.enabled設定より優先されます。 -
Background Phi Colors: Toggle Pause: フォーカスの当たっているテキストエディタの現在の強調表示をカーソルを移動してもキープします。コマンドをもう一度実行すると通常の状態に戻ります。 -
Background Phi Colors: Toggle Pause All: 全てのテキストエディタの現在の強調表示をカーソルを移動してもキープします。コマンドをもう一度実行すると通常の状態に戻ります。 -
Background Phi Colors: Over the Limit: ファイルサイズ制限に引っかかってこの拡張が動作を自制している場合に、強制的に稼働させます。マシンパワーやテキストファイルによっては VS Code が著しく重くなることがありますのでご注意ください。著しく重くなってしまった場合は、一旦、 VS Code を終了あるいは強制終了してください。 -
Background Phi Colors: Report Profile: この拡張自信のプロファイリングレポートを表示します。
設定
この拡張は以下の設定を提供します。( 設定画面の表示方法： Mac: Command+,, Windows / Linux: File -> Preferences -> User Settings )
-
backgroundPhiColors.enabled: 背景の着色を有効にする。 ( この設定値よりBackground Phi Colors: Toggle MuteコマンドおよびBackground Phi Colors: Toggle Mute Allコマンドが優先されます。 ) -
backgroundPhiColors.enabledPanels: [出力]での背景の着色を有効にする。 -
backgroundPhiColors.fileSizeLimit: これより大きなサイズのファイルでは機能しません。 -
backgroundPhiColors.basicDelay: イベント発生から着色までの遅延(ミリ秒) -
backgroundPhiColors.additionalDelay: 更新イベント発生から着色までの追加の遅延(ミリ秒) -
backgroundPhiColors.baseColor: 背景色はこの色を元に色相を全周の 1 / φ ずつ回転させて自動生成されます。 ( #RRGGBB ) -
backgroundPhiColors.spaceBaseColor: 空白の背景色はこの色を元に色相を全周の 1 / φ ずつ回転させて自動生成されます。この値が null の場合、代わりにbackgroundPhiColors.baseColorが使用されます。 ( #RRGGBB ) -
backgroundPhiColors.spaceErrorColor: エラーの空白の背景色。 ( #RRGGBB ) -
backgroundPhiColors.symbolBaseColor: シンボルの背景色はこの色を元に色相を全周の 1 / φ ずつ回転させて自動生成されます。この値が null の場合、代わりにbackgroundPhiColors.baseColorが使用されます。 ( #RRGGBB ) -
backgroundPhiColors.symbolColorMap: 各シンボル毎の背景色を指定できます。 -
backgroundPhiColors.tokenBaseColor: トークンの背景色はこの色を元に色相を全周の 1 / φ ずつ回転させて自動生成されます。この値が null の場合、代わりにbackgroundPhiColors.baseColorが使用されます。 ( #RRGGBB ) -
backgroundPhiColors.tokenColorMap: 各トークン毎の背景色を指定できます。 -
backgroundPhiColors.indentMode:none: インデントを着色しません,light: 静的に全インデントを着色します,smart: 現在のインデントを着色します,full: light + smart -
backgroundPhiColors.lineEnabled: 現在行を着色します。 -
backgroundPhiColors.tokenMode:none: トークンを着色しません,light: 静的に全トークンを着色します,smart: 現在行に含まれるトークンを着色します,full: light + smart -
backgroundPhiColors.activeScope:editor: エディタ毎にハイライトされます,document: 同じドキュメントのエディタ間でハイライトが共有されます,window: 全てのエディタ間でハイライトが共有されます -
backgroundPhiColors.indentErrorEnabled: インデントエラーを表示します。 -
backgroundPhiColors.trailingSpacesErrorEnabled: 末尾の空白をエラーとして着色します。 -
backgroundPhiColors.bodySpacesEnabled: インデントと末尾を除いて二つ以上の連続する空白文字を着色します。 -
backgroundPhiColors.trailingSpacesEnabled: 末尾の空白を着色します。 -
backgroundPhiColors.symbolEnabled: シンボルの背景を着色します。 -
backgroundPhiColors.indentErrorInOverviewRulerLane: インデントエラーのオーバービュールーラーでの表示レーン。 -
backgroundPhiColors.activeTokenInOverviewRulerLane: アクティブなトークンのオーバービュールーラーでの表示レーン。 -
backgroundPhiColors.trailingSpacesErrorInOverviewRulerLane: 末尾空白エラーのオーバービュールーラーでの表示レーン。 -
backgroundPhiColors.spacesAlpha: 空白の背景色の不透明度。( 0 - 255) -
backgroundPhiColors.spacesActiveAlpha: アクティブな空白の背景色の不透明度。( 0 - 255) -
backgroundPhiColors.spacesErrorAlpha: エラーな空白の背景色の不透明度。( 0 - 255) -
backgroundPhiColors.symbolAlpha: シンボルの背景色の不透明度。( 0 - 255) -
backgroundPhiColors.tokenAlpha: トークンの背景色の不透明度。( 0 - 255) -
backgroundPhiColors.tokenActiveAlpha: アクティブなトークンの背景色の不透明度。( 0 - 255) -
backgroundPhiColors.indent: インデント単位 -
backgroundPhiColors.enabledProfile: 自己プロファイラを有効にする。
設定サンプル
"backgroundPhiColors.tokenColorMap":
{
"if": null,
"else": null,
"wraith13": "#0000FF"
}
キーボードショートカット
デフォルトでは Background Phi Colors のコマンドにはキーボードショートカットが設定されていません。
必要に応じて keybindings.json
( Mac: Code -> Preferences -> Keyboard Shortcuts, Windows / Linux: File -> Preferences -> Keyboard Shortcuts) でキーボードショートカットを指定してください。
keybindings.json 上でのコマンド名はコマンドパレット上のモノとは異なります。以下のテーブルを参照してください。
| コマンドパレット | keybindings.json |
|---|---|
Background Phi Colors: Active Scope: Editor |
backgroundPhiColors.activeScopeEditor |
Background Phi Colors: Active Scope: Document |
backgroundPhiColors.activeScopeDocument |
Background Phi Colors: Active Scope: Window |
backgroundPhiColors.activeScopeWindow |
Background Phi Colors: Toggle Mute |
backgroundPhiColors.toggleMute |
Background Phi Colors: Toggle Mute All |
backgroundPhiColors.togglePauseAll |
Background Phi Colors: Toggle Pause |
backgroundPhiColors.togglePause |
Background Phi Colors: Toggle Pause All |
backgroundPhiColors.togglePauseAll |
Background Phi Colors: Over the Limit |
backgroundPhiColors.overTheLimig |
Background Phi Colors: Report Profile |
backgroundPhiColors.reportProfile |