CODEWITHSUNDEEP
wpfxamlcolorsstyles
Deadzone
Deadzone

Reputation: 814

Window background black color when stylised

I'm trying to apply the following background brush to a NavigationWindow :

<NavigationWindow.Background>
    <RadialGradientBrush GradientOrigin="0.496,1.052">
        <RadialGradientBrush.RelativeTransform>
            <TransformGroup>
                <ScaleTransform CenterX="0.5" CenterY="0.5" 
                                ScaleX="1.5" ScaleY="1.5"/>
                <TranslateTransform X="0.02" Y="0.0"/>
            </TransformGroup>
        </RadialGradientBrush.RelativeTransform>
        <GradientStop Offset="1" Color="#00000000"/>
        <GradientStop Offset="0.2" Color="#FFFFFFFF"/>
    </RadialGradientBrush>
</NavigationWindow.Background>

There is nothing currently besides this setter in the NavigationWindow element body, I'm trying to work it out in a fresh project. The designer shows the proper coloring, but during runtime it becomes a lot darker than it should be:

This is how it's supposed to look and also how the designer properly displays it:

enter image description here

And this is how it looks during runtime:

enter image description here

I have tried to apply the same brush to a Page element and it works just fine.

Upvotes: 0

Views: 50

Answers (1)

Neil B
Neil B

Reputation: 2224

It's because your black color is 100% transparent and the background is black showing through at run time. In the designer you checkered white background is showing. You can prove that two way. First set Visual Studio to be in dark mode. Second change the NavigationWindow to Background=Transparent. You will see at run time it has a black background. On the other hand setting the background transparent on a page results in a white background.

Try using all opaque colors. Something like this:

<NavigationWindow.Background>
    <RadialGradientBrush GradientOrigin="0.496,1.052">
        <RadialGradientBrush.RelativeTransform>
            <TransformGroup>
                <ScaleTransform CenterX="0.5" CenterY="0.5" 
                            ScaleX="1.5" ScaleY="1.5"/>
                <TranslateTransform X="0.02" Y="0.0"/>
            </TransformGroup>
        </RadialGradientBrush.RelativeTransform>
        <GradientStop Offset="1" Color="#FF4B4B4B"/>
        <GradientStop Offset="0.2" Color="#FFFFFFFF"/>
    </RadialGradientBrush>
</NavigationWindow.Background>

Upvotes: 1

Related Questions