首页 > 解决方案 > 为什么 Rectangle.Fill 多重绑定不起作用?

问题描述

我想创建一个简单的 WPF 应用程序,您可以在其中设置RGB颜色(通过 3 个滑块 - 每个通道一个)和结果颜色以填充Rectangle.

可以肯定的是,仅使用 XAML 就可以做到这一点,并且因为我想提供Rectangle.Fill来自三个不同的值,所以我使用 anIMultiValueConverter进行绑定。

        public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
        {
            return new SolidColorBrush(ExtractColorFrom(values));
        }

        private Color ExtractColorFrom(object[] values)
        {
            byte red = System.Convert.ToByte((double)values[0]);
            byte green = System.Convert.ToByte((double)values[1]);
            byte blue = System.Convert.ToByte((double)values[2]);
            Color color = new Color();
            color.R = red;
            color.G = green;
            color.B = blue;
            return color;
        }

虽然绑定不起作用Rectangle.Fill。XAML 有问题吗?

<Window ...>

    <Window.Resources>
        <view_model:RgbToBrushConverter x:Key='rgb_converter'/>
    </Window.Resources>

    <StackPanel>

        <Rectangle Width='300'
                   Height='190'
                   Stroke='Black'
                   StrokeThickness='1'
                   Margin='0 0 0 10'>
            <Rectangle.Fill>
                <MultiBinding Converter='{StaticResource rgb_converter}'>
                    <Binding ElementName='slider_red' Path='Value' Mode='OneWay'/>
                    <Binding ElementName='slider_green' Path='Value' Mode='OneWay'/>
                    <Binding ElementName='slider_blue' Path='Value' Mode='OneWay'/>
                </MultiBinding>
            </Rectangle.Fill>
        </Rectangle>

        <TextBlock HorizontalAlignment='Center'
                   Margin='5'
                   FontSize='20'>
            Per channel: 
            <Run Text='R'
                 Foreground='Red' />
            <Run Text='{Binding ElementName=slider_red, Path=Value}' />
            <Run Text='R'
                 Foreground='Green' />
            <Run Text='{Binding ElementName=slider_green, Path=Value}' />
            <Run Text='R'
                 Foreground='Blue' />
            <Run Text='{Binding ElementName=slider_blue, Path=Value}' />
        </TextBlock>

        <Slider x:Name='slider_red'
                Minimum='0'
                Maximum='255'
                Background='Red'
                Width='255'
                Margin='4'
                IsSnapToTickEnabled="True"
                TickFrequency="1" />

        <Slider x:Name='slider_green'
                Minimum='0'
                Maximum='255'
                Background='Green'
                Width='255'
                Margin='4'
                IsSnapToTickEnabled="True"
                TickFrequency="1" />

        <Slider x:Name='slider_blue'
                Minimum='0'
                Maximum='255'
                Background='Blue'
                Width='255'
                Margin='4'
                IsSnapToTickEnabled="True"
                TickFrequency="1" />
    </StackPanel>
</Window>

标签: c#wpfdata-binding

解决方案


验证您的 IMultiValueConverter 实现。

您可以使用 Color.FromRgb(red, green, blue);

为我工作!

public class RgbToBrushConverter : IMultiValueConverter
{
    public RgbToBrushConverter()
    {

    }

    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
    {
        var x = ExtractColorFrom(values);
        return new SolidColorBrush(x);
    }

    private Color ExtractColorFrom(object[] values)
    {
        byte red = System.Convert.ToByte((double)values[0]);
        byte green = System.Convert.ToByte((double)values[1]);
        byte blue = System.Convert.ToByte((double)values[2]);
        return Color.FromRgb(red, green, blue);
    }

    ///MUST!!!!!
    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

在此处输入图像描述

并检查 Text='R' x 3 ?文本='G','B'?


推荐阅读