DrawingImage with DynamicResource in wpf

479 Views Asked by At

I have multiple DrawingImages in a dictionary. I also have a IconAccentBrush for those Images. I want to change dynamically the color in my drawing images. I have a slider that changes the IconAccentBrush.

I want to reference my DrawingImage with a key.

If I don't reference the DrawingGroup, it colour will change, but if I reference it from another project, it won't.

Can you help ?

Thank you, Olivier

Example that the icon will appear, but the colours won't change:

<Application
    x:Class="App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
....
                <ResourceDictionary Source="pack://application:,,,/ResourcesWpf;component/Dictionaries/ImageDictionary.xaml" />
....
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

----------------------------------------------------------
//this is ImageDictionary.xaml

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<DrawingGroup x:Key="PushPinActiveDrawingGroup"  ClipGeometry="M-19,1 V512.9995 H492 V-19 H1 Z">
            <DrawingGroup.Transform>
                <TranslateTransform X="19" Y="-0.00097703933715820313" />
            </DrawingGroup.Transform>
            <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry1}" />
            <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry2}" />
            <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry3}" />
            <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry4}" />
            <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry5}" />
            <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry6}" />
</DrawingGroup>
</ResourceDictionary>

----------------------------------------------------------

<ToggleButton  Margin="{StaticResource MainThickness}" IsChecked="{Binding IsPinned}">
    <Image>
        <Image.Source>
            <DrawingImage Drawing="{DynamicResource PushPinActiveDrawingGroup}"/>
        </Image.Source>
    </Image>
</ToggleButton>

Example that the icon will appear, but the colours will change:

<ToggleButton Margin="{StaticResource MainThickness}" IsChecked="{Binding IsPinned}">
    <Image>
        <Image.Source>
            <DrawingImage>
                <DrawingImage.Drawing>
                    <DrawingGroup ClipGeometry="M-19,1 V512.9995 H492 V-19 H1 Z">
                        <DrawingGroup.Transform>
                            <TranslateTransform X="19" Y="-0.00097703933715820313" />
                        </DrawingGroup.Transform>
                        <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry1}" />
                        <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry2}" />
                        <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry3}" />
                        <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry4}" />
                        <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry5}" />
                        <GeometryDrawing Brush="{DynamicResource IconAccentBrush}" Geometry="{StaticResource ApplyColorGeometry6}" />
                    </DrawingGroup>
                </DrawingImage.Drawing>
            </DrawingImage>
        </Image.Source>
    </Image>
</ToggleButton>
1

There are 1 best solutions below

0
Olivier La Haye On

I managed to change the color of the icon by changing the source in the image style.

Here is the solution:

<ToggleButton Margin="{StaticResource MainThickness}" IsChecked="{Binding IsPinned}">
    <Image>
        <Image.Style>
            <Style TargetType="{x:Type Image}">
                <Setter Property="Source" Value="{StaticResource PushPinActiveDrawingImage}" />
            </Style>
        </Image.Style>
    </Image>
</ToggleButton>