ImageSmith
Изображения прямо там, где их упоминает код: задержите указатель на пути — и карточка покажет изображение, его размер в пикселях и размер файла. SVG рисуется, все размеры внутри .ico на месте, анимированные GIF проигрываются — а в Обозревателе решений та же карточка заменяет встроенный предпросмотр.
Бесплатно · Visual Studio 2022 и 2026 · 14 языков интерфейса · PNG, JPEG, GIF, BMP, TIFF, ICO, WebP, SVG
Зачем ImageSmith
Видно изображение, а не его имя
/Assets/Icons/save.svg говорит немного. ImageSmith показывает само изображение прямо там, где записан путь, — в XAML, Razor, CSS, C#, JSON, файлах проектов и .resx — не открывая файл.
SVG и .ico тоже
Для SVG Visual Studio не показывает ничего, а у значка — только один размер. ImageSmith рисует SVG, перечисляет все изображения внутри .ico и проигрывает анимированные GIF.
Отсутствующие изображения заметны
Путь к изображению, которого нет ни в проекте, ни на диске, подчёркивается волнистой линией, а значок приложения без нужных Windows размеров получает подсказку — раньше, чем пользователь увидит пустое место или размытый значок.
Бесплатно и без подвохов
Без подписок, без «pro»-версии, без сбора данных и без сообщений в окне «Вывод» или при запуске. Единственное, о чём мы когда-нибудь попросим, — после того как вы им немного попользуетесь, — поставить оценку в Marketplace. Работает в Visual Studio 2022 и 2026, x64 и ARM64.
Возможности
- Карточка при наведении на путь: изображение на шахматной доске, его размер в пикселях, размер и формат файла, насколько крупно его показывает код (в коде 20%) и действия — Открыть, Открыть в приложении по умолчанию, Показать в Обозревателе решений, Копировать путь.
- Та же карточка в Обозревателе решений вместо встроенного предпросмотра, с действием Копировать изображение.
- SVG рисуется, в том числе в 16, 24, 32 и 48 px — так, как он будет выглядеть на кнопке.
- Все размеры .ico с цветами и форматом; Сохранить все размеры в PNG, Сохранить как PNG для каждого размера, Копировать выбранный размер.
- Анимированные GIF проигрываются в карточке, с числом кадров и длительностью.
- Варианты масштаба рядом:
_x2,_x1_25,@2x,.scale-200,.targetsize-24,-480. - Миниатюры перед путями, как образцы цвета.
- Подсказки: Изображение не найдено и Значок без обычных размеров.
- PNG, JPEG, GIF, BMP, TIFF, ICO, WebP и SVG; шахматный, белый или тёмный фон за изображением.
Карточка в коде
Задержите указатель на пути к изображению — карточка откроется во всплывающей подсказке Quick Info редактора. Она показывает то, что лежит в файле на диске, так, как его нашёл бы проект: относительный путь — от папки файла или проекта, корневой путь — от проекта (или wwwroot), pack URI — от проекта этой сборки.
| Часть | Что показывает |
|---|---|
| Изображение | Изображение на шахматной доске (прозрачность видна), маленькие изображения увеличены с чёткими пикселями, большие вписаны. Три кнопки в углу переключают фон. |
| Метка размера | Размер в пикселях, а если тот же тег задаёт Width или Height — насколько крупно его показывает код: 1600 × 1000 · в коде 20%. Для SVG: SVG · по размеру. |
| Сведения | Имя файла, размер в пикселях, размер файла, формат и DPI (если не 96); для SVG — viewBox, число фигур и есть ли градиенты или текст; путь в решении. |
| Действия | Открыть (в Visual Studio), Открыть в приложении по умолчанию, Показать в Обозревателе решений, Копировать путь. |
Шахматный, белый или тёмный фон
Белый логотип на белой карточке исчезает. Три кнопки справа вверху изображения переключают шахматную доску, белый и тёмный фон; выбор действует до закрытия Visual Studio. Фон, с которого начинается карточка, задаётся в параметрах.
Миниатюры перед путями
Перед каждым путём к существующему файлу появляется крошечное изображение высотой в строку — как образец цвета. Список файлов значков читается с одного взгляда. Выключите их для более спокойного редактора.
Обозреватель решений
Задержите указатель на файле изображения в Обозревателе решений: рядом откроется карточка ImageSmith вместо встроенного предпросмотра. SVG рисуется (встроенный предпросмотр ничего не показывает), у .ico видны все размеры (встроенный показывает один), а под изображением выстроены его варианты масштаба.
Карточка не закрывается, пока указатель над элементом или над ней самой, так что по её ссылкам можно щёлкнуть — здесь это Открыть, Открыть в приложении по умолчанию, Копировать путь и Копировать изображение. Она закрывается, если увести указатель, прокрутить, нажать клавишу или щёлкнуть в дереве.
Папки, файлы кода и всё, что ImageSmith не показывает, сохраняют встроенную подсказку. Если обновление Visual Studio изменит Обозреватель решений так, что элемент под указателем найти не удастся, ImageSmith просто не будет вмешиваться.
Значки (.ico)
Файл .ico содержит несколько изображений, по одному на размер. Карточка .ico показывает их все рядом на шахматной доске (размеры больше 128 px показаны как 128) и таблицу: каждый размер, его цвета, хранится ли он как BMP или PNG, и его байты.
Щёлкните размер — в полосе или в таблице, — чтобы выбрать его. Копировать выбранный размер помещает это изображение в буфер обмена.
Сохранить как PNG в строке записывает этот размер в файл PNG; Сохранить все размеры в PNG… спрашивает папку и записывает по одному PNG на размер (contoso-16.png … contoso-256.png).
SVG
Файлы SVG рисуются — в карточке в коде, в Обозревателе решений и в миниатюрах — с помощью SharpVectors. Под изображением карточка показывает его в 16, 24, 32 и 48 px: так, как оно будет выглядеть на кнопке панели инструментов.
Сведения — это viewBox (или ширина × высота, если viewBox нет), размер файла и число фигур, а также градиент и текст, если они есть в файле. SVG, который не удаётся нарисовать, вместо изображения показывает строку ошибки.
Внешние файлы и URL, на которые ссылается SVG, никогда не загружаются.
Анимированный GIF
Анимированный GIF проигрывается в карточке по кругу, а сведения говорят, сколько в нём кадров и сколько он длится: GIF · анимация, кадров: 8, 0,8 с. GIF из одного кадра остаётся неподвижным. WebP, TIFF и BMP показываются так же, как PNG и JPEG.
Варианты масштаба
Изображения часто бывают в нескольких масштабах для экранов с высоким DPI. Если файлы лежат рядом, карточка выстраивает их под изображением, каждый в пропорции со своим масштабом и размером в пикселях (×2 · 64); показанный обведён. Отсутствующий обычный масштаб — пунктирная ячейка.
| Именование | Пример | Пунктирная ячейка, если нет |
|---|---|---|
| Множитель (WinForms, конструкторы отчётов) | Chart.png, Chart_x2.png, Chart_x1_25.png, Chart_x1.5.png | ×1, ×2 |
| @2x (веб, 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 |
| Суффикс размера | icon-16.png, icon-32.png, tent-480.jpg, tent-768.jpg | — |
Щёлкните вариант, чтобы увидеть его в той же карточке. Этот ряд есть и в карточке в коде, и в Обозревателе решений.
Что распознаётся
Путь распознаётся по расширению файла изображения — в тех местах, где каждый язык указывает файлы:
| Где | Примеры |
|---|---|
| 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 и 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) |
| Файлы проектов | <ApplicationIcon>, <Resource Include="…">, <Content Include="…">, MAUI and appxmanifest images |
| .resx | ResXFileRef на изображение и обычное строковое значение, которое является путём к изображению. |
| Форматы | PNG, JPEG, GIF, BMP, TIFF, ICO, WebP, SVG |
Pack URI на другой проект решения (/Contoso.Icons;component/Icons/save.svg, с версией или без) ищутся в этом проекте. ms-appx:/// находит и квалифицированные файлы UWP и WinUI (Logo.scale-200.png для Logo.png); logo.png в MAUI находит Resources/Images/logo.svg.
Намеренно не показываются: URL и URI data:, привязки и ресурсы ({Binding …}, {StaticResource …}), интерполированные строки и пути, собранные из переменных, свойства MSBuild, подстановочные знаки, pack://siteoforigin: и имена файлов без папки в C# ("logo.png" может быть чем угодно).
Подсказки
Два вида подсказок, общих с семейством SmithWorks: каждый текст начинается с ImageSmith:, во всплывающей подсказке есть Не показывать такие подсказки, а с LensSmith подсказка видна ещё и в конце строки.
| Подсказка | Когда | Текст |
|---|---|---|
| Изображение не найдено | Путь к изображению, которого нет ни в проекте, ни на диске (волнистая линия). URL, пути с переменными и имена файлов без папки в коде не проверяются. | ImageSmith: /Assets/banner-old.png is not in the project. |
| Значок без обычных размеров | Значок .ico приложения или области уведомлений без 16, 32, 48 или 256 px (серые точки): Windows масштабирует другой размер, и он выглядит размыто. Значки favicon не проверяются. | ImageSmith: tray.ico has no 16 × 16 image — Windows will scale a larger one. |
Каждый вид можно выключить в разделе Подсказки в редакторе в настройках или прямо из подсказки.
Настройки
Средства › Параметры › SmithWorks › ImageSmith. У каждого параметра есть краткое описание того, что он делает.
| Параметр | По умолчанию |
|---|---|
| Предпросмотр при наведении | Вкл. |
| Карточка в Обозревателе решений | Вкл. |
| Миниатюры перед путями | Вкл. |
| Фон предпросмотра | Шахматная доска |
| Подсказки: Изображение не найдено | Вкл. |
| Подсказки: Значок без обычных размеров | Вкл. |
| Попросить оценку в Marketplace | Вкл. |
Настройки хранятся в %LocalAppData%\ImageSmith. Сбросить по умолчанию снова включает всё.
Вопросы и ответы
Я задерживаю указатель на пути, и ничего не открывается. Почему?
ImageSmith показывает карточку только для файла, который находит на диске. Проверьте, что путь заканчивается расширением изображения и не собран из переменных, привязки или URL (такие не показываются никогда). Если файла нет, путь вместо этого должен быть подчёркнут подсказкой Изображение не найдено. Имена файлов без папки в C# ("logo.png") пропускаются намеренно — там читаются только пути с папкой или pack URI.
Почему для avares://OtherAssembly/… ничего нет?
URI avares:// или pack URI указывает сборку. Если эта сборка — проект открытого решения, ImageSmith ищет в этом проекте. Если она из пакета NuGet или подключённой DLL, изображение скомпилировано в неё и не является файлом на диске — показывать нечего, и ImageSmith не сообщает о нём как об отсутствующем.
В моём SVG неправильное пространство имён или его нет. Он рисуется?
Да. Файлы с xmlns="http://w3.org" или вовсе без пространства имён встречаются часто; ImageSmith подставляет пространство имён SVG прямо перед рисованием, так что карточка показывает изображение. Браузеры такой файл могут не принять, так что исправить его стоит.
Карточка пишет, что не может нарисовать этот SVG. Что делать?
Карточка показывает первую строку ошибки (например, ошибку XML со строкой и столбцом). Исправьте файл и снова задержите указатель на пути — изменённый файл читается заново.
Можно оставить встроенный предпросмотр в Обозревателе решений?
Да — выключите Карточка в Обозревателе решений в настройках. Карточка в коде останется.
Большое изображение замедляет редактор?
Нет. Изображения декодируются в фоновом потоке и только в том размере, который нужен карточке; миниатюры декодируются маленькими. Файлы больше 256 МБ (SVG больше 8 МБ, ICO больше 16 МБ) показывают сведения без изображения.
ImageSmith что-нибудь куда-нибудь отправляет?
Нет. Он читает файлы изображений вашего решения на вашем компьютере, и больше ничего — ни телеметрии, ни запросов, а SVG никогда ничего не загружает из интернета.
Где сообщить о проблеме или предложить функцию?
Создайте issue в репозитории Feedback на GitHub — там есть формы для ошибок, идей и нераспознанных путей (пожалуйста, замените закрытые имена). Можно также воспользоваться вкладкой Q&A на Marketplace.
История изменений
1.1.0
- Новая иконка, нарисованная в едином стиле семейства SmithWorks.
1.0.0
- Первый выпуск: карточка при наведении на пути к изображениям в XAML, Razor и HTML, CSS, C#, JSON, файлах проектов и .resx; карточка в Обозревателе решений с вариантами масштаба; SVG рисуется, все размеры .ico, анимированные GIF; миниатюры перед путями; подсказки «Изображение не найдено» и «Значок без обычных размеров»; однократная просьба об оценке.