I am working on adding light and dark theme support to my WPF application. The plan is to use SVG resources that will be converted to XAML. To avoid managing two separate WPF resources for each theme, I would like to define colors in the SVG-to-XAML output using DynamicResource. This approach will allow me to switch colors dynamically based on the selected theme by defining the color resources in external resource dictionaries.
For example, instead of hardcoding HEX colors in the XAML, I want the SVG-to-XAML conversion to emit something like:
Brush="{DynamicResource MySolidColor}"
Here, MySolidColor will be defined in an external resource dictionary and can be easily switched when the theme changes.
Example:
<svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="Icons/Zoom">
<path id="Vector" d="." fill="var(--Stroke-Dark, #3d484fff)"/>
<path id="Vector_2" d="..." fill="var(--Stroke-Blue, #226ecfff)"/>
<path id="Vector_4" d="..." fill="#E31D43"/>
<path id="Vector_5" d="..." fill="#E31D43"/>
</g>
</svg>
and I hope to achieve something like that - Note this two lines
Brush="{DynamicResource Stroke-Dark}
Brush="{DynamicResource Stroke-Blue}
<DrawingGroup xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:svg="http://sharpvectors.codeplex.com/runtime/">
<DrawingGroup svg:SvgLink.Key="_SvgDrawingLayer">
<DrawingGroup.ClipGeometry>
<RectangleGeometry Rect="0,0,25,25" />
</DrawingGroup.ClipGeometry>
<DrawingGroup svg:SvgObject.Id="Icons/Zoom" svg:SvgObject.UniqueId="89113247-2efe-473b-b056-e77323070651">
<GeometryDrawing Brush="{DynamicResource Stroke-Dark}" svg:SvgObject.Id="Vector" svg:SvgObject.UniqueId="5f7ea98c-42a2-4724-b9c4-4a97a61d3f52">
<GeometryDrawing.Geometry>
<PathGeometry FillRule="Nonzero" Figures="..." />
</GeometryDrawing.Geometry>
</GeometryDrawing>
<GeometryDrawing Brush="{DynamicResource Stroke-Blue}" svg:SvgObject.Id="Vector_2" svg:SvgObject.UniqueId="3036341d-9011-4b95-90bf-e25d0f8297f1">
<GeometryDrawing.Geometry>
<PathGeometry FillRule="Nonzero" Figures="..." />
</GeometryDrawing.Geometry>
</GeometryDrawing>
<GeometryDrawing Brush="#FF226ECF" svg:SvgObject.Id="Vector_3" svg:SvgObject.UniqueId="9ec20e50-0dda-4d38-ab93-af3162877eb9">
<GeometryDrawing.Geometry>
<PathGeometry FillRule="Nonzero" Figures="..." />
</GeometryDrawing.Geometry>
</GeometryDrawing>
<GeometryDrawing Brush="#FFE31D43" svg:SvgObject.Id="Vector_4" svg:SvgObject.UniqueId="152871eb-3204-48e7-8cbf-01674e460d06">
<GeometryDrawing.Geometry>
<PathGeometry FillRule="Nonzero" Figures="M12.4465,8.9286L6.1965,8.9286 6.1965,9.8214 12.4465,9.8214 12.4465,8.9286z" />
</GeometryDrawing.Geometry>
</GeometryDrawing>
<GeometryDrawing Brush="#FFE31D43" svg:SvgObject.Id="Vector_5" svg:SvgObject.UniqueId="98265402-4382-4358-8d50-ec00cb0715e0">
<GeometryDrawing.Geometry>
<PathGeometry FillRule="Nonzero" Figures="..." />
</GeometryDrawing.Geometry>
</GeometryDrawing>
</DrawingGroup>
</DrawingGroup>
</DrawingGroup>I guess this is probably not supported but I am looking for something that will help me to achieve similar solution. Please advice.
I am working on adding light and dark theme support to my WPF application. The plan is to use SVG resources that will be converted to XAML. To avoid managing two separate WPF resources for each theme, I would like to define colors in the SVG-to-XAML output using DynamicResource. This approach will allow me to switch colors dynamically based on the selected theme by defining the color resources in external resource dictionaries.
For example, instead of hardcoding HEX colors in the XAML, I want the SVG-to-XAML conversion to emit something like:
Brush="{DynamicResource MySolidColor}"
Here, MySolidColor will be defined in an external resource dictionary and can be easily switched when the theme changes.
Example:
and I hope to achieve something like that - Note this two lines
I guess this is probably not supported but I am looking for something that will help me to achieve similar solution. Please advice.