vscode material icon theme Télécharger - vscode material icon theme Téléchargement du code source

vscode material icon theme

Autre code source

v5.14.1

Télécharger

Dossier .vscode/extensions.

Dans notre exemple, nous les plaçons dans un dossier icons à l'intérieur du dossier .vscode/extensions :

 .vscode
 ┗ extensions
   ┗ icons
     ┣ folder-sample.svg
     ┗ folder-sample-open.svg

Dans le fichier settings.json (Paramètres utilisateur uniquement !), les icônes de dossier peuvent être associées à un nom de dossier (par exemple "src") comme ceci :

 "material-icon-theme.folders.associations" : {
    "src" : " ../../../../icons/folder-sample "
}

Clones d'icônes de dossiers personnalisés

Il est également possible de cloner des icônes de dossiers existants et de modifier leurs couleurs pour créer de nouvelles icônes pouvant être associées aux noms de dossiers. L'exemple suivant montre comment cloner l'icône du dossier admin :

 "material-icon-theme.folders.customClones" : [
  {
    "name" : " users-admin " ,
    "base" : " admin " ,
    "color" : " light-green-500 " ,
    "lightColor" : " light-green-700 " ,
    "folderNames" : [ " users " ]
  },
  {
    "name" : " roles-admin " ,
    "base" : " admin " ,
    "color" : " purple-400 " ,
    "folderNames" : [ " roles " ]
  }
]

Cela créera deux nouvelles icônes appelées users-admin et roles-admin qui sont associées respectivement aux noms de dossier users et roles . La propriété base définit l'icône qui doit être clonée (dans ce cas, l'icône du dossier admin ). La propriété color définit la couleur de la nouvelle icône. La propriété lightColor est facultative et définit la couleur de l'icône lorsque Visual Studio Code est exécuté avec un thème de couleur claire. La propriété folderNames définit les noms de dossiers qui doivent être associés à la nouvelle icône.

Bien que vous puissiez utiliser n'importe quelle couleur #RRGGBB pour les propriétés color et lightColor , si vous souhaitez vous en tenir aux couleurs de la palette de matériaux, vous pouvez consulter la liste complète des alias autorisés ici.
Vous pouvez consulter la liste complète des icônes disponibles à utiliser comme base ici.

Associations linguistiques

Avec la configuration suivante, vous pouvez personnaliser les icônes de langue. Il est également possible d'écraser les associations existantes.

 "material-icon-theme.languages.associations" : {
    "languageId" : " iconName " ,
    "json" : " json "
}

Vous pouvez voir les noms d'icônes disponibles dans l'aperçu ci-dessus. Voir « Identificateurs de langue connus » dans la documentation VS Code pour obtenir la liste des valeurs autorisées pour languageId .

Commandes

Appuyez sur Ctrl-Shift-P pour ouvrir la palette de commandes et tapez Material Icons .

Commande	Description
Activer le thème d'icônes	Activez le thème des icônes.
Changer la couleur du fichier	Changez la couleur des icônes de fichiers.
Changer la couleur du dossier	Changez la couleur des icônes des dossiers.
Changer le thème du dossier	Modifiez la conception des icônes des dossiers.
Changer l'opacité	Changez l'opacité des icônes.
Changer la saturation	Modifiez la valeur de saturation des icônes.
Configurer les packs d'icônes	Sélectionne un pack d'icônes qui active des icônes supplémentaires (par exemple pour Angular, React, Ngrx).
Basculer les flèches de l'explorateur	Afficher ou masquer les flèches à côté des icônes de dossier.
Restaurer la configuration par défaut	Réinitialiser à la configuration par défaut.
Basculer les niveaux de gris	Réglez la saturation de l'icône sur `0` (échelle de gris) ou `1` (couleur).