Search code examples
wpfbindingwpftoolkitcolor-pickerdynamicresource

SelectedColor binding doesn't update from ColorPicker to Model


I have a WPF application where I need to allow to change appearance (backgrounds and foreground mostly). So i bind them to dynamic resources which defined application-wide in App.resources.

I also decided to use a ColorPicker from wpftoolkit (v2.5.0) in my Settings window

setting window with colorPicker

simplified example

App.xaml

<Application x:Class="WpfColors.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <SolidColorBrush x:Key="BgBrush" Color="Gray"/>
    </Application.Resources>
</Application>

MainWindow.xaml with Color picker

<Window x:Class="WpfColors.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <DataGrid Name="grdBrushes" 
                  Background="{DynamicResource ResourceKey=BgBrush}" 
                  AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTextColumn Width="*" Header="Element" Binding="{Binding Path=Name}"/>

                <DataGridTemplateColumn Width="*" Header="Color">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <xctk:ColorPicker SelectedColor="{Binding Path=BrushColor, Mode=TwoWay}"
                                              AvailableColorsHeader="Available" />
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>        
    </Grid>
</Window>

MainWindow.cs

using System.Linq;
using System.Windows;
using System.Windows.Media;

namespace WpfColors
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            var res = Application.Current.Resources;
            grdBrushes.ItemsSource = res.Keys.OfType<string>()
                .Select(resKey => new AppBrush(resKey, ((SolidColorBrush) res[resKey]).Color))
                .ToList();
        }
    }
}

Brush model

using System.ComponentModel;
using System.Windows;
using System.Windows.Media;

namespace WpfColors
{
    public class AppBrush : INotifyPropertyChanged
    {
        public AppBrush(string name, Color color)
        {
            Name = name;
            _brushColor = color;
        }

        public string Name { get; set; }

        private Color? _brushColor;
        public Color? BrushColor
        {
            get { return _brushColor; }
            set 
            {
                // BREAKPOINT
                _brushColor = value;
                if (_brushColor.HasValue)
                    Application.Current.Resources[Name] = new SolidColorBrush(_brushColor.Value);
                if (PropertyChanged != null)
                    PropertyChanged(this, new PropertyChangedEventArgs("BrushColor"));
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;
    }
}

The problem is that BREAKPOINT in AppBrush is not hit when i select color. BrushColor is bound to ColorPicker SelectedColor. If i change BrushColor, ColorPicker is updated.

is it a ColorPicker bug or my? how can I update App brushes immediately after selection changed?


Solution

  • Presumably it refreshes source but either when it looses focus or explicitly. Make use of

    SelectedColor="{Binding Path=BrushColor, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"