ImageSmith
Obrázky přímo tam, kde je kód zmiňuje: nechte ukazatel na cestě a karta ukáže obrázek, jeho velikost v pixelech a velikost souboru. SVG se vykreslí, všechny velikosti uvnitř .ico jsou k dispozici, animované GIFy se přehrávají — a v Průzkumníku řešení stejná karta nahradí vestavěný náhled.
Zdarma · Visual Studio 2022 a 2026 · 14 jazyků rozhraní · PNG, JPEG, GIF, BMP, TIFF, ICO, WebP, SVG
Proč ImageSmith
Vidíte obrázek, ne jeho název
/Assets/Icons/save.svg toho moc neřekne. ImageSmith ukáže samotný obrázek přímo tam, kde je cesta napsaná — v XAML, Razoru, CSS, C#, JSON, projektových souborech a .resx — bez otevírání souboru.
Včetně SVG a .ico
Visual Studio u SVG neukazuje nic a u ikony jen jednu velikost. ImageSmith vykreslí SVG, vypíše všechny obrázky uvnitř .ico a přehraje animované GIFy.
Chybějící obrázky jsou vidět
Cesta k obrázku, který není v projektu ani na disku, dostane vlnovku a ikona aplikace bez velikostí, které Windows potřebují, dostane nápovědu — dřív, než uživatel uvidí prázdný obrázek nebo rozmazanou ikonu.
Zdarma a bez háčků
Žádné předplatné, žádná verze „pro“, žádný sběr dat a žádné zprávy v okně „Výstup“ ani při spuštění. Jediné, o co kdy požádáme — až ho nějakou dobu budete používat — je hodnocení na Marketplace. Funguje ve Visual Studiu 2022 a 2026, x64 i ARM64.
Funkce
- Karta při najetí na cestu: obrázek na šachovnici, jeho velikost v pixelech, velikost a formát souboru, jak velký ho kód zobrazuje (v kódu 20%) a akce — Otevřít, Otevřít ve výchozí aplikaci, Zobrazit v Průzkumníku řešení, Kopírovat cestu.
- Stejná karta v Průzkumníku řešení místo vestavěného náhledu, s akcí Kopírovat obrázek.
- Vykreslené SVG, také v 16, 24, 32 a 48 px — jak bude vypadat na tlačítku.
- Všechny velikosti .ico s barvami a formátem; Uložit všechny velikosti jako PNG, Uložit jako PNG u každé velikosti, Kopírovat vybranou velikost.
- Animované GIFy se přehrávají v kartě, s počtem snímků a délkou.
- Varianty měřítka vedle sebe:
_x2,_x1_25,@2x,.scale-200,.targetsize-24,-480. - Miniatury před cestami, jako vzorky barev.
- Nápovědy: Obrázek nenalezen a Ikona bez obvyklých velikostí.
- PNG, JPEG, GIF, BMP, TIFF, ICO, WebP a SVG; šachovnice, bílé nebo tmavé pozadí za obrázkem.
Karta v kódu
Nechte ukazatel na cestě k obrázku a karta se otevře v popisku Quick Info editoru. Ukazuje to, co je v souboru na disku, tak jak by ho našel projekt: relativní cestu od složky souboru nebo projektu, kořenovou cestu od projektu (nebo wwwroot), pack URI od projektu daného sestavení.
| Část | Co ukazuje |
|---|---|
| Obrázek | Obrázek na šachovnici (průhlednost je vidět), malé obrázky zvětšené s ostrými pixely, velké přizpůsobené. Tři tlačítka v rohu přepínají pozadí. |
| Štítek velikosti | Velikost v pixelech, a když stejná značka nastavuje Width nebo Height, tak i jak velký ho kód zobrazuje: 1600 × 1000 · v kódu 20%. U SVG: SVG · přizpůsobeno. |
| Údaje | Název souboru, velikost v pixelech, velikost souboru, formát a DPI (když není 96); u SVG viewBox, počet tvarů a zda obsahuje přechody nebo text; cesta v řešení. |
| Akce | Otevřít (ve Visual Studiu), Otevřít ve výchozí aplikaci, Zobrazit v Průzkumníku řešení, Kopírovat cestu. |
Šachovnice, bílé nebo tmavé
Bílé logo na bílé kartě zmizí. Tři tlačítka vpravo nahoře u obrázku přepínají mezi šachovnicí, bílým a tmavým pozadím; volba platí do zavření Visual Studia. Pozadí, se kterým karta začíná, je možnost v nastavení.
Miniatury před cestami
Každá cesta k existujícímu souboru dostane před sebou drobný obrázek vysoký jako řádek — jako vzorek barvy. Seznam souborů ikon se dá přečíst na první pohled. Vypněte je pro klidnější editor.
Průzkumník řešení
Nechte ukazatel na souboru obrázku v Průzkumníku řešení: vedle se otevře karta ImageSmith místo vestavěného náhledu. SVG se vykreslí (vestavěný náhled neukáže nic), .ico ukáže všechny velikosti (vestavěný náhled jednu) a pod obrázkem jsou seřazené jeho varianty měřítka.
Karta zůstává, dokud je ukazatel nad položkou nebo nad kartou, takže lze klikat na její odkazy — zde Otevřít, Otevřít ve výchozí aplikaci, Kopírovat cestu a Kopírovat obrázek. Zavře se po odjetí ukazatelem, posunutí, stisku klávesy nebo kliknutí do stromu.
Složky, soubory kódu a vše, co ImageSmith nezobrazuje, si ponechají vestavěný popisek. Pokud aktualizace Visual Studia změní Průzkumník řešení tak, že položku pod ukazatelem nelze najít, ImageSmith se do ničeho neplete.
Ikony (.ico)
Soubor .ico obsahuje několik obrázků, jeden pro každou velikost. Karta .ico je ukazuje všechny vedle sebe na šachovnici (velikosti nad 128 px jsou zobrazené jako 128) a tabulku s každou velikostí, jejími barvami, zda je uložená jako BMP nebo PNG, a jejími bajty.
Kliknutím na velikost — v pruhu nebo v tabulce — ji vyberete. Kopírovat vybranou velikost vloží tento obrázek do schránky.
Uložit jako PNG v řádku zapíše tuto velikost do souboru PNG; Uložit všechny velikosti jako PNG… se zeptá na složku a zapíše jeden PNG pro každou velikost (contoso-16.png … contoso-256.png).
SVG
Soubory SVG se vykreslují — v kartě v kódu, v Průzkumníku řešení i v miniaturách — pomocí SharpVectors. Pod obrázkem ho karta ukazuje v 16, 24, 32 a 48 px: jak bude vypadat na tlačítku panelu nástrojů.
Údaje jsou viewBox (nebo šířka × výška, když viewBox chybí), velikost souboru a počet tvarů, s přechod a text, když je soubor obsahuje. SVG, které nelze vykreslit, místo obrázku ukáže řádek chyby.
Externí soubory a adresy URL, na které SVG odkazuje, se nikdy nenačítají.
Animovaný GIF
Animovaný GIF se v kartě přehrává dokola a údaje říkají, kolik má snímků a jak dlouho trvá: GIF · animovaný, snímky: 8, 0,8 s. GIF s jedním snímkem zůstává statický. WebP, TIFF a BMP se zobrazují stejně jako PNG a JPEG.
Varianty měřítka
Obrázky často existují v několika měřítkách pro obrazovky s vysokým DPI. Když soubory leží vedle sebe, karta je seřadí pod obrázkem, každý vykreslený v poměru se svým měřítkem a velikostí v pixelech (×2 · 64); zobrazený je orámovaný. Chybějící obvyklé měřítko je přerušovaný slot.
| Pojmenování | Příklad | Přerušovaný slot, když chybí |
|---|---|---|
| Násobitel (WinForms, návrháře sestav) | 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 |
| Přípona velikosti | icon-16.png, icon-32.png, tent-480.jpg, tent-768.jpg | — |
Kliknutím na variantu ji uvidíte ve stejné kartě. Řada je v kartě v kódu i v Průzkumníku řešení.
Co se rozpozná
Cesta se rozpozná podle přípony souboru obrázku, na místech, kde daný jazyk uvádí soubory:
| Kde | Příklady |
|---|---|
| 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 a 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) |
| Projektové soubory | <ApplicationIcon>, <Resource Include="…">, <Content Include="…">, MAUI and appxmanifest images |
| .resx | ResXFileRef na obrázek a obyčejná řetězcová hodnota, která je cestou k obrázku. |
| Formáty | PNG, JPEG, GIF, BMP, TIFF, ICO, WebP, SVG |
Pack URI na jiný projekt řešení (/Contoso.Icons;component/Icons/save.svg, s verzí i bez ní) se hledají v tomto projektu. ms-appx:/// najde i kvalifikované soubory UWP a WinUI (Logo.scale-200.png pro Logo.png); logo.png v MAUI najde Resources/Images/logo.svg.
Záměrně se nezobrazují: adresy URL a URI data:, vazby a prostředky ({Binding …}, {StaticResource …}), interpolované řetězce a cesty složené z proměnných, vlastnosti MSBuild, zástupné znaky, pack://siteoforigin: a samotné názvy souborů v C# ("logo.png" může být cokoli).
Nápovědy
Dva druhy nápověd, společné s rodinou SmithWorks: každý text začíná ImageSmith:, jeho popisek obsahuje Tento druh nápovědy nezobrazovat a s LensSmith se nápověda ukazuje i na konci řádku.
| Nápověda | Kdy | Text |
|---|---|---|
| Obrázek nenalezen | Cesta k obrázku, který není v projektu ani na disku (vlnovka). Adresy URL, cesty s proměnnými a samotné názvy souborů v kódu se nekontrolují. | ImageSmith: /Assets/banner-old.png is not in the project. |
| Ikona bez obvyklých velikostí | Soubor .ico aplikace nebo oznamovací oblasti bez 16, 32, 48 nebo 256 px (šedé tečky): Windows přeškáluje jinou velikost a ta vypadá rozmazaně. Favikony se nekontrolují. | ImageSmith: tray.ico has no 16 × 16 image — Windows will scale a larger one. |
Každý druh lze vypnout v části Nápovědy v editoru v nastavení nebo přímo z nápovědy.
Nastavení
Nástroje › Možnosti › SmithWorks › ImageSmith. Každá možnost má krátký popis toho, co dělá.
| Možnost | Výchozí |
|---|---|
| Náhled při najetí myší | Zapnuto |
| Karta v Průzkumníku řešení | Zapnuto |
| Miniatury před cestami | Zapnuto |
| Pozadí náhledu | Šachovnice |
| Nápovědy: Obrázek nenalezen | Zapnuto |
| Nápovědy: Ikona bez obvyklých velikostí | Zapnuto |
| Požádat o hodnocení na Marketplace | Zapnuto |
Nastavení se ukládá do %LocalAppData%\ImageSmith. Obnovit výchozí vše znovu zapne.
Časté dotazy
Nechám ukazatel na cestě a nic se neotevře. Proč?
ImageSmith ukáže kartu jen pro soubor, který najde na disku. Zkontrolujte, že cesta končí příponou obrázku a není složená z proměnných, vazby nebo adresy URL (ty se nikdy nezobrazují). Pokud soubor chybí, cesta by místo toho měla mít vlnovku Obrázek nenalezen. Samotné názvy souborů v C# ("logo.png") se záměrně přeskakují — čtou se tam jen cesty se složkou nebo pack URI.
Proč u avares://OtherAssembly/… nic není?
URI avares:// nebo pack URI určuje sestavení. Když je toto sestavení projektem otevřeného řešení, ImageSmith hledá v tomto projektu. Když pochází z balíčku NuGet nebo odkazované knihovny DLL, obrázek je do něj zkompilovaný a není souborem na disku — takže není co ukázat a ImageSmith ho ani nehlásí jako chybějící.
Moje SVG má špatný obor názvů nebo žádný. Vykreslí se?
Ano. Soubory uložené s xmlns="http://w3.org" nebo úplně bez oboru názvů jsou běžné; ImageSmith doplní obor názvů SVG těsně před vykreslením, takže karta obrázek ukáže. Prohlížeče ale takový soubor mohou odmítnout, proto stojí za to ho opravit.
Karta píše, že toto SVG nelze vykreslit. Co teď?
Karta ukazuje první řádek chyby (například chybu XML s řádkem a sloupcem). Opravte soubor a znovu nechte ukazatel na cestě — změněný soubor se načte znovu.
Můžu si v Průzkumníku řešení ponechat vestavěný náhled?
Ano — vypněte v nastavení Karta v Průzkumníku řešení. Karta v kódu zůstane.
Zpomaluje velký obrázek editor?
Ne. Obrázky se dekódují ve vlákně na pozadí a jen ve velikosti, kterou karta potřebuje; miniatury se dekódují malé. Soubory nad 256 MB (SVG nad 8 MB, ICO nad 16 MB) ukazují údaje bez obrázku.
Posílá ImageSmith něco někam?
Ne. Čte soubory obrázků vašeho řešení ve vašem počítači a nic jiného — žádná telemetrie, žádné požadavky a SVG nikdy nic nenačítá z internetu.
Kde nahlásit problém nebo navrhnout funkci?
Založte issue v repozitáři Feedback na GitHubu — jsou tam formuláře pro chyby, nápady a cesty, které se nerozpoznají (prosím změňte soukromé názvy). Můžete také použít kartu Q&A na Marketplace.
Historie změn
1.1.0
- Nová ikona, nakreslená v jednotném stylu rodiny SmithWorks.
1.0.0
- První vydání: karta při najetí na cesty k obrázkům v XAML, Razoru a HTML, CSS, C#, JSON, projektových souborech a .resx; karta v Průzkumníku řešení s variantami měřítka; vykreslené SVG, všechny velikosti .ico, animované GIFy; miniatury před cestami; nápovědy Obrázek nenalezen a Ikona bez obvyklých velikostí; jednorázová žádost o hodnocení.