Visual Studio代码状态栏颜色

101

Visual Studio Code的默认状态栏颜色为蓝色，我觉得这很分散注意力。我使用此扩展名来更改颜色，但1.10.2更新后它已停止工作。

visual-studio-code background-color statusbar

— 沙赫拜卜·拉希姆
source

11

请批准答案:)

— 霍姆斯（Jols）2017年

189

您可以通过在状态栏中添加以下代码行来编辑用户设置来更改状态栏的颜色：

"workbench.colorCustomizations": {
    "statusBar.background" : "#1A1A1A",
    "statusBar.noFolderBackground" : "#212121",
    "statusBar.debuggingBackground": "#263238"
}

— ces
source

可以动态完成吗？const config2 = vscode.workspace.getConfiguration('workbench.colorCustomizations.statusBar'); config2.update('background', '#1A1A1A');似乎什么都没做？

— 汤姆·H

@TomH我不是专家，也不十分确定它是如何“动态地”完成的，但是运行Object.assign(vscode.workspace.getConfiguration('workbench.colorCustomizations'), { "statusBar.background" : "#00FF00"})给我带来TypeError告诉我我们不能分配给只读属性。因此，我猜想使用getConfiguration方法不是正确的方法。

— acesmndr

3

感谢@acesmndr，它的运行效果很好。如此处所述：code.visualstudio.com/docs/getstarted/…，您还可以对特定于用户设置文件的主题进行如下更改：“ workbench.colorCustomizations”：{“ [Markdown Editor Dark]”：{“ statusBar .background”：“＃1A1A1A”，“ statusBar.noFolderBackground”：“＃212121”，“ statusBar.debuggingBackground”：“＃263238”}}，

— Walton

真有帮助的答案@acesmndr

— Akhila

62

1）将节省30分钟的时间给像我这样的菜鸟-必须在settings.json文件中对其进行编辑。访问的最简单方法是在文件->首选项->设置中，搜索“颜色”，选择一个选项“工作台：颜色自定义”->“在settings.json中编辑”。

2）这使用了“ Gama11”提出的解决方案，但是！note !： settings.json中代码的最终形式应该是这样的-注意“ workbench.colorCustomizations”周围的双花括号：

{
  // fontSize just for testing purposes, commented out.
  //"editor.fontSize" : 12

  // StatusBar color:
     "workbench.colorCustomizations": {
     "statusBar.background" : "#303030",
     "statusBar.noFolderBackground" : "#222225",
     "statusBar.debuggingBackground": "#511f1f"
    }
}

复制/粘贴上面的代码后，请按Ctrl + S将更改保存到“ settings.json”。

解决方案已从此处改编：https : //code.visualstudio.com/api/references/theme-color

— 保罗
source

21

由于每个主题都如此不同，因此您可能不想在全球范围内进行此类更改。而是根据每个主题指定它们：例如：

"workbench.colorCustomizations": {
    "[Some Theme Name]": {
        "statusBar.background" : "#486357",
        "statusBar.foreground" : "#c8e9c5",
    },
    "[Some Other Theme Name]": {
        "statusBar.background" : "#385357",
        "statusBar.foreground" : "#d7e9c4",
    }
},

这样，当您在自己喜欢的主题之间切换时，对它们的自定义设置不会被遗忘，并且在这种情况下是有意义的。

— hack客
source

2

当打开多个VSCode实例时，将其应用于工作空间设置以区分不同的项目也很好。你也可以改变titleBar.activeBackground，并titleBar.activeForeground使其更为明显。

— Qwerty

请注意，就像其他答案一样，您可能还需要设置statusBar.noFolderBackground和statusBar.debuggingBackground，否则它们不会受到影响。

— 青金石

3

在我看来，有一个比上述答案更强大，更可靠的解决方案，那就是根据您正在处理的文件更改状态栏的颜色-称为ColorTabs
，它允许您提供正则表达式列表并进行更改基于此的颜色。

免责声明-我写了扩展程序Enjoy！

— 矿石
source

不错的扩展-希望正则表达式可以在完整路径上工作，以便我可以区分所有VSCode打开的项目。

— cyberwombat

1

它实际上是在完整路径上，但我将其更改为相对路径...也许可以对其进行配置

— orepor

1

最好在分支上配置选项卡颜色而不是文件名-如果开发为->绿色，qa->橙色，母版->红色，其他->默认值？

— Johan Aspeling

1

写解决问题的扩展程序的人的票数比其他重复最高职位的帖子的帖子要少，很好。

— a.anev

1

control+shift+p当您打开vscode并输入open settings(UI)并搜索window.titleBarStyle并将其更改为时，请按native，custom以便将状态栏的颜色从还原white为black。

重要说明：此技术适用于2019年2月发布的vscode的更新版本1.32。请确保已将您的vscode更新为最新版本1.32或其他最新版本，因为它可能不适用于旧版本。

— 拉胡尔·艾尔（Rahul Ahire）
source

7

不能回答与状态栏无关的问题

— Gal Margalit，

就像Gal上面说的那样，标题栏不是状态栏 -前者在顶部，后者在底部

— 启示19/12/28

1

还有一个扩展名可用https://marketplace.visualstudio.com/items?itemName=johnpapa.vscode-peacock来更改工作场所的颜色。它允许您为每个vs代码实例选择不同的颜色

— 马克西姆·伊萨夫（Maxim Isaev）
source

0

您可以通过修改扩展名来更改颜色：

 "colors":{
        "statusBar.background": "#505050",
    },

— 用户名
source

0

这些是我在macOS上为工作区（而非全局）设置VS Code状态栏颜色的步骤。

查看| 命令面板... | 搜索“打开工作区设置（JSON）”

（这将打开项目[project-name] .code-workspace文件。）

在设置属性中添加颜色自定义。

{
    "folders": [],
    "settings": {
        "workbench.colorCustomizations": {
            "statusBar.background": "#938e04",
            "statusBar.foreground": "#ffffff"
        }
    }
}

当您有多个VS Code实例打开并且想要在视觉上区分每个窗口而不必更改全局主题时，这非常有用。

— HelloWorldDude
source