文件图标主题

Visual Studio Code 在其整个 UI 中显示文件名旁边的图标，扩展可以贡献新的文件图标集，用户可以从中选择。

添加新的文件图标主题

你可以从图标（最好是 SVG）和图标字体创建自己的文件图标主题。例如，查看两个内置主题：Minimal 和 Seti。

首先，创建一个 VS Code 扩展并添加 iconTheme 贡献点。

{
  "contributes": {
    "iconThemes": [
      {
        "id": "turtles",
        "label": "Turtles",
        "path": "./fileicons/turtles-icon-theme.json"
      }
    ]
  }
}

id 是图标主题的标识符。它用作设置中的标识符，因此请使其唯一且可读。label 显示在文件图标主题选择器下拉菜单中。path 指向扩展中定义图标集的文件。如果你的图标集名称遵循 *icon-theme.json 名称方案，你将在 VS Code 中获得代码补全支持和悬停。

文件图标集文件

文件图标集文件是一个 JSON 文件，包含文件图标关联和图标定义。

图标关联将文件类型（'file'、'folder'、'json-file' ...）映射到图标定义。图标定义定义图标的位置：可以是图像文件，也可以是字体中的字形。

图标定义

iconDefinitions 部分包含所有定义。每个定义都有一个 id，它将用于引用定义。一个定义也可以被多个文件关联引用。

{
  "iconDefinitions": {
    "_folder_dark": {
      "iconPath": "./images/Folder_16x_inverse.svg"
    }
  }
}

上面的图标定义包含一个标识符为 _folder_dark 的定义。

支持以下属性

iconPath：使用 svg/png 时：指向图像的路径。
fontCharacter：使用字形字体时：要使用的字体中的字符。
fontColor：使用字形字体时：要使用的字形颜色。
fontSize：使用字体时：字体大小。默认情况下，将使用字体规范中指定的大小。应该是相对于父字体大小的相对大小（例如 150%）。
fontId：使用字体时：字体的 id。如果未指定，将选择字体规范部分中指定的第一个字体。

文件关联

图标可以与文件夹、文件夹名称、文件、文件扩展名、文件名和语言 ID 关联。

此外，这些关联中的每一个都可以针对 'light' 和 'highContrast' 颜色主题进行细化。

每个文件关联都指向一个图标定义。

{
  "file": "_file_dark",
  "folder": "_folder_dark",
  "folderExpanded": "_folder_open_dark",
  "folderNames": {
    ".vscode": "_vscode_folder"
  },
  "fileExtensions": {
    "ini": "_ini_file"
  },
  "fileNames": {
    "win.ini": "_win_ini_file"
  },
  "languageIds": {
    "ini": "_ini_file"
  },
  "light": {
    "folderExpanded": "_folder_open_light",
    "folder": "_folder_light",
    "file": "_file_light",
    "fileExtensions": {
      "ini": "_ini_file_light"
    }
  },
  "highContrast": {}
}

file 是默认文件图标，显示在与任何扩展、文件名或语言 ID 不匹配的所有文件上。当前，文件图标定义定义的所有属性将被继承（仅与字形字体相关，对于 fontSize 有用）。
folder 是折叠文件夹的文件夹图标，如果未设置 folderExpanded，则也是展开文件夹的图标。可以使用 folderNames 属性将图标与特定文件夹名称关联。文件夹图标是可选的。如果未设置，则不会显示文件夹图标。
folderExpanded 是展开文件夹的文件夹图标。展开文件夹图标是可选的。如果未设置，将显示为 folder 定义的图标。
folderNames 将文件夹名称与图标关联。集合的键是文件夹名称，可选地以单个父路径段 (*) 为前缀。不支持模式或通配符。文件夹名称匹配不区分大小写。
folderNamesExpanded 将文件夹名称与展开文件夹的图标关联。集合的键是文件夹名称，可选地以单个父路径段 (*) 为前缀。不支持模式或通配符。文件夹名称匹配不区分大小写。
rootFolder 是折叠的工作区根文件夹的文件夹图标，如果未设置 rootFolderExpanded，则也是展开的工作区根文件夹的图标。如果未设置，将显示为 folder 定义的图标，用于工作区根文件夹。
rootFolderExpanded 是展开的工作区根文件夹的文件夹图标。如果未设置，将显示为 rootFolder 定义的图标，用于展开的工作区根文件夹。
rootFolderNames 将根文件夹名称与图标关联。集合的键是文件夹名称。不支持模式或通配符。根文件夹名称匹配不区分大小写。
rootFolderNamesExpanded 将根文件夹名称与展开文件夹的图标关联。集合的键是文件夹名称。不支持模式或通配符。根文件夹名称匹配不区分大小写。
languageIds 将语言与图标关联。集合中的键是在语言贡献点中定义的语言 ID。文件的语言是根据语言贡献中定义的文件扩展名和文件名进行评估的。请注意，不会考虑语言贡献的“第一行匹配”。
fileExtensions 将文件扩展名与图标关联。集合中的键是文件扩展名名称。扩展名是点后的文件名段（不包括点）。具有多个点的文件名（如 lib.d.ts）可以匹配多个扩展名；'d.ts' 和 'ts'。可选地，文件扩展名名称可以以单个父路径段 (*) 为前缀。扩展名比较不区分大小写。
fileNames 将文件名与图标关联。集合中的键是完整文件名，不包括任何路径段。可选地，文件扩展名名称可以以单个父路径段 (*) 为前缀。不支持模式或通配符。文件名匹配不区分大小写。'fileName' 匹配是最强的匹配，与文件名关联的图标将优先于匹配文件扩展名的图标，也优先于匹配语言 ID 的图标。

(*) 一些属性键 (folderNames、folderNamesExpanded、fileExtensions、fileNames) 可以以单个父路径段为前缀。只有当资源的直接父文件夹与父路径文件夹匹配时，才会使用该图标。这可以用于使特定文件夹（例如，system）中的资源具有不同的外观

  "fileNames": {
    "system/win.ini": "_win_ini_file"
  },

system/win.ini 表示该关联匹配直接在 system 文件夹中的名为 win.ini 的文件

  "fileExtensions": {
    "system/ini": "_ini_file"
  },

system/ini 表示该关联匹配直接在 system 文件夹中的名为 *.ini 的文件

文件扩展名匹配优先于语言匹配，但弱于文件名匹配。具有父路径段的匹配优先于没有相同类型段的匹配。

具有父路径的文件名匹配 > 文件名匹配 > 具有父路径的文件扩展名匹配 > 文件扩展名匹配 > 语言匹配 ...

light 和 highContrast 部分具有与上面列出的相同的文件关联属性。它们允许你覆盖相应主题的图标。

字体定义

fonts 部分允许你声明要使用的任意数量的字形字体。你可以在图标定义中引用这些字体。声明的第一个字体将用作默认字体，如果图标定义没有指定字体 id。

将字体文件复制到你的扩展中，并相应地设置路径。建议使用 WOFF 字体。

将 'woff' 设置为格式。
权重属性值定义此处。
样式属性值定义此处。
大小应相对于使用图标的字体大小。因此，始终使用百分比。

{
  "fonts": [
    {
      "id": "turtles-font",
      "src": [
        {
          "path": "./turtles.woff",
          "format": "woff"
        }
      ],
      "weight": "normal",
      "style": "normal",
      "size": "150%"
    }
  ],
  "iconDefinitions": {
    "_file": {
      "fontCharacter": "\\E002",
      "fontColor": "#5f8b3b",
      "fontId": "turtles-font"
    }
  }
}

文件图标主题中的文件夹图标

文件图标主题可以指示文件资源管理器在文件夹图标足够好以指示文件夹的展开状态时，不要显示默认的文件夹图标（旋转三角形或“扭曲”）。通过在文件图标主题定义文件中设置"hidesExplorerArrows":true来启用此模式。

语言默认图标

语言贡献者可以为语言定义一个图标。

{
  "contributes": {
    "languages": [
      {
        "id": "latex",
        // ...
        "icon": {
          "light": "./icons/latex-light.png",
          "dark": "./icons/latex-dark.png"
        }
      }
  ]

如果文件图标主题只有针对该语言的通用文件图标，则使用此图标。

仅当以下条件满足时才会显示语言默认图标：

文件图标主题具有特定文件图标。例如，Minimal没有特定文件图标，因此不使用语言默认图标。
文件图标主题不包含针对给定语言、文件扩展名或文件名的图标。
文件图标主题没有定义"showLanguageModeIcons":false

如果以下条件满足，则始终显示语言默认图标：

文件图标主题确实定义了"showLanguageModeIcons":true

10/29/2024