創建一個wpf漸變畫筆編輯器。 （RGB顏色為HSL / HSV）

Question

我想創建一個像MSVS 2013畫筆編輯器一樣的漸變畫筆編輯器。

我使用以下代碼制作了編輯器

 <VisualBrush x:Key="MyBrush" TileMode="None">
        <VisualBrush.Visual>
            <Canvas Background="Black" Width="1" Height="1" >
                <Rectangle Width="1" Height="1" >
                    <Rectangle.Fill>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                            <LinearGradientBrush.GradientStops>
                                <GradientStop Color="White" Offset="0" />
                                <GradientStop Color="{Binding ElementName=picker,Path=SelectedColour}" Offset="1" />
                            </LinearGradientBrush.GradientStops>
                        </LinearGradientBrush>
                    </Rectangle.Fill>
                    <Rectangle.OpacityMask>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                            <LinearGradientBrush.GradientStops>
                                <GradientStop Color="#FFFFFFFF" Offset="0"/>
                                <GradientStop Color="#00FFFFFF" Offset="1"/>
                            </LinearGradientBrush.GradientStops>
                        </LinearGradientBrush>
                    </Rectangle.OpacityMask>
                </Rectangle>
            </Canvas>
        </VisualBrush.Visual>
    </VisualBrush>

請看下面的圖片並回答我的問題

更新：

我意識到我應該將RGB轉換為HSV。

RGB到HSV公式

Answer 1

如果您閱讀了我發給您的文章，您將了解如何獲得X（飽和度％）和Y（明度％）。 它們以百分比表示，您可以根據顏色框的寬度繪制該圓圈。 因此，如果正方形為200x200像素，飽和度為45％，則將繪制X =90。如果亮度為60％，則將繪制Y = 120。

XAML：

<Path Stroke="White" StrokeThickness="2" Fill="Red" >
    <Path.Data>
        <EllipseGeometry 
            Center="{Binding Path=CenterPoint}" 
            RadiusX="5" 
            RadiusY="10" />
    </Path.Data>
</Path>

視圖模型：

public Point CenterPoint
{
  get { return new Point(Lightness, Saturation); }
}

您需要填寫詳細信息，以將RGB顏色轉換為HSL。