矩形不更改顏色WPF

Question

我正在嘗試根據我的樹滑塊使矩形更改顏色。 B，R和G。

代碼流：滑塊具有綁定到colorClass巫婆集的g，r和b值（取決於幻燈片）的綁定。

每當這些道具之一發生更改時，它都會調用一個事件來更新resultcolor矩形顏色由resultcolor設置

因此從理論上講，當您拖動滑塊時，矩形應該切換顏色。 但這不是

我得到這個錯誤。

System.Windows.Data Error: 5 : Value produced by BindingExpression is not valid for target property.; Value='#FF0000FF' BindingExpression:Path=Result; DataItem='VM' (HashCode=64479624); target element is 'Rectangle' (Name=''); target property is 'Fill' (type 'Brush')

這是我的XAML：

    <Label VerticalAlignment="Center" HorizontalAlignment="Center" Grid.Row="1" Grid.Column="0" FontSize="24">R</Label>
    <Slider Maximum="255" Name="RSlider" VerticalAlignment="Center" Grid.Row="1" Grid.Column="1" Value="{Binding Path=RedValue, Mode=TwoWay}"></Slider>
    <TextBox PreviewTextInput="NumberValidationTextBox" Grid.Row="1" Grid.Column="2" Height="auto" Text="{Binding Path=RedValue, Mode=TwoWay}"></TextBox>

    <Label VerticalAlignment="Center" HorizontalAlignment="Center" Grid.Row="2" Grid.Column="0" FontSize="24">G</Label>
    <Slider Maximum="255" Name="GSlider" VerticalAlignment="Center" Grid.Row="2" Grid.Column="1" Value="{Binding Path=GreenValue, Mode=TwoWay}"></Slider>
    <TextBox PreviewTextInput="NumberValidationTextBox" Grid.Row="2" Grid.Column="2" Text="{Binding Path=GreenValue, Mode=TwoWay}"></TextBox>

    <Label VerticalAlignment="Center" HorizontalAlignment="Center" Grid.Row="3" Grid.Column="0" FontSize="24">B</Label>
    <Slider Maximum="255" Name="BSlider" VerticalAlignment="Center" Grid.Row="3" Grid.Column="1" Value="{Binding Path=Color.BlueValue, Mode=TwoWay}"></Slider>
    <TextBox PreviewTextInput="NumberValidationTextBox" Grid.Row="3" Grid.Column="2" Text="{Binding Path=Color.BlueValue, Mode=TwoWay}"></TextBox>

    <Rectangle Grid.Column="3" Grid.Row="1" Grid.RowSpan="3" Fill="{Binding Path=Result}"></Rectangle>

我有一個要保存在數據庫中的顏色類。 它具有3個int道具B，G和R。這是此類：

 public class ColorModel : INotifyPropertyChanged
{
    private int _GreenValue;
    private int _RedValue;
    private int _BlueValue;

    public int GreenValue
    {
        get { return _GreenValue; }
        set
        {
            if (_GreenValue != value)
            {
                _GreenValue = value;
                if (PropertyChanged != null)
                {
                    PropertyChanged(this, new PropertyChangedEventArgs("GreenValue"));
                }
            }
        }
    }


    public int RedValue
    {
        get { return _RedValue; }
        set
        {
            if (_RedValue != value)
            {
                _RedValue = value;
                PropertyChanged(this, new PropertyChangedEventArgs("RedValue"));
            }
        }
    }


    public int BlueValue
    {
        get { return _BlueValue; }
        set
        {
            if (_BlueValue != value)
            {
                _BlueValue = value;
                PropertyChanged(this, new PropertyChangedEventArgs("BlueValue"));
            }
        }
    }

    public Color GetColor()
    {
        Color result = new Color();
        result = Color.FromScRgb(1, RedValue, GreenValue, BlueValue);

        return result;
    }

    public event PropertyChangedEventHandler PropertyChanged;
}

GetColor方法只是將3個int屬性轉換為一種顏色。 然后我有一個ViewModel，帶有2個道具1是這個顏色類，一個是顏色（結果顏色），此屬性是我希望矩形從中獲取顏色的屬性。

主要代碼：

        public ColorModel Col;

    public MainWindow()
    {
        InitializeComponent();
        Col = new ColorModel();
        var VM = new VM();
        VM.Color = Col;
        this.DataContext = VM;
    }

如果有幫助，這里是ViewModel。

public class VM : INotifyPropertyChanged
{
    private ColorModel _Color { get; set; }
    public Color Result { get; set; }

    public ColorModel Color
    {
        get { return _Color; }
        set
        {
            _Color = value;
            Result = _Color.GetColor();

            _Color.PropertyChanged += _Color_PropertyChanged;

            if(PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs("Result"));

            }

        }
    }

    private void _Color_PropertyChanged(object sender, PropertyChangedEventArgs e)
    {

        Result = _Color.GetColor();
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs("Result"));

        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
}

我真的很感謝每個答案！ 我是WPF的新手。

Answer 1

Rectangle.Fill是Brush對象，而不是Color 。

您需要添加一個IValueConverter類，該類將在您的ViewModel屬性和SolidColorBrush實例之間進行轉換。

public class ColorToSolidColorBrushConverter: IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        if (value is Color color)
            return new SolidColorBrush(color);

        return DefaultValue;
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        var brush = value as SolidColorBrush;
        return brush?.Color;
    }

    public SolidColorBrush DefaultValue { get; } = Brushes.Fuchsia;
}

用法

<Window ...>
    <Window.Resources>
        <ColorToSolidColorBrushConverter x:Key="ColorToSolidColorBrushConverter" />
    </Window.Resources>

...

<Rectangle Grid.Column="3" Grid.Row="1" Grid.RowSpan="3" Fill="{Binding Path=Result, Converter={StaticResource ColorToSolidColorBrushConverter}"></Rectangle>

Answer 2

Fill屬性的類型是Brush而不是Color 。

您可以像這樣使用SolidColorBrush：

<Rectangle ...>
    <Rectangle.Fill>
        <SolidColorBrush Color="{Binding Result}"/>
    </Rectangle.Fill>
</Rectangle>

---

除此之外，還可以將Result屬性移動到ColorModel類，並以與綁定Slider Values相同的方式綁定到它。 因此，您可以避免視圖模型中復雜的PropertyChanged事件處理。

<SolidColorBrush Color="{Binding Color.Result}"/>

ColorModel看起來像這樣：

public class ColorModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    private void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }

    private int red;
    private int green;
    private int blue;

    public int RedValue
    {
        get { return red; }
        set
        {
            if (red != value)
            {
                red = value;
                OnPropertyChanged(nameof(RedValue));
                OnPropertyChanged(nameof(Result));
            }
        }
    }

    public int GreenValue
    {
        get { return green; }
        set
        {
            if (green != value)
            {
                green = value;
                OnPropertyChanged(nameof(GreenValue));
                OnPropertyChanged(nameof(Result));
            }
        }
    }

    public int BlueValue
    {
        get { return blue; }
        set
        {
            if (blue != value)
            {
                blue = value;
                OnPropertyChanged(nameof(BlueValue));
                OnPropertyChanged(nameof(Result));
            }
        }
    }

    public Color Result
    {
        get
        {
            return Color.FromRgb((byte)red, (byte)green, (byte)blue);
        }
    }
}