How do I bind ARGB values to a rectangle fill property in a combo box item? - wpf

Question

I have a combobox of custom objects each of which is displayed as a colored rectangle and beside it a text.
I have the ARGB values I want to display from the object, but I want to convert that to a color and set it to the fill property of the rectangle. So far I have the following based on this post
Binding R G B properties of color in wpf
How do you specify which propertied in SubCategory to pass to the value converter? And how to set the result of the converter to the Fill property of the rectangle?
//XAML
<Controls:MetroWindow.Resources>
<local:ArgbConverter x:Key="argbConverter"></local:ArgbConverter>
</Controls:MetroWindow.Resources>
<ComboBox ItemsSource="{Binding Path=SubCategories}" HorizontalAlignment="Stretch" SelectedItem="{Binding Path=SelectedSubCategory, Mode=TwoWay}" IsEditable="False" TextBoxBase.TextChanged="SubCategory_ComboBox_TextChanged">
<ComboBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Rectangle Fill="Aqua" Width="16" Height="16" Margin="0,2,5,2" ></Rectangle>
<TextBlock Text="{Binding Path=name, Mode=TwoWay}" />
</StackPanel>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
//Value Converter
public class ArgbConverter : IMultiValueConverter
{
#region IMultiValueConverter Members
public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
var a = System.Convert.ToByte(values[0]);
var r = System.Convert.ToByte(values[1]);
var g = System.Convert.ToByte(values[2]);
var b = System.Convert.ToByte(values[3]);
return new Color() { A = a, B = b, R = r, G = g };
}
public object[] ConvertBack(object value, Type[] targetTypes, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
}
#endregion
}
//VIEWMODEL
public ObservableCollection<SubCategory> SubCategories { get; set; } = new ObservableCollection<SubCategory>() { new SubCategory() { name = "person" } };
//SubCategory class
public class SubCategory
{
//default values - each of these objects will have different argb values
public int A { get; set; } = 95;
public int R { get; set; } = 225;
public int G { get; set; } = 80;
public int B { get; set; } = 25;
public string name { get; set; }
}

Answer 1

Why can't you use IValueConverter instead of IMultiValueConverter?
XAML
<Rectangle Fill="{Binding Path=., Converter={StaticResource argbConverter}}"
Width="16" Height="16"/>
Converter
public class ArgbConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
var item = value as SubCategory;
var a = System.Convert.ToByte(item.A);
var r = System.Convert.ToByte(item.R);
var g = System.Convert.ToByte(item.G);
var b = System.Convert.ToByte(item.B);
return new SolidColorBrush(new Color() { A = a, B = b, R = r, G = g });
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}

Answer 2

You have already implemented an IMultiValueConverter. So the obvious answer seems to be a MultiBinding, with four Bindings to the A, R, G and B properties:
<Rectangle>
<Rectangle.Fill>
<SolidColorBrush>
<SolidColorBrush.Color>
<MultiBinding Converter="{StaticResource argbConverter}">
<Binding Path="A"/>
<Binding Path="R"/>
<Binding Path="G"/>
<Binding Path="B"/>
</MultiBinding>
</SolidColorBrush.Color>
</SolidColorBrush>
</Rectangle.Fill>
</Rectangle>