How do I know, in code, if RadialGradientBrush is not being shown correctly?

Question

I'm using RadialGradientBrush as background for a Button. On one computer, it works well. On the other, the background is transparent.

NewComputer: Intel i7-8700, 16Gb ram, 64-bit OS, graphics - Nvidia GeForce GTx1050Ti

OldComputer: Intel 6300, 2Gb ram, 32-bit OS, graphics - Intel G965 Express Chipset Family

Both computers are running Windows 10 Home, 1809 (17763.503), 1920x1080 monitor.

Running the same program on each computer (shown below), I do not get the RadialGradientBrush to show up on the OldComputer. The RadialGradientBrush is active - I can get the color from GradientStop 1 , and use that as a SolidColorBrush for the background.

A LinearGradientBrush will show up correctly on the OldComputer.

The driver for the G965 is from 2012, which is as up-to-date as is available. I am guessing that the problem is this old G965 graphics, though I am not positive of this.

This is the only code in the program. There is no additional code behind, other than that which comes as default.

<Page
    x:Class="RadialGradientBrush_Test.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:RadialGradientBrush_Test"
    xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Page.Resources>
        <!-- Radial Brush -->
        <media:RadialGradientBrush x:Key="MyRadialBrush"
            GradientOrigin="0.5,0.5" Center="0.5,0.5"
            RadiusX="0.5" RadiusY="0.5" FallbackColor="Red">
            <GradientStop Color="#FFF0F8FF" Offset="0" />
            <GradientStop Color="#FF1E90FF" Offset="1" />
        </media:RadialGradientBrush>

    </Page.Resources>

    <Grid>
        <Button Content="Test" Background="{StaticResource MyRadialBrush}"
            HorizontalAlignment="Center" BorderBrush="Black"
            BorderThickness="1"/>
    </Grid>
</Page>

NewComputer:

OldComputer:

I have a workaround, which is putting a border behind the button, with the same shape as the button, filled with the fallback solid color.

I would rather find a way in code to know if the RadialGradientBrush is going to be shown, and then change the button background to a SolidColorBrush, maybe looking at the capabilities of the graphics system?
Conceptually, something like Graphics.Capabilities.RadialGradientBrush.
Any ideas how to do this?

Edit 1: Using a graphics card in the OldComputer - can now display RadialGradientBrush. Appears to be the G965 graphics. I opened an issue on this with WindowsCommunityToolkit.

Answer 1

I would rather find a way in code to know if the RadialGradientBrush is going to be shown, and then change the button background to a SolidColorBrush, maybe looking at the capabilities of the graphics system?

The RadialGradientBrush class has a FallbackColor property. The color to use for rendering in case the CompositionBrush can't be rendered. It meets your requirement.

<media:RadialGradientBrush x:Key="MyRadialBrush"
        GradientOrigin="0.5,0.5" Center="0.5,0.5"
        RadiusX="0.5" RadiusY="0.5" FallbackColor="White">
        <GradientStop Color="#FFF0F8FF" Offset="0" />
        <GradientStop Color="#FF1E90FF" Offset="1" />
</media:RadialGradientBrush>