VS Code多根工作区源代码控制仓库名被按钮遮挡的解决办法

方法1：通过自定义CSS隐藏按钮（需开启自定义CSS支持） #

VS Code本身没有直接隐藏这些操作按钮的原生设置，但可以通过自定义CSS实现：

• 先启用自定义CSS支持：
  1. 打开设置（快捷键Ctrl+,或Cmd+,），搜索window.titleBarStyle，设置为custom。
  2. 在设置JSON中添加以下配置：

     "vscode_custom_css.imports": [
         "file:///path/to/your/custom.css"
     ],
     "vscode_custom_css.policy": true
     

• 创建custom.css文件，写入以下代码来隐藏目标按钮：

  /* 隐藏分支切换按钮 */
  .scm-branch-widget .action-item {
      display: none !important;
  }
  /* 隐藏push/pull等仓库操作按钮 */
  .scm-repository .scm-actions .action-item {
      display: none !important;
  }
  

• 重启VS Code，按提示允许应用自定义CSS即可生效。

方法2：调整布局设置扩大仓库名显示区域 #

通过修改VS Code设置，让仓库名占据更多显示空间：

• 打开设置JSON，添加：

  "scm.repositories.labelWidth": "max",
  "scm.diffDecorations": "none" // 可选：关闭行内差异标记进一步节省空间
  

  该设置会让仓库名尽可能拉伸显示宽度，减少被分支名和按钮遮挡的概率。

方法3：使用扩展增强UI控制 #

如果不想手动编写CSS，可以尝试以下扩展：

• Customize UI：支持可视化自定义VS Code UI元素，包括隐藏特定按钮、调整布局，配置简单就能实现隐藏源代码控制视图的操作按钮。
• SCM Manager：可灵活管理源代码控制视图的显示内容，支持隐藏不必要的控件，优化多仓库场景的显示体验。

额外技巧：缩短分支名显示 #

若上述方案不适用，还可以通过Git配置让VS Code显示缩短的分支名：

• 在终端执行：

  git config --global core.abbrev 7
  

  该配置会让Git仅显示分支名的前7个字符（可根据需求调整数字），减少分支名占据的宽度，间接让仓库名完整显示。

内容的提问来源于stack exchange，提问作者Hermes Hariwald