ImageSmith
Les images là où le code les mentionne : laissez le pointeur sur un chemin et une carte montre l’image, sa taille en pixels et la taille du fichier. Les SVG sont dessinés, toutes les tailles d’un .ico sont là, les GIF animés s’animent — et la même carte remplace l’aperçu dans l’Explorateur de solutions.
Gratuit · Visual Studio 2022 et 2026 · 14 langues d’interface · PNG, JPEG, GIF, BMP, TIFF, ICO, WebP, SVG
Pourquoi ImageSmith
Voir l’image, pas son nom
/Assets/Icons/save.svg en dit peu. ImageSmith montre l’image elle-même, là où le chemin est écrit — en XAML, Razor, CSS, C#, JSON, dans les fichiers projet et les .resx — sans ouvrir le fichier.
SVG et .ico compris
Visual Studio n’affiche rien pour un SVG et une seule taille d’une icône. ImageSmith dessine le SVG, liste toutes les images d’un .ico et anime les GIF.
Les images manquantes se voient
Un chemin vers une image qui n’est ni dans le projet ni sur le disque est souligné d’une ligne ondulée, et une icône d’application sans les tailles dont Windows a besoin reçoit une indication — avant qu’un utilisateur ne voie une image vide ou une icône floue.
Gratuit, sans contrepartie
Ni abonnement, ni version « pro », ni collecte de données, ni messages dans la fenêtre Sortie ou au démarrage. La seule chose que nous vous demanderons — quand vous l’aurez utilisée pendant un certain temps — c’est une note sur le Marketplace. Fonctionne sous Visual Studio 2022 et 2026, x64 et ARM64.
Fonctionnalités
- Une carte au survol d’un chemin : l’image sur un damier, sa taille en pixels, la taille et le format du fichier, la taille à laquelle le code l’affiche (affiché à 20 %) et des actions — Ouvrir, Ouvrir dans l’application par défaut, Afficher dans l’Explorateur de solutions, Copier le chemin.
- La même carte dans l’Explorateur de solutions à la place de l’aperçu intégré, avec Copier l’image.
- Les SVG dessinés, aussi en 16, 24, 32 et 48 px — tels qu’ils apparaîtront sur un bouton.
- Toutes les tailles d’un .ico avec leurs couleurs et leur format ; Enregistrer toutes les tailles en PNG, Enregistrer en PNG pour chaque taille, Copier la taille sélectionnée.
- Les GIF animés s’animent dans la carte, avec le nombre d’images et la durée.
- Les variantes d’échelle côte à côte :
_x2,_x1_25,@2x,.scale-200,.targetsize-24,-480. - Des miniatures devant les chemins, comme des échantillons de couleur.
- Des indications : Image introuvable et Icône sans les tailles habituelles.
- PNG, JPEG, GIF, BMP, TIFF, ICO, WebP et SVG ; un damier, un arrière-plan blanc ou sombre derrière l’image.
La carte dans le code
Laissez le pointeur sur un chemin d’image et la carte s’ouvre dans l’info-bulle Info express de l’éditeur. Elle montre ce que contient le fichier sur le disque, tel que le projet le trouverait : un chemin relatif depuis le dossier du fichier ou le projet, un chemin racine depuis le projet (ou wwwroot), un URI pack depuis le projet de cet assembly.
| Élément | Ce qu’il montre |
|---|---|
| Image | L’image sur un damier (la transparence est visible), les petites images agrandies avec des pixels nets, les grandes ajustées. Trois boutons dans le coin changent l’arrière-plan. |
| Badge de taille | La taille en pixels et, quand la même balise définit Width ou Height, la taille à laquelle le code l’affiche : 1600 × 1000 · affiché à 20 %. Pour un SVG : SVG · ajusté. |
| Informations | Nom du fichier, taille en pixels, taille du fichier, format et résolution (quand elle n’est pas de 96 ppp) ; pour un SVG, la viewBox, le nombre de formes et s’il contient des dégradés ou du texte ; le chemin dans la solution. |
| Actions | Ouvrir (dans Visual Studio), Ouvrir dans l’application par défaut, Afficher dans l’Explorateur de solutions, Copier le chemin. |
Damier, blanc ou sombre
Un logo blanc sur une carte blanche disparaît. Les trois boutons en haut à droite de l’image passent du damier au blanc et au sombre ; le choix reste valable jusqu’à la fermeture de Visual Studio. L’arrière-plan initial de la carte est une option.
Miniatures devant les chemins
Chaque chemin dont le fichier existe reçoit devant lui une toute petite image, de la hauteur de la ligne — comme un échantillon de couleur. Une liste de fichiers d’icônes se lit d’un coup d’œil. Désactivez-les pour un éditeur plus calme.
Explorateur de solutions
Laissez le pointeur sur un fichier image dans l’Explorateur de solutions : la carte ImageSmith s’ouvre à côté, à la place de l’aperçu intégré. Les SVG sont dessinés (l’aperçu intégré n’affiche rien), un .ico montre toutes ses tailles (l’aperçu intégré en montre une) et les variantes d’échelle de l’image sont alignées en dessous.
La carte reste tant que le pointeur est sur l’élément ou sur la carte, pour qu’on puisse cliquer sur ses liens — ici Ouvrir, Ouvrir dans l’application par défaut, Copier le chemin et Copier l’image. Elle se ferme quand le pointeur s’en va, au défilement, à une touche ou à un clic dans l’arborescence.
Les dossiers, les fichiers de code et tout ce qu’ImageSmith n’affiche pas gardent l’info-bulle intégrée. Si une mise à jour de Visual Studio modifie l’Explorateur de solutions au point que l’élément sous le pointeur est introuvable, ImageSmith s’efface.
Icônes (.ico)
Un fichier .ico contient plusieurs images, une par taille. La carte d’un .ico les montre toutes côte à côte sur le damier (les tailles au-delà de 128 px sont affichées en 128) et un tableau avec chaque taille, ses couleurs, si elle est stockée en BMP ou en PNG, et ses octets.
Cliquez sur une taille — dans la bande ou dans le tableau — pour la sélectionner. Copier la taille sélectionnée place cette image dans le Presse-papiers.
Enregistrer en PNG sur une ligne écrit cette taille dans un fichier PNG ; Enregistrer toutes les tailles en PNG… demande un dossier et écrit un PNG par taille (contoso-16.png … contoso-256.png).
SVG
Les fichiers SVG sont dessinés — dans la carte dans le code, dans l’Explorateur de solutions et dans les miniatures — avec SharpVectors. Sous l’image, la carte la montre en 16, 24, 32 et 48 px : telle qu’elle apparaîtra sur un bouton de barre d’outils.
Les informations sont la viewBox (ou largeur × hauteur en l’absence de viewBox), la taille du fichier et le nombre de formes, avec dégradé et texte quand le fichier en contient. Un SVG qui ne peut pas être dessiné montre la ligne de l’erreur à la place d’une image.
Les fichiers externes et les URL référencés par un SVG ne sont jamais chargés.
GIF animé
Un GIF animé s’anime dans la carte, en boucle, et les informations indiquent son nombre d’images et sa durée : GIF · animé, 8 images, 0,8 s. Un GIF d’une seule image reste fixe. WebP, TIFF et BMP s’affichent comme PNG et JPEG.
Variantes d’échelle
Les images existent souvent en plusieurs échelles pour les écrans haute résolution. Quand les fichiers sont côte à côte, la carte les aligne sous l’image, chacune dessinée en proportion avec son échelle et sa taille en pixels (×2 · 64) ; celle qui est affichée est encadrée. Une échelle habituelle qui manque est un emplacement en pointillés.
| Nommage | Exemple | Emplacement en pointillés si absente |
|---|---|---|
| Multiplicateur (WinForms, concepteurs de rapports) | Chart.png, Chart_x2.png, Chart_x1_25.png, Chart_x1.5.png | ×1, ×2 |
| @2x (web, iOS, React Native) | Chart.png, Chart@2x.png | ×1, ×2 |
| scale- (UWP, WinUI, MSIX) | Logo.scale-100.png, Logo.scale-200.png | 100, 200 |
| targetsize- (UWP, WinUI, MSIX) | Square44x44Logo.targetsize-24.png | 16, 24, 32, 48 |
| Suffixe de taille | icon-16.png, icon-32.png, tent-480.jpg, tent-768.jpg | — |
Cliquez sur une variante pour la voir dans la même carte. La rangée figure dans la carte dans le code et dans l’Explorateur de solutions.
Ce qui est reconnu
Un chemin est reconnu à l’extension d’un fichier image, aux endroits où chaque langage nomme des fichiers :
| Où | Exemples |
|---|---|
| XAML (WPF, WinUI, MAUI, Avalonia) | Source="/Assets/logo.png", pack://application:,,,/Contoso;component/Icons/save.svg, /Contoso.Icons;component/…, ms-appx:///Assets/hero.jpg, avares://Contoso.App/Assets/logo.png |
| Razor, Blazor et HTML | <img src="~/images/tent.jpg">, srcset, <link rel="icon">, style="background: url(…)" |
| CSS, SCSS, LESS | url("../images/hero.webp"), url(…) without quotes, image-set(…) |
| C# | "Assets/hero.jpg", @"Assets\splash.png", new Uri("pack://…"), Path.Combine("Assets", "logo.svg") |
| JSON | "icon": "images/icon-192.png" (appsettings.json, manifest.json) |
| Fichiers projet | <ApplicationIcon>, <Resource Include="…">, <Content Include="…">, MAUI and appxmanifest images |
| .resx | Un ResXFileRef vers une image et une simple valeur de chaîne qui est un chemin d’image. |
| Formats | PNG, JPEG, GIF, BMP, TIFF, ICO, WebP, SVG |
Les URI pack vers un autre projet de la solution (/Contoso.Icons;component/Icons/save.svg, avec ou sans version) sont recherchés dans ce projet. ms-appx:/// trouve aussi les fichiers qualifiés d’UWP et de WinUI (Logo.scale-200.png pour Logo.png) ; un logo.png MAUI trouve Resources/Images/logo.svg.
Non affichés, volontairement : les URL et les URI data:, les liaisons et les ressources ({Binding …}, {StaticResource …}), les chaînes interpolées et les chemins construits à partir de variables, les propriétés MSBuild, les caractères génériques, pack://siteoforigin: et les simples noms de fichiers en C# ("logo.png" pourrait être n’importe quoi).
Indications
Deux types d’indications, communs à la famille SmithWorks : chaque texte commence par ImageSmith:, son info-bulle propose Ne plus afficher ce type d’indication et, avec LensSmith, l’indication s’affiche aussi en fin de ligne.
| Indication | Quand | Texte |
|---|---|---|
| Image introuvable | Un chemin vers une image qui n’est ni dans le projet ni sur le disque (une ligne ondulée). Les URL, les chemins avec des variables et les simples noms de fichiers dans le code ne sont pas vérifiés. | ImageSmith: /Assets/banner-old.png is not in the project. |
| Icône sans les tailles habituelles | Un .ico d’application ou de zone de notification sans 16, 32, 48 ou 256 px (points gris) : Windows met une autre taille à l’échelle et le résultat est flou. Les favicons ne sont pas vérifiées. | ImageSmith: tray.ico has no 16 × 16 image — Windows will scale a larger one. |
Chaque type peut être désactivé sous Indications dans l’éditeur dans les paramètres, ou directement depuis l’indication.
Paramètres
Outils › Options › SmithWorks › ImageSmith. Chaque option a une courte description de ce qu’elle fait.
| Option | Par défaut |
|---|---|
| Aperçu au survol | activé |
| Carte dans l’Explorateur de solutions | activé |
| Miniatures devant les chemins | activé |
| Arrière-plan de l’aperçu | Damier |
| Indications : Image introuvable | activé |
| Indications : Icône sans les tailles habituelles | activé |
| Demander une note sur le Marketplace | activé |
Les paramètres sont stockés dans %LocalAppData%\ImageSmith. Rétablir les valeurs par défaut réactive tout.
FAQ
Je laisse le pointeur sur un chemin et rien ne s’ouvre. Pourquoi ?
ImageSmith n’affiche une carte que pour un fichier qu’il trouve sur le disque. Vérifiez que le chemin se termine par une extension d’image et n’est pas construit à partir de variables, d’une liaison ou d’une URL (ceux-ci ne sont jamais affichés). Si le fichier manque, le chemin devrait plutôt porter une ligne ondulée Image introuvable. Les simples noms de fichiers en C# ("logo.png") sont ignorés volontairement — seuls les chemins avec un dossier ou un URI pack y sont lus.
Pourquoi n’y a-t-il rien pour avares://OtherAssembly/… ?
Un URI avares:// ou pack nomme un assembly. Quand cet assembly est un projet de la solution ouverte, ImageSmith cherche dans ce projet. Quand il provient d’un package NuGet ou d’une DLL référencée, l’image y est compilée et n’est pas un fichier sur le disque — il n’y a donc rien à afficher, et ImageSmith ne la signale pas non plus comme manquante.
Mon SVG a un espace de noms incorrect ou absent. Est-il dessiné ?
Oui. Les fichiers enregistrés avec xmlns="http://w3.org" ou sans aucun espace de noms sont courants ; ImageSmith met l’espace de noms SVG juste avant de dessiner, et la carte montre l’image. Les navigateurs peuvent néanmoins refuser un tel fichier, il vaut donc la peine de le corriger.
La carte indique qu’elle ne peut pas dessiner ce SVG. Que faire ?
La carte montre la première ligne de l’erreur (par exemple une erreur XML avec sa ligne et sa colonne). Corrigez le fichier et laissez de nouveau le pointeur sur le chemin — un fichier modifié est relu.
Puis-je garder l’aperçu intégré dans l’Explorateur de solutions ?
Oui — désactivez Carte dans l’Explorateur de solutions dans les paramètres. La carte dans le code reste.
Une grande image ralentit-elle l’éditeur ?
Non. Les images sont décodées sur un thread d’arrière-plan et uniquement à la taille dont la carte a besoin ; les miniatures sont décodées en petit. Les fichiers de plus de 256 Mo (SVG de plus de 8 Mo, ICO de plus de 16 Mo) affichent leurs informations sans image.
ImageSmith envoie-t-il quoi que ce soit quelque part ?
Non. Il lit les fichiers image de votre solution sur votre ordinateur et rien d’autre — aucune télémétrie, aucune requête, et un SVG ne charge jamais rien depuis Internet.
Où signaler un problème ou proposer une fonctionnalité ?
Ouvrez un ticket dans le dépôt Feedback sur GitHub — il y a des formulaires pour les bogues, les idées et les chemins non reconnus (modifiez les noms confidentiels). Vous pouvez aussi utiliser l’onglet Q&A sur le Marketplace.
Historique des versions
1.1.0
- Une nouvelle icône, dessinée dans le style commun de la famille SmithWorks.
1.0.0
- Première version : la carte au survol des chemins d’images en XAML, Razor et HTML, CSS, C#, JSON, dans les fichiers projet et les .resx ; la carte dans l’Explorateur de solutions avec les variantes d’échelle ; les SVG dessinés, toutes les tailles d’un .ico, les GIF animés ; les miniatures devant les chemins ; les indications Image introuvable et Icône sans les tailles habituelles ; une demande de note unique.