A VS Code extension that previews Android Vector Drawable and Compose Multiplatform XML resources as SVG directly inside the editor.
Features
- Live preview for
.xmlAndroid Vector Drawables. - Custom editor — open any compatible XML resource with the "Android/CMP Resource Preview" editor.
- Command — run Preview Android/CMP XML Resource from the editor title or Explorer context menu.
- Real-time updates as you edit the XML.
- Supports
vector,group,path, andclip-pathelements with common attributes.
Limitations
clip-pathelements are converted to SVG<clipPath>definitions, but their document-order application to mixed sibling elements is best-effort because the XML parser groups elements by tag name. Most icons do not use clip-paths.
Supported formats
- Android Vector Drawable (
res/drawable/*.xml) - Compose Multiplatform resources (
composeResources/drawable/*.xml,composeResources/files/*.xml)
Usage
- Open an Android Vector Drawable XML file.
- Click the Open Preview icon in the editor title bar, or right-click the file in the Explorer and choose Preview Android/CMP XML Resource.
Extension settings
| Setting | Default | Description |
|---|---|---|
xmlResourceViewer.backgroundColor |
transparent |
Background color of the preview panel. |
xmlResourceViewer.defaultSize |
256 |
Default preview size in pixels. |
Development
npm install
npm run compile
Press F5 to launch a new VS Code window with the extension loaded.