Skip to content

Latest commit

 

History

History
214 lines (143 loc) · 9.2 KB

README.ja-JP.md

File metadata and controls

214 lines (143 loc) · 9.2 KB

logo

vscode-background

Visual Studio Codeにも背景画像を。

エディターごとの画像表示全画面の画像表示画像の切り替わり画像・CSSのカスタマイズ...

GitHub | Visual Studio Marketplace

Version Installs Ratings Stars Build Status License


エディターごとの画像

背景画像の全画面表示

インストール

サイドバーの拡張機能タブからbackgroundを検索!

カスタマイズ

settings.jsonからユーザー設定をカスタマイズすることができます。

settings.jsonとは | 設定方法

コンフィグ

基本設定

設定 タイプ デフォルト 説明
background.enabled Boolean true 拡張機能を有効化するかどうかを制御します。

デフォルト設定

設定 タイプ デフォルト 説明
background.useFront Boolean true 画像を最前面に表示するかどうかを制御します。
background.useDefault Boolean true デフォルトの画像を使用するかどうかを制御します。
background.style Object {} 全ての画像に適応されるCSSを制御します。
background.styles Array<Object> [{},{},{}] 個別の画像に適応されるCSSを制御します。
background.customImages Array<String> [] 画像のパスを指定してください。
background.loop Boolean false 画像をリピートするかどうかを制御します。
background.interval Number 0 次の画像を表示するまでの秒数を制御します。0の場合、画像は変更されません。

CSSについて知る css style

フルスクリーン設定

デフォルト設定を上書きする可能性があります。

設定 タイプ デフォルト 説明
background.fullscreen Object null Set the image to fullscreen

使用例

  1. 拡張機能を無効化する
{
  "background.enabled": false
}
  1. カスタムイメージを使用する

https通信を採用しているリンクを使用する必要があります。
http通信はVSCodeにより制限されています。

{
  "background.useDefault": false,
  "background.customImages": ["https://a.com/b.png", "file:///Users/somepath/a.jpg"]
}
  1. カスタムCSS - 透明度
{
  "background.style": {
    "opacity": 0.6
  }
}
  1. カスタムCSS - 画像サイズ
{
  "background.style": {
    "background-size": "300px 460px"//"横幅 縦幅"
  }
}
  1. 全画面表示
{
  "background.fullscreen": {
    "image": "https://pathtoimage.png", // URLもしくはファイルパス(file:///~/~.png)
    // "image": ["https://pathtoimage.png"], // 配列を使用することで複数の画像を設定できます
    "opacity": 0.91, // 0.85 ~ 0.95 がおすすめです
    "size": "cover", // CSSのbackground-sizeに相当します。"cover" ,"contain","200px 200px"のように設定します
    "interval": 0 // 次の画像を表示するまでの秒数を制御します。`0`の場合、画像は変更されません。
  }
}

警告

この拡張機能は、VSCode本体のCSSファイルを編集することで機能します。 そのため、初回インストール時または vscode 更新時に警告が表示されます。 [二度と表示しない] をクリックして非表示にできます。

原因:

アンインストール

3つの方法

1. (おすすめ)

F1キーを押し、コマンドパネルを開ます。
「Background -Uninstall (remove extension)」と入力して、  
自動アンインストールします。

2.

setting.jsonで{"background.enabled": false}  と変更してから  
手動でアンインストールします。

3. An unfriendly way:

If you uninstall this plugin directly, don't worry.
Exit vscode completely, then open, then reload. Now it's clean :D
(I know it's strange... Because of the limit of vscode)

貢献者 🙏

shalldie NoDocCat frg2089 mwSora tumit asurinsaka u3u kuresaru Unthrottled rogeraabbccdd

チェンジログ

チェンジログで全ての変更を確認できます。

よくある質問


Q: [Code インストールが壊れている可能性があります。]を消すには?
A: 確認してください: https://github.com/lehni/vscode-fix-checksums

Q: MACに拡張機能をインストールしましたが、機能しません。
A: `Visual Studio Code` を`Download`フォルダー から`Applications`フォルダーに移動してください。

Q: The extension runs based on the modified vscode CSS file, and will try to raise the right within a limited time.
   If it stop working for some reason, what if users need to change their permissions?

A: In windows,click right button on the vscode's icon,then check the [run with the administrator authority].
A: in mac/linux, try this: https://github.com/shalldie/vscode-background/issues/6 .

ライセンス

MIT