Single-Stop Gradients Are Off-Color

[Lonswaya]

ISSUE

I noticed this issue when programatically filling up views using a list of colors. When you only have a single color, single-stop gradient view, the color will be a darker, off-color hue with the same saturation.

I'd at least like to notify any other developers working on using this tool programatically, since discovering this issue found myself double and triple checking some of my color conversion logic.

CODE

With a MainPage looking like this in a brand-new Xamarin project, the differences can easily be spotted.

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:magicGradients="clr-namespace:MagicGradients;assembly=MagicGradients"
             x:Class="MagicGradientColorIssue.MainPage">
    <AbsoluteLayout
        BackgroundColor="#00AAE3">
        <magicGradients:GradientView
            AbsoluteLayout.LayoutBounds="0.5,0.0,0.5,0.5"
            AbsoluteLayout.LayoutFlags="All">
        <magicGradients:GradientView.GradientSource>
                <magicGradients:LinearGradient Angle="270">
                    <magicGradients:GradientStop Color="#00AAE3" Offset="0"/>
                </magicGradients:LinearGradient>
            </magicGradients:GradientView.GradientSource>
        </magicGradients:GradientView>
        <magicGradients:GradientView
            AbsoluteLayout.LayoutBounds="0.5,1,0.5,0.5"
            AbsoluteLayout.LayoutFlags="All">
            <magicGradients:GradientView.GradientSource>
                <magicGradients:LinearGradient Angle="270">
                    <magicGradients:GradientStop Color="#00AAE3" Offset="0"/>
                    <magicGradients:GradientStop Color="#FFFF00" Offset="1"/>
                </magicGradients:LinearGradient>
            </magicGradients:GradientView.GradientSource>
        </magicGradients:GradientView>
    </AbsoluteLayout>
</ContentPage>

Attempting to set our first gradient to a color of #00AAE3, the same as the background, results in a color of #0067C4. Once we add another color (#FFFF00), the color is corrected.

WORKAROUND

A simple workaround would be to set two gradient stops of the same color.