私は様々な色合いを取りたいと思っています - これはUWPで行うことができますか？

Question

私のアプリでは、ユーザー定義の色のさまざまな色合いを表示したいと思います。私はUWPの方法を見つけることができません。出来ますか？私はC＃でプログラミングしています。

Answer 1

これはUWPプラットフォームでは標準ではサポートされていませんが、mathを使うだけで簡単です。）これを行うヘルパークラスを作成しました。 HSV構造を定義するための余分なクラスもあります。 トリックは色の色相、彩度、明るさ（または値）を取得し、次に明るさ（値）を変更することです。

以下のクラスでは、GetColorsメソッドを呼び出して、その色の陰影のリストを取得します。

public class ColorHelper 
{ 
    public static List<Windows.UI.Color> GetColors(Windows.UI.Color baseColor, int max) 
    { 
        // fill color shades list 
        List<Windows.UI.Color> colorShades = new List<Windows.UI.Color>(); 
        HSVColor hsv = ColorHelper.RGBtoHSV(baseColor); 
        hsv.V = 255; // alway use highest brightness to determine collection of shades 
        double v = hsv.V / max; 
        for (int i = 0; i < max; i++) 
        { 
            hsv.V = v * i; 
            if (hsv.V > 255) hsv.V = 255; 
            colorShades.Add(ColorHelper.HSVtoRGB(hsv)); 
        } 
        return colorShades; 
    } 

    public static HSVColor RGBtoHSV(Windows.UI.Color rgb) 
    { 
        double max, min, chroma; 
        HSVColor hsv = new HSVColor(); 

        min = Math.Min(Math.Min(rgb.R, rgb.G), rgb.B); 
        max = Math.Max(Math.Max(rgb.R, rgb.G), rgb.B); 
        chroma = max - min; 

        if (chroma != 0) 
        { 
            if (rgb.R == max) 
            { 
                hsv.H = (rgb.G - rgb.B) / chroma; 
                if (hsv.H < 0.0) hsv.H += 6.0; 
            } 
            else if (rgb.G == max) 
            { 
                hsv.H = ((rgb.B - rgb.R) / chroma) + 2.0; 
            } 
            else 
            { 
                hsv.H = ((rgb.R - rgb.G) / chroma) + 4.0; 
            } 
            hsv.H *= 60.0; 
            hsv.S = chroma / max; 
        } 

        hsv.V = max; 
        hsv.A = rgb.A; 

        return hsv; 
    } 

    public static Windows.UI.Color HSVtoRGB(HSVColor hsv) 
    { 
        double min, chroma, hdash, x; 
        Windows.UI.Color rgb = new Windows.UI.Color(); 

        chroma = hsv.S * hsv.V; 
        hdash = hsv.H / 60.0; 
        x = chroma * (1.0 - Math.Abs((hdash % 2.0) - 1.0)); 

        if (hdash < 1.0) 
        { 
            rgb.R = (byte)chroma; 
            rgb.G = (byte)x; 
        } 
        else if (hdash < 2.0) 
        { 
            rgb.R = (byte)x; 
            rgb.G = (byte)chroma; 
        } 
        else if (hdash < 3.0) 
        { 
            rgb.G = (byte)chroma; 
            rgb.B = (byte)x; 
        } 
        else if (hdash < 4.0) 
        { 
            rgb.G = (byte)x; 
            rgb.B = (byte)chroma; 
        } 
        else if (hdash < 5.0) 
        { 
            rgb.R = (byte)x; 
            rgb.B = (byte)chroma; 
        } 
        else if (hdash < 6.0) 
        { 
            rgb.R = (byte)chroma; 
            rgb.B = (byte)x; 
        } 

        min = hsv.V - chroma; 

        rgb.R += (byte)min; 
        rgb.G += (byte)min; 
        rgb.B += (byte)min; 
        rgb.A = (byte)hsv.A; 

        return rgb; 
    } 
} 

public class HSVColor 
{ 
    public double H { get; set; } 
    public double S { get; set; } 
    public double V { get; set; } 
    public double A { get; set; } 

    public HSVColor() 
    { 
        H = S = V = A = 1.0; 
    } 
} 

Answer 2

LinearGradientBrushまたはRadialGradientBrushを使用できます。範囲を表示するには、2つのGradientStopsを追加する必要があります。グラデーションブラシでペイントする要素の背景を設定します。

<Page 
x:Class="CarServiceLogger.MainPage" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:CarServiceLogger" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d"> 
<!--{ThemeResource ApplicationPageBackgroundThemeBrush}--> 
<Grid > 
    <Grid.Background> 
     <LinearGradientBrush StartPoint="0,0" EndPoint="1,0"> 
      <GradientStop Offset="0" Color="#FF0000" /> 
      <GradientStop Offset="1" Color="#000000" /> 
     </LinearGradientBrush> 
    </Grid.Background> 

</Grid> 
</Page> 

Answer 3

これは色合いに関する難しい質問です。シェードは、少なくとも1つの色から別の色にする必要があります。最も単純な色合いは選択された色から黒までです。アルファチャンネル（透明度）を255から0に変更して、それを黒色（背景）に変更して実装できます。 https://en.wikipedia.org/wiki/Tints_and_shades#/media/File:Kleurenovergang_van_zwart_naar_blauw.png