Visual Studio Code 工作台（资源管理器）行高

Question

我已经在整个互联网上对Visual Studio Code进行了研究，但没有找到关于工作台（带有项目目录和文件的资源管理器）条目行高的任何信息。 如何更改工作台中的行高？

我之所以问这个问题，是因为在版本1.65.2中的标准行高对于具有许多目录和文件的项目来说太大了。我想在正确的结构下查看相关目录和文件，而不需要不断滚动屏幕，所以我必须减小这个行高。

- Manium

---

没有解决方案？**:(** - Manium

很遗憾，您无法进行调整。请参考此链接：https://github.com/microsoft/vscode/issues/59873 和 https://github.com/microsoft/vscode/issues/519 - kanlukasz

@kanlukasz 幸运的是，你可以使用“自定义 UI”扩展来实现。 - Manium

Answer 1

这在原有功能中是不可能的，但使用扩展程序“自定义 UI”则可以实现。

扩展程序链接：VS Code 自定义 UI

截至2022-11-16的最新更新信息：

More Info
Version 0.1.65  
Released on 6/6/2019, 7:47:09 AM    
Last updated    
9/25/2022, 3:51:30 AM
Publisher   iocave  
Unique Identifier   iocave.customize-ui

来自自定义UI README的功能列表：

This experimental extension allows customizing VSCode user interface beyond what's
normally possible, such as:

Changing interface fonts
Inline titlebar on macOS
Activity bar below sidebar
Custom stylesheet rules conveniently specified in settings.json

- Manium

---

你的回答可以通过提供更多支持信息来改进。请编辑以添加进一步的细节，例如引用或文档，以便他人可以确认你的答案是正确的。您可以在帮助中心中找到有关如何编写良好答案的更多信息。 - Community

Answer 2

我相信整体目标是不可能的，即使考虑到像“自定义UI”和“自定义CSS和JS加载器”这样的插件，因为VSCode会精确地加载屏幕上能容纳的行数。

然而，从技术上讲，改变行高是可能的。

我编写了JavaScript，并使用“自定义CSS和JS加载器”扩展加载它，将项目从22px缩小到18px以匹配我的编辑器间距，结果在屏幕上保留了相同数量的资源管理器条目和一大片空白。

供参考，以下是该JavaScript代码：

function modifyTopProperty(element) {
  let id = element.id;
  let index = parseInt(id.split('_').pop());
  let expectedTopValue = index * 18;

  let style = window.getComputedStyle(element);
  let topValue = parseInt(style.top.replace('px', ''));

  // Only change the top value if it's not already at the expected value
  if (topValue !== expectedTopValue) {
    element.style.top = `${expectedTopValue}px`;
    element.style.height = `18px`;
    element.style.lineHeight = `18px`;
  }
}

let observer = new MutationObserver((mutations) => {
  mutations.forEach((mutation) => {
    if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
      mutation.addedNodes.forEach((node) => {
        if (node.matches && node.matches('.explorer-folders-view .monaco-list .monaco-list-row')) {
          modifyTopProperty(node);
        }
      });
    }
    if (mutation.type === 'attributes' && mutation.attributeName === 'style') {
      if (mutation.target.matches('.explorer-folders-view .monaco-list .monaco-list-row')) {
        modifyTopProperty(mutation.target);
      }
    }
  });
});

observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style'] });

再次，你的清单上的元素数量会遗憾地保持不变，但它们会变得更小。也许投票支持这个问题可以增加这个功能被实施的可能性。

- Gordon Fogus