Question

How to achieve such effect in XAML:

    <LinearGradientBrush x:Key="BrightSeparatorGradient" StartPoint="0.0, 0.5" EndPoint="1.0, 0.5">
        <GradientStop Offset="0.0" Color="{StaticResource {x:Static SystemColors.ControlLightColorKey}}" /> <!-- But fully transparent -->
        <GradientStop Offset="0.5" Color="{StaticResource {x:Static SystemColors.ControlLightColorKey}}" />
        <GradientStop Offset="1.0" Color="{StaticResource {x:Static SystemColors.ControlLightColorKey}}" /> <!-- But fully transparent -->
    </LinearGradientBrush>

I’ve tried to create two brushes with appropriate color and Opacity set, respectively, to 0.0 and 1.0, but the compiler refused to take Brush as a Color (what is quite logic, on a second thought :)).

Best regards — Spook.

Answer 1

I would create a MarkupExtension that takes a Color and returns the Color with the specified opacity:

public class OpacityExtension : MarkupExtension
{
    private readonly Color color;
    public byte Opacity { get; set; } // defaults to 0, so you don't have 
                                      // to set it for the color to be transparent

    public OpacityExtension(Color color)
    {
        this.color = color;           
    }

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

And then you use it like so:

<LinearGradientBrush x:Key="BrightSeparatorGradient" StartPoint="0.0, 0.5" EndPoint="1.0, 0.5">
    <GradientStop Offset="0" Color="{lcl:Opacity {StaticResource {x:Static SystemColors.ControlLightColorKey}}}" />
    <GradientStop Offset=".5" Color="{StaticResource {x:Static SystemColors.ControlLightColorKey}}" />
    <GradientStop Offset="1" Color="{lcl:Opacity {StaticResource {x:Static SystemColors.ControlLightColorKey}}}" />
</LinearGradientBrush>