CODEWITHSUNDEEP
c#.netwpfcolorslinear-gradients
emmalyx
emmalyx

Reputation: 2356

How can I avoid color banding in WPF's LinearGradientBrushes?

Apart from using images and dithering the gradient in software (or messing around with pixel shaders that do the dithering for me), what can I do to avoid color banding in monochrome gradients in WPF using .NET 4.6.1?

Related: Is there a way to force WPF to use 16bpc color behind the scenes?

Upvotes: 0

Views: 554

Answers (1)

TernaryTopiary
TernaryTopiary

Reputation: 436

A way I've found was to add the gradient to a container, give it a small negative margin so it spills over a little, add a BlurEffect to the gradient, and then turn on ClipToBounds on the parent container. This way the gradient evens out a bit nicer at the expense of performance.

Depending on your use case, this may not be viable, however.

Example:

<Grid Height="26" Margin="-5,0" ClipToBounds="True">
    <Grid Margin="-5">
        <Grid.Effect>
            <BlurEffect Radius="6" />
        </Grid.Effect>
        <Grid.Background>
            <LinearGradientBrush>
                <GradientStop x:Name="GradientStop7" Color="Magenta" Offset="0.0" />
                <GradientStop x:Name="GradientStop8" Color="DarkOrchid" Offset=".2" />
                <GradientStop x:Name="GradientStop9" Color="Purple" Offset="1" />
            </LinearGradientBrush>
        </Grid.Background>
    </Grid>
</Grid>

The negative gradient should be equal to the blur radius so that it doesn't become transparent on the edges.

Upvotes: 1

Related Questions