How can I set custom colors values in a Xaml Value field?

So I have some XAML like this:

<Trigger Property="ItemsControl.AlternationIndex" Value="2">
    <Setter Property="Background" Value="Red"></Setter>
</Trigger>

How can I set the color Red, to something like 250 200 150? I tried Color 250 200 150, and 250 200 150, but doesn't work. Any ideas?


Solution 1:

Use HTML-style colors.

    <Trigger Property="ItemsControl.AlternationIndex" Value="2">
        <Setter Property="Background" Value="#FF0000"></Setter>
    </Trigger>

Or, if you want alpha transparency:

    <Trigger Property="ItemsControl.AlternationIndex" Value="2">
        <Setter Property="Background" Value="#80FF0000"></Setter>
    </Trigger>

Or using your example color of 250,200,150:

    <Trigger Property="ItemsControl.AlternationIndex" Value="2">
        <Setter Property="Background" Value="#FAC896"></Setter>
    </Trigger>

Solution 2:

Sorry, I was wrong here. The way to use this is with floating point values ranging from 0 to 1.

<Trigger Property="ItemsControl.AlternationIndex" Value="2"> 
    <Setter Property="Background" Value="sc#1.0,0.7,1.0,0.5"></Setter> 
</Trigger>

To use ARGB values we must use this, a little less straight forward

<Trigger Property="ItemsControl.AlternationIndex" Value="2"> 
    <Setter Property="Background">
        <Setter.Value>
            <SolidColorBrush>
                <SolidColorBrush.Color>
                    <Color A="255" R="250" G="200" B="150"/>
                </SolidColorBrush.Color>
            </SolidColorBrush>
        </Setter.Value>
    </Setter> 
</Trigger> 

Update
You could also use a custom MarkupExtension

<Trigger Property="ItemsControl.AlternationIndex" Value="2"> 
    <Setter Property="Background" Value="{markup:BrushFromArgb 255, 250, 200, 150}"/>
</Trigger>

BrushFromArgbExtension

public class BrushFromArgbExtension : MarkupExtension
{
    public BrushFromArgbExtension() { }
    public BrushFromArgbExtension(byte a, byte r, byte g, byte b)
    {
        A = a;
        R = r;
        G = g;
        B = b;
    }

    public byte A { get; set; }
    public byte R { get; set; }
    public byte G { get; set; }
    public byte B { get; set; }

    public override object ProvideValue(IServiceProvider serviceProvider)
    {
        return new SolidColorBrush(Color.FromArgb(A, R, G, B));
    }
}

And a similar MarkupExtension could also be used for Color

<SolidColorBrush Color="{markup:FromArgb 255, 255, 200, 150}"/>

FromArgbExtension

public class FromArgbExtension : MarkupExtension
{
    public FromArgbExtension() { }
    public FromArgbExtension(byte a, byte r, byte g, byte b)
    {
        A = a;
        R = r;
        G = g;
        B = b;
    }

    public byte A { get; set; }
    public byte R { get; set; }
    public byte G { get; set; }
    public byte B { get; set; }

    public override object ProvideValue(IServiceProvider serviceProvider)
    {
        return Color.FromArgb(A, R, G, B);
    }
}

Solution 3:

You can set the "background" property on a XAML control element to be a hex value directly.

<Button Background="#292929">

And you can add the alpha at the start if you wish as well.

<Button Background="#55292929">

Learn more here