ist jetzt verfügbar! Lesen Sie über die neuen Funktionen und Fehlerbehebungen vom November.

Dateisymbol-Schema

Visual Studio Code zeigt in seiner Benutzeroberfläche Icons neben Dateinamen an, und Erweiterungen können neue Sets von Dateisymbolen beisteuern, aus denen Benutzer auswählen können.

Ein neues Datei-Icon-Thema hinzufügen

Sie können Ihr eigenes Datei-Icon-Thema aus Icons (vorzugsweise SVG) und aus Icon-Schriftarten erstellen. Als Beispiel sehen Sie sich die beiden integrierten Themen an: Minimal und Seti.

Erstellen Sie dazu eine VS Code-Erweiterung und fügen Sie den iconTheme-Beitragspunkt hinzu.

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

Die id ist die Kennung für das Icon-Thema. Sie wird als Kennung in den Einstellungen verwendet, machen Sie sie also eindeutig, aber auch lesbar. Das label wird im Dropdown für die Auswahl des Datei-Icon-Themas angezeigt. Der path verweist auf eine Datei in der Erweiterung, die das Icon-Set definiert. Wenn Ihr Icon-Set-Name dem Namensschema *icon-theme.json folgt, erhalten Sie Unterstützung bei der Vervollständigung und Tooltips in VS Code.

Datei-Icon-Set-Datei

Die Datei für das Datei-Icon-Set ist eine JSON-Datei, die aus Icon-Zuordnungen und Icon-Definitionen besteht.

Eine Icon-Zuordnung ordnet einen Dateityp ('file', 'folder', 'json-file'...) einer Icon-Definition zu. Icon-Definitionen legen fest, wo sich das Icon befindet: Dies kann eine Bilddatei oder auch ein Glyphe in einer Schriftart sein.

Icon-Definitionen

Der Abschnitt iconDefinitions enthält alle Definitionen. Jede Definition hat eine ID, die zur Referenzierung der Definition verwendet wird. Eine Definition kann auch von mehr als einer Dateizuordnung referenziert werden.

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

Diese Icon-Definition oben enthält eine Definition mit der Kennung _folder_dark.

Folgende Eigenschaften werden unterstützt

  • iconPath: Bei Verwendung einer SVG/PNG: der Pfad zum Bild.
  • fontCharacter: Bei Verwendung einer Glyphenschrift: das Zeichen in der Schriftart, das verwendet werden soll.
  • fontColor: Bei Verwendung einer Glyphenschrift: die Farbe, die für die Glyphe verwendet werden soll.
  • fontSize: Bei Verwendung einer Schriftart: die Schriftgröße. Standardmäßig wird die in der Schriftartspezifikation angegebene Größe verwendet. Sollte eine relative Größe (z. B. 150 %) zur übergeordneten Schriftgröße sein.
  • fontId: Bei Verwendung einer Schriftart: die ID der Schriftart. Wenn nicht angegeben, wird die erste in der Schriftartspezifikationssektion angegebene Schriftart verwendet.

Dateizuordnung

Icons können Ordnern, Ordnernamen, Dateien, Dateierweiterungen, Dateinamen und Sprach-IDs zugeordnet werden.

Zusätzlich kann jede dieser Zuordnungen für 'light' und 'highContrast' Farbschemata verfeinert werden.

Jede Dateizuordnung verweist auf eine Icon-Definition.

{
  "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 ist das Standard-Dateisymbol, das für alle Dateien angezeigt wird, die keiner Erweiterung, keinem Dateinamen oder keiner Sprach-ID entsprechen. Derzeit werden alle Eigenschaften, die von der Definition des Dateisymbols definiert werden, vererbt (nur relevant für Schriftglyphs, nützlich für die Schriftgröße).
  • folder ist das Ordnersymbol für zusammengeklappte Ordner und, wenn folderExpanded nicht gesetzt ist, auch für erweiterte Ordner. Icons für bestimmte Ordnernamen können über die Eigenschaft folderNames zugeordnet werden. Das Ordnersymbol ist optional. Wenn nicht gesetzt, wird kein Symbol für den Ordner angezeigt.
  • folderExpanded ist das Ordnersymbol für erweiterte Ordner. Das erweiterte Ordnersymbol ist optional. Wenn nicht gesetzt, wird das für folder definierte Symbol angezeigt.
  • folderNames ordnet Ordnernamen Icons zu. Der Schlüssel des Sets ist der Ordnername, optional mit einem einzelnen übergeordneten Pfadsegment (*) präfixiert. Muster oder Wildcards werden nicht unterstützt. Die Ordnernamenerkennung ist nicht case-sensitiv.
  • folderNamesExpanded ordnet Ordnernamen Icons für erweiterte Ordner zu. Der Schlüssel des Sets ist der Ordnername, optional mit einem einzelnen übergeordneten Pfadsegment (*) präfixiert. Muster oder Wildcards werden nicht unterstützt. Die Ordnernamenerkennung ist nicht case-sensitiv.
  • rootFolder ist das Ordnersymbol für zusammengeklappte Stammordner des Arbeitsbereichs und, wenn rootFolderExpanded nicht gesetzt ist, auch für erweiterte Stammordner des Arbeitsbereichs. Wenn nicht gesetzt, wird das für folder definierte Symbol für Stammordner des Arbeitsbereichs angezeigt.
  • rootFolderExpanded ist das Ordnersymbol für erweiterte Stammordner des Arbeitsbereichs. Wenn nicht gesetzt, wird das für rootFolder definierte Symbol für erweiterte Stammordner des Arbeitsbereichs angezeigt.
  • rootFolderNames ordnet Stammordnernamen Icons zu. Der Schlüssel des Sets ist der Ordnername. Muster oder Wildcards werden nicht unterstützt. Die Erkennung von Stammordnernamen ist nicht case-sensitiv.
  • rootFolderNamesExpanded ordnet Stammordnernamen Icons für erweiterte Ordner zu. Der Schlüssel des Sets ist der Ordnername. Muster oder Wildcards werden nicht unterstützt. Die Erkennung von Stammordnernamen ist nicht case-sensitiv.
  • languageIds ordnet Sprachen Icons zu. Der Schlüssel im Set ist die Sprach-ID, wie im Sprach-Beitragspunkt definiert. Die Sprache einer Datei wird anhand der Dateierweiterungen und Dateinamen ermittelt, wie im Sprachbeitrag definiert. Beachten Sie, dass der 'first line match' des Sprachbeitrags nicht berücksichtigt wird.
  • fileExtensions ordnet Dateierweiterungen Icons zu. Der Schlüssel im Set ist der Name der Dateierweiterung. Der Erweiterungsname ist ein Dateiname-Segment nach einem Punkt (ohne den Punkt). Dateinamen mit mehreren Punkten wie lib.d.ts können mehrere Erweiterungen abgleichen; 'd.ts' und 'ts'. Optional kann der Dateierweiterungsname mit einem einzelnen übergeordneten Pfadsegment (*) präfixiert werden. Erweiterungen werden case-insensitiv verglichen.
  • fileNames ordnet Dateinamen Icons zu. Der Schlüssel im Set ist der vollständige Dateiname, ohne Pfadsegmente. Optional kann der Dateierweiterungsname mit einem einzelnen übergeordneten Pfadsegment (*) präfixiert werden. Muster oder Wildcards werden nicht unterstützt. Die Erkennung von Dateinamen ist nicht case-sensitiv. Eine 'fileName'-Übereinstimmung ist die stärkste Übereinstimmung, und das der Dateinamen zugeordnete Icon wird einem Icon einer passenden `fileExtension` und auch einer passenden `language ID` vorgezogen.

(*) Einige Eigenschaftsschlüssel (folderNames, folderNamesExpanded, fileExtensions, fileNames) können mit einem einzelnen übergeordneten Pfadsegment präfixiert werden. Das Icon wird nur verwendet, wenn der direkte übergeordnete Ordner der Ressource mit dem übergeordneten Pfadordner übereinstimmt. Dies kann verwendet werden, um Ressourcen in einem bestimmten Ordner (z. B. system) ein anderes Aussehen zu geben.

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

system/win.ini bedeutet, dass die Zuordnung Dateien namens win.ini direkt in einem Ordner system abgleicht

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

system/ini bedeutet, dass die Zuordnung Dateien namens *.ini direkt in einem Ordner system abgleicht

Eine Übereinstimmung der Dateierweiterung wird einer Sprachübereinstimmung vorgezogen, ist aber schwächer als eine Dateinamensübereinstimmung. Eine Übereinstimmung mit einem übergeordneten Pfadsegment wird einer Übereinstimmung ohne ein solches Segment desselben Typs vorgezogen.

Datei-Namensübereinstimmung mit übergeordnetem Element > Datei-Namensübereinstimmung > Übereinstimmung der Dateierweiterung mit übergeordnetem Element > Übereinstimmung der Dateierweiterung > Spracherkennung ...

Die Abschnitte light und highContrast haben die gleichen Dateizuordnungseigenschaften wie gerade aufgelistet. Sie ermöglichen es, Icons für die entsprechenden Themen zu überschreiben.

Schriftartdefinitionen

Der Abschnitt fonts ermöglicht es Ihnen, beliebig viele Glyphenschriftarten zu deklarieren, die Sie verwenden möchten. Sie können diese Schriftarten später in den Icon-Definitionen referenzieren. Die zuerst deklarierte Schriftart wird als Standard verwendet, wenn eine Icon-Definition keine Schriftart-ID angibt.

Kopieren Sie die Schriftartdatei in Ihre Erweiterung und setzen Sie den Pfad entsprechend. Es wird empfohlen, WOFF-Schriftarten zu verwenden.

  • Setzen Sie 'woff' als Format.
  • Die Werte für die Eigenschaft weight sind hier definiert.
  • Die Werte für die Eigenschaft style sind hier definiert.
  • Die Größe sollte relativ zur Schriftgröße sein, bei der das Icon verwendet wird. Verwenden Sie daher immer Prozentangaben.
{
  "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"
    }
  }
}

Ordner-Icons in Datei-Icon-Themen

Datei-Icon-Themen können den Datei-Explorer anweisen, das Standard-Ordnersymbol (die drehenden Dreiecke oder "Twisties") nicht anzuzeigen, wenn die Ordnersymbole gut genug sind, um den Erweiterungszustand eines Ordners anzuzeigen. Dieser Modus wird aktiviert, indem "hidesExplorerArrows":true in der Definitionsdatei des Datei-Icon-Themas gesetzt wird.

Standard-Icons für Sprachen

Sprachbeitragende können ein Icon für die Sprache definieren.

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

Das Icon wird verwendet, wenn ein Datei-Icon-Thema nur ein generisches Dateisymbol für die Sprache hat.

Standard-Icons für Sprachen werden nur angezeigt, wenn

  • das Datei-Icon-Thema spezifische Dateisymbole hat. Z.B. hat Minimal keine spezifischen Dateisymbole und verwendet daher keine Standard-Sprachsymbole
  • das Datei-Icon-Thema kein Icon für die gegebene Sprache, Dateierweiterung oder den Dateinamen enthält.
  • das Datei-Icon-Thema nicht "showLanguageModeIcons":false definiert.

Standard-Icons für Sprachen werden immer angezeigt, wenn

  • das Datei-Icon-Thema "showLanguageModeIcons":true definiert.
12/10/2025
© . This site is unofficial and not affiliated with Microsoft.