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
Visual Studio 對 SVG 什麼都不顯示，圖示也只顯示一個尺寸。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；圖片背後可用棋盤格、白色或深色背景。
程式碼中的卡片
將指標暫留在圖片路徑上，卡片會在編輯器的快速諮詢工具提示中開啟。它依專案尋找檔案的方式顯示磁碟上檔案的內容：相對於檔案所在資料夾或專案的相對路徑、相對於專案 (或 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 會顯示錯誤所在行，而不是圖片。
絕不載入 SVG 參照的外部檔案和 URL。
動畫 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 (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 |
| 尺寸後置詞 | 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.png 對應 Logo.scale-200.png)；MAUI 的 logo.png 能找到 Resources/Images/logo.svg。
刻意不顯示：URL 和 data: URI、繫結和資源 ({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") 會被刻意略過——在 C# 中只讀取帶資料夾的路徑或 pack URI。
為什麼 avares://OtherAssembly/… 沒有任何顯示？
avares:// 或 pack URI 指定的是組件。如果該組件是已開啟方案中的專案，ImageSmith 會在該專案中尋找。如果它來自 NuGet 套件或參考的 DLL，圖片已編譯到其中，並不是磁碟上的檔案——因此沒有可顯示的內容，ImageSmith 也不會回報其缺少。
我的 SVG 命名空間錯誤或缺少。還能繪製嗎？
能。以 xmlns="http://w3.org" 儲存或沒有任何命名空間的檔案很常見；ImageSmith 會在繪製前補上 SVG 命名空間，因此卡片能顯示圖片。瀏覽器仍可能拒絕這樣的檔案，所以最好修正它。
卡片顯示無法繪製此 SVG。怎麼辦？
卡片會顯示錯誤的第一行 (例如帶有行號和欄號的 XML 錯誤)。修正檔案後再次將指標暫留在路徑上——已變更的檔案會被重新讀取。
能保留方案總管中的內建預覽嗎？
能——在設定中關閉 方案總管中的卡片。程式碼中的卡片保持不變。
大圖片會拖慢編輯器嗎？
不會。圖片在背景執行緒上解碼，而且只解碼到卡片所需的尺寸；縮圖以小尺寸解碼。超過 256 MB 的檔案 (SVG 超過 8 MB，ICO 超過 16 MB) 只顯示資訊，不顯示圖片。
ImageSmith 會向任何地方傳送資料嗎？
不會。它只在您的電腦上讀取方案中的圖片檔案，別無其他——沒有遙測，沒有網路要求，SVG 也絕不會從網際網路載入任何內容。
在哪裡回報問題或建議新功能？
請在 GitHub 上的 Feedback 存放庫中建立 issue——那裡有用於回報錯誤、提出建議和回報無法辨識之路徑的表單（如有私密名稱，請先替換）。也可以使用 Marketplace 上的 Q&A 索引標籤。
變更記錄
1.1.0
- 新圖示，採用 SmithWorks 系列統一的風格繪製。
1.0.0
- 首個版本：在 XAML、Razor 和 HTML、CSS、C#、JSON、專案檔和 .resx 中暫留在圖片路徑上時顯示卡片；方案總管中帶縮放變體的卡片；繪製 SVG、.ico 的所有尺寸、動畫 GIF；路徑前的縮圖；「找不到圖片」和「缺少常用尺寸的圖示」提示；僅一次的評分請求。