UWP/WinUI3 Win2d PixelShaderEffect 实现ColorPlacementEffect (颜色替换) 滤镜。

　　　在上一篇：UWP/WinUI3 PixelShaderEffect 实现ThresholdEffect 滤镜。 - 吃饭/睡觉 - 博客园 (cnblogs.com) 已经价绍了如何编写hsls，编译，和使用 PixelShaderEffect 来实现自定义滤镜效果了，那么本编将介绍如何编写一个 “颜色替换滤镜”；

　　　　效果图：

 

 

    　　一.颜色匹配理论

　　　　1.根据指定的颜色和阈值匹配到 指定颜色范围的像素。

　　　　2.利用hsv颜色模式 调整选中像素的 色调，饱和度，亮度；

//设置输入源数量
#define D2D_INPUT_COUNT 1
//将输入源0 设置为简单采样模式
#define D2D_INPUT0_SIMPLE
//引入hlsl帮助程序
#include "d2d1effecthelpers.hlsli"

//定义属性
//源颜色 float(0,0,0)~float(1,1,1)
float3 sourceColor;
//替换后的颜色,hsv颜色 float(0,0,0)~float(1,1,1)
float3 hsv;
//颜色容差 0~1
float threshold;

//HSV 到 RGB 转换
float3 hsv2rgb(float3 c)
{
    float3 rgb = clamp(abs(fmod(c.x * 6.0 + float3(0.0, 4.0, 2.0), 6.0) - 3.0) - 1.0, 0.0, 1.0);
    float3 f1 = float3(1,1,1);
    return c.z * lerp(f1, rgb, float3(c.y,c.y,c.y));
    //return f1;
}
//rgb到hsv 转换
float3 rgb2hsv(float3 c)
{
    float4 K = float4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);
    float a = step(c.b, c.g);
    float4 p = lerp(float4(c.bg, K.wz), float4(c.gb, K.xy), float4(a,a,a,a));
    float b = step(p.x, c.r);
    float4 q = lerp(float4(p.xyw, c.r), float4(c.r, p.yzx), float4(b,b,b,b));
    float d = q.x - min(q.w, q.y);
    float e = 1.0e-10;
    return float3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);
}

//主程序
D2D_PS_ENTRY(main){
    //获取当前像素颜色
    float4 sColor = D2DGetInput(0);
    float3 color = sColor.rgb;
    //当前像素的每个分量减去输入颜色的对于分量的绝对值跟阈值做比较，查看是否符合条件
    if(abs(color.r - sourceColor.r) < threshold && abs(color.g - sourceColor.g) < threshold && abs(color.b - sourceColor.b) < threshold)
    {
        //将当前颜色从 rgb转到hsv
        float3 hsv = rgb2hsv(color);
        //声明 计算后的hsv 变量
        
        float3 thsv = float3(0,0,0);
        //虽然这里用的都是rgb属性，但是对应的是hsv
        //当前像素的hsv与输入的hsv相加
        thsv.r= fmod(hsv.r*360+hsv.r*360,360)/360.0;
        thsv.g= clamp(hsv.g+hsv.g,0,1);
        thsv.b= clamp(hsv.b+hsv.b,0,1);
        //将累计后的hsv 转换成rgb然后输出颜色
        float3 resultColor = hsv2rgb(thsv);  
        return float4(resultColor,sColor.a);
    }
    //不符合条件的像素，返回输入的颜色即可
    return sColor;
}

　　　　1).在代码里定义了三个属性

　　　　　　1.sourceColor : 源颜色，用于匹配输入的颜色像素；

　　　　　　2.hsv : 输入的hsv 颜色，用于跟符合条件的像素进行累加计算。（在这里我将hsv的三个分量的范围都设置成了-1~1之间了，因为使用到的两个转换函数返回的值都是在0~1之间的。）

　　　　　　3.threshold: 阈值范围；

　　　　2).在代码中定义了两个 颜色模式转换的函数，因为这两个函数是我从别的地方复制过来的所以我也不是很懂。

　　　　　　颜色转换引用：Unity Shader - HSV 和 RGB 的相互转换 - 知乎 (zhihu.com)

　　二.选区效果

　　　　从效果图中可以看到我在图像的右下角显示了一个显示当前选中像素的效果图，其实这个也是用hlsl 绘制出来了，在这里也将这个hlsl 贴出来，因为代码上已经写了注释了，在这里就不详细讲了；

//声明只有一张纹理输入
#define D2D_INPUT_COUNT 1
//将第一张纹理设置为简单模式采样
#define D2D_INPUT0_SIMPLE
//引入hlsl 帮助程序库
#include "d2d1effecthelpers.hlsli"

//输入颜色，用户配备
float3 color;
//阈值
float threshold;

// HSV 到 RGB 转换
float3 hsv2rgb(float3 c)
{
    float3 rgb = clamp(abs(fmod(c.x * 6.0 + float3(0.0, 4.0, 2.0), 6.0) - 3.0) - 1.0, 0.0, 1.0);
    float3 f1 = float3(1, 1, 1);
    return c.z * lerp(f1, rgb, float3(c.y, c.y, c.y));
}

D2D_PS_ENTRY(main){
    //获取当前像素颜色
    float4 sColor = D2DGetInput(0);
    //将当前像素的rgb每个分量减去输入颜色的每个分量
    //用于跟阈值对比，查看当前像素是否符合条件
    float r = abs(sColor.r - color.r);
    float g = abs(sColor.g - color.g);
    float b = abs(sColor.b - color.b);
    if( r< threshold && g < threshold && b < threshold)
    {
        //将色相和饱和度都设置为0
        //将rgb三个分量相加后除以阈值*3 计算出比率然后设置当前像素的亮度
        float3 hsv = float3(0, 0, 0);
        hsv.b= 1-(r+g+b)/(threshold*3);
        //用hsv2rgb 将hsv 转换成rgb颜色
        float3 tColor = hsv2rgb(hsv);
        return float4(tColor,sColor.a);
    }
    //不符合条件的像素返回黑色
    return float4(0,0,0,1);
}

　　三.绘制方法，传入参数设定

canvas.Draw += (s, e) =>
            {
                //绘制黑白网格
                Win2dUlit.DrawGridGraphics(e.DrawingSession, 100);
                //判断effect 和位图是否为空
                if (effect == null || bitmap == null)
                    return;
                if (color != null)
                {
                    //绘制替换颜色效果
                    //颜色将0~255 转换成0~1 因为hlsl里面的颜色是0~1范围的并且是float类型，所以这里需要将每个颜色的分量除以255
                    Vector3 hsv = targetHsv.HsvToVector3();
                    Vector3 sourceColor = new Vector3(color.Value.R / 255f, color.Value.G / 255f, color.Value.B / 255f);
                    //通过键值对的形式设置属性传递到着色器里面
                    effect.Properties["threshold"] = (float)threshold.Value;
                    effect.Properties["hsv"] = hsv;
                    effect.Properties["sourceColor"] = sourceColor;
                    effect.Source1 = bitmap;
                    //绘制效果图
                    var effectTran = Win2dUlit.CalcutateImageCenteredTransform(effectWidth, effectHeight, bitmap.Size.Width, bitmap.Size.Height);
                    effectTran.Source = effect;
                    e.DrawingSession.DrawImage(effectTran);
                    //绘制选区图 右下角
                    var constTran = Win2dUlit.CalcutateImageCenteredTransform(previewWidth, previewHeight, bitmap.Size.Width, bitmap.Size.Height);
                    constEffect.Source1 = bitmap;
                    constEffect.Properties["threshold"] = (float)threshold.Value;
                    constEffect.Properties["color"] = sourceColor;
                    using (var ds = constRender.CreateDrawingSession())
                    {
                        ds.Clear(Colors.Transparent);
                        ds.DrawImage(constEffect, new Rect(new Point(), bitmap.Size), new Rect(new Point(), bitmap.Size));
                    }
                    constTran.Source = constRender;
                    e.DrawingSession.DrawImage(constTran, previewWidth, effectHeight);
                }
                else
                {
                    var effectTran = Win2dUlit.CalcutateImageCenteredTransform(effectWidth, effectHeight, bitmap.Size.Width, bitmap.Size.Height);
                    effectTran.Source = bitmap;
                    e.DrawingSession.DrawImage(effectTran);
                }
                //绘制原图 左下角
                var previewTran = Win2dUlit.CalcutateImageCenteredTransform(previewWidth, previewHeight, bitmap.Size.Width, bitmap.Size.Height);
                previewTran.Source = bitmap;
                e.DrawingSession.DrawImage(previewTran, 0, effectHeight);
                //绘制选择颜色缩略图
                if (isPressed && (pos.X >= offsetX && pos.X <= offsetX + width && pos.Y >= offsetY && pos.Y <= offsetY + height))
                {
                    //画三角形
                    CanvasPathBuilder builder = new CanvasPathBuilder(canvas);
                    builder.BeginFigure(pos);
                    builder.AddLine(pos - new Vector2(5, 5));
                    builder.AddLine(pos - new Vector2(-5, 5));
                    builder.EndFigure(CanvasFigureLoop.Closed);
                    CanvasGeometry geometry = CanvasGeometry.CreatePath(builder);
                    e.DrawingSession.FillGeometry(geometry, Colors.White);
                    e.DrawingSession.FillRoundedRectangle(new Rect(pos.X - 50, pos.Y - 100 - 5, 100, 100), 10, 10, Colors.White);
                    //采样位置
                    var usePx = (pos.X - offsetX) / scale;
                    var usePy = (pos.Y - offsetY) / scale;
                    e.DrawingSession.DrawImage(bitmap, pos.X - 50, pos.Y - 100 - 5, new Rect(usePx - 50, usePy - 50, 100, 100));
                    e.DrawingSession.DrawRectangle(new Rect(pos.X - 1, pos.Y - 56, 3, 3), Colors.Orange);
                    e.DrawingSession.DrawRoundedRectangle(new Rect(pos.X - 50, pos.Y - 100 - 5, 100, 100), 10, 10, Colors.Black);
                }
            };

　　在绘制方法里面我们只需要关心如和传入参数和参数类型以及范围

　　1.sourceColor： 通过键值对的形式设置效果的参数，但是在传入颜色之前需要 从rgb(0~255) 转换成 vector3(0~1);

　　2.hsv :在传入前需要将hsv颜色 从 (360,100,100）转换成 (1,1,1) 

　　3.threshold: 因为在hlsl 上定义的是float 类型，所以传入时 也需要将值转换成float类型才能传入；

　　四.所有代码

　　　　因为下面的很多代码都是关于一些输入交互的所以这里直接将代码贴出来,复制到已经引用win2d库的项目应该就能运行了。

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition Height="auto"></RowDefinition>
        </Grid.RowDefinitions>
        <canvas:CanvasControl x:Name="canvas"></canvas:CanvasControl>
        <StackPanel Grid.Row="1">
            <Button Content="选择图片" x:Name="selectPicture"></Button>
            <Slider Header="阈值：" Value="0.2" Maximum="1" StepFrequency="0.01" x:Name="threshold"></Slider>
            <StackPanel Orientation="Horizontal">
                <Border Margin="10 0 10 0" x:Name="selectColor" BorderBrush="Black" BorderThickness="2">
                    <TextBlock Text="选择的颜色" HorizontalAlignment="Center" VerticalAlignment="Center" ></TextBlock>
                </Border>
                <StackPanel Width="300">
                    <Rectangle Width="200" Fill="Gray" Height="30" x:Name="replaceColor"></Rectangle>
                    <Slider Header="色相" x:Name="hue" StepFrequency="1" Minimum="-180" Maximum="180"></Slider>
                    <Slider Header="饱和度" x:Name="saturation" Minimum="-100" Maximum="100"></Slider>
                    <Slider Header="亮度" x:Name="brightness" Minimum="-100" Maximum="100"></Slider>
                </StackPanel>
            </StackPanel>

        </StackPanel>
    </Grid>

public sealed partial class ColorReplacementPage : Page
    {
        PixelShaderEffect effect;
        //选区效果
        PixelShaderEffect constEffect;
        CanvasRenderTarget constRender;
        CanvasBitmap bitmap;
        Color[] bitmapColors;
        public ColorReplacementPage()
        {
            this.InitializeComponent();
            Init();
            InitOperate();
        }
        Hsv targetHsv = new Hsv();
        Hsv sourceHsv = new Hsv();
        Color? color;
        float effectWidth;
        float effectHeight;
        float previewWidth;
        float previewHeight;
        //记录鼠标是否在画布上按下
        bool isPressed;
        //记录小图在画布上的大小和位置，和偏移
        float offsetX, offsetY, scale, width, height;
        Vector2 pos;
        void Init()
        {
            canvas.CreateResources += async (s, e) =>
            {
                //获取着色器二进制文件
                StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Shaders/ColorReplacementEffect.bin"));
                IBuffer buffer = await FileIO.ReadBufferAsync(file);
                //转换成字节数组
                var bytes = buffer.ToArray();
                //用 字节数组 初始化一个 PixelShaderEffect 对象；b v
                effect = new PixelShaderEffect(bytes);

                file = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Shaders/ConstituencyEffect.bin"));
                buffer = await FileIO.ReadBufferAsync(file);
                bytes = buffer.ToArray();
                constEffect = new PixelShaderEffect(bytes);
            };
            //选择图片
            selectPicture.Click += async (s, e) =>
            {
                var file = await Ulit.SelectFileAsync(new List<string> { ".png", ".jpg" });
                if (file == null)
                {
                    bitmap = null;
                    color = null;
                }
                else
                {
                    bitmap = await CanvasBitmap.LoadAsync(canvas.Device, await file.OpenAsync(FileAccessMode.Read));
                    //获取图像像素数组
                    bitmapColors = bitmap.GetPixelColors();
                    constRender = new CanvasRenderTarget(canvas, bitmap.Size);
                }
                CalcuationDrawPosition();
                canvas.Invalidate();
            };
            canvas.Draw += (s, e) =>
            {
                //绘制黑白网格
                Win2dUlit.DrawGridGraphics(e.DrawingSession, 100);
                //判断effect 和位图是否为空
                if (effect == null || bitmap == null)
                    return;
                if (color != null)
                {
                    //绘制替换颜色效果
                    //颜色将0~255 转换成0~1 因为hlsl里面的颜色是0~1范围的并且是float类型，所以这里需要将每个颜色的分量除以255
                    Vector3 hsv = targetHsv.HsvToVector3();
                    Vector3 sourceColor = new Vector3(color.Value.R / 255f, color.Value.G / 255f, color.Value.B / 255f);
                    //通过键值对的形式设置属性传递到着色器里面
                    effect.Properties["threshold"] = (float)threshold.Value;
                    effect.Properties["hsv"] = hsv;
                    effect.Properties["sourceColor"] = sourceColor;
                    effect.Source1 = bitmap;
                    //绘制效果图
                    var effectTran = Win2dUlit.CalcutateImageCenteredTransform(effectWidth, effectHeight, bitmap.Size.Width, bitmap.Size.Height);
                    effectTran.Source = effect;
                    e.DrawingSession.DrawImage(effectTran);
                    //绘制选区图 右下角
                    var constTran = Win2dUlit.CalcutateImageCenteredTransform(previewWidth, previewHeight, bitmap.Size.Width, bitmap.Size.Height);
                    constEffect.Source1 = bitmap;
                    constEffect.Properties["threshold"] = (float)threshold.Value;
                    constEffect.Properties["color"] = sourceColor;
                    using (var ds = constRender.CreateDrawingSession())
                    {
                        ds.Clear(Colors.Transparent);
                        ds.DrawImage(constEffect, new Rect(new Point(), bitmap.Size), new Rect(new Point(), bitmap.Size));
                    }
                    constTran.Source = constRender;
                    e.DrawingSession.DrawImage(constTran, previewWidth, effectHeight);
                }
                else
                {
                    var effectTran = Win2dUlit.CalcutateImageCenteredTransform(effectWidth, effectHeight, bitmap.Size.Width, bitmap.Size.Height);
                    effectTran.Source = bitmap;
                    e.DrawingSession.DrawImage(effectTran);
                }
                //绘制原图 左下角
                var previewTran = Win2dUlit.CalcutateImageCenteredTransform(previewWidth, previewHeight, bitmap.Size.Width, bitmap.Size.Height);
                previewTran.Source = bitmap;
                e.DrawingSession.DrawImage(previewTran, 0, effectHeight);
                //绘制选择颜色缩略图
                if (isPressed && (pos.X >= offsetX && pos.X <= offsetX + width && pos.Y >= offsetY && pos.Y <= offsetY + height))
                {
                    //画三角形
                    CanvasPathBuilder builder = new CanvasPathBuilder(canvas);
                    builder.BeginFigure(pos);
                    builder.AddLine(pos - new Vector2(5, 5));
                    builder.AddLine(pos - new Vector2(-5, 5));
                    builder.EndFigure(CanvasFigureLoop.Closed);
                    CanvasGeometry geometry = CanvasGeometry.CreatePath(builder);
                    e.DrawingSession.FillGeometry(geometry, Colors.White);
                    e.DrawingSession.FillRoundedRectangle(new Rect(pos.X - 50, pos.Y - 100 - 5, 100, 100), 10, 10, Colors.White);
                    //采样位置
                    var usePx = (pos.X - offsetX) / scale;
                    var usePy = (pos.Y - offsetY) / scale;
                    e.DrawingSession.DrawImage(bitmap, pos.X - 50, pos.Y - 100 - 5, new Rect(usePx - 50, usePy - 50, 100, 100));
                    e.DrawingSession.DrawRectangle(new Rect(pos.X - 1, pos.Y - 56, 3, 3), Colors.Orange);
                    e.DrawingSession.DrawRoundedRectangle(new Rect(pos.X - 50, pos.Y - 100 - 5, 100, 100), 10, 10, Colors.Black);
                }
            };
            threshold.ValueChanged += (s, e) => canvas.Invalidate();
            RangeBaseValueChangedEventHandler hsvChanged = (s, e) =>
            {
                if (color == null)
                    return;

                if (s is Slider slider)
                {
                    switch (slider.Name)
                    {
                        case "hue":
                            targetHsv.H = e.NewValue;
                            break;
                        case "saturation":
                            targetHsv.S = e.NewValue;
                            break;
                        case "brightness":
                            targetHsv.V = e.NewValue;
                            break;
                    }
                    replaceColor.Fill = new SolidColorBrush((sourceHsv + targetHsv).HsvToRgb());
                }
                canvas.Invalidate();
            };
            hue.ValueChanged += hsvChanged;
            saturation.ValueChanged += hsvChanged;
            brightness.ValueChanged += hsvChanged;
        }

        void InitOperate()
        {
            //画布大小更改，计算绘制区域
            canvas.SizeChanged += (s, e) => CalcuationDrawPosition();
            //鼠标再画布按下
            canvas.PointerPressed += (s, e) =>
            {
                isPressed = true;
                canvas.Invalidate();
            };
            //鼠标松开
            canvas.PointerReleased += (s, e) =>
            {
                isPressed = false;
                canvas.Invalidate();
            };

            canvas.PointerMoved += (s, e) =>
            {
                if (!isPressed || bitmap == null)
                    return;
                Point p = e.GetCurrentPoint(canvas).Position;
                pos = p.ToVector2();
                //是否进入范围
                if ((p.X >= offsetX && p.X <= offsetX + width && p.Y >= offsetY && p.Y <= offsetY + height))
                {
                    var x = p.X - offsetX;
                    var y = p.Y - offsetY;
                    x = x / scale;
                    y = y / scale;
                    color = bitmapColors[(int)x + (int)y * bitmap.SizeInPixels.Width];
                    sourceHsv = sourceHsv.RgbToHsv(color.Value);
                    replaceColor.Fill = new SolidColorBrush((sourceHsv + targetHsv).HsvToRgb());
                    //设置选中的颜色
                    selectColor.Background = new SolidColorBrush(color.Value);
                    canvas.Invalidate();
                }
            };
        }
        void CalcuationDrawPosition()
        {
            //判断effect 和位图是否为空
            if (effect == null || bitmap == null)
                return;
            var element = canvas;
            effectWidth = (float)element.ActualWidth;
            effectHeight = (float)element.ActualHeight * 0.7f;
            previewWidth = effectWidth*0.5f;
            previewHeight = (float)element.ActualHeight * 0.3f;
            var mat = Win2dUlit.CalcutateImageCenteredMat(previewWidth, previewHeight, bitmap.Size.Width, bitmap.Size.Height);
            scale = mat.M11;
            offsetX = mat.M31;
            offsetY = mat.M32 + effectHeight;
            width = (float)(scale * bitmap.Size.Width);
            height = (float)(scale * bitmap.Size.Height);
        }
    }

 public static class Win2dUlit
    {
        public static void DrawGridGraphics(CanvasDrawingSession draw, int size = 100)
        {
            var target = new CanvasRenderTarget(draw, new Windows.Foundation.Size(size * 2, size * 2));
            using (var ds = target.CreateDrawingSession())
            {
                for (int x = 0; x < 2; x++)
                {
                    for (int y = 0; y < 2; y++)
                    {
                        Color color = (x + y) % 2 == 0 ? Colors.White : Color.FromArgb(255, 219, 219, 219);
                        ds.FillRectangle(new Rect(x * size, y * size, size, size), color);
                    }
                }
            }
            var gridTargetEffect = new BorderEffect()
            {
                Source = target,
                ExtendY = CanvasEdgeBehavior.Wrap,
                ExtendX = CanvasEdgeBehavior.Wrap,
            };
            draw.DrawImage(gridTargetEffect);
        }

        public static Transform2DEffect CalcutateImageCenteredTransform(double cWidth, double cHeight, double iWidth, double iHeight)
        {
            var mat = CalcutateImageCenteredMat(cWidth, cHeight, iWidth, iHeight);
            return new Transform2DEffect() { TransformMatrix = mat };
        }

        public static Transform2DEffect CalcutateImageCenteredTransform(Windows.Foundation.Size cSize, Windows.Foundation.Size iSize)
        {
            return CalcutateImageCenteredTransform(cSize.Width, cSize.Height, iSize.Width, iSize.Height);
        }

        public static Matrix3x2 CalcutateImageCenteredMat(Windows.Foundation.Size cSize, Windows.Foundation.Size iSize)
        {
            return CalcutateImageCenteredMat(cSize.Width, cSize.Height, iSize.Width, iSize.Height);
        }
        public static Matrix3x2 CalcutateImageCenteredMat(double cWidth, double cHeight, double iWidth, double iHeight)
        {
            float f = (float)Math.Min(cWidth / iWidth, cHeight / iHeight);
            float ox = (float)(cWidth - iWidth * f) / 2;
            float oy = (float)(cHeight - iHeight * f) / 2;
            Matrix3x2 matrix3X2 = Matrix3x2.CreateScale(f) * Matrix3x2.CreateTranslation(ox, oy);
            return matrix3X2;
        }
    }

public class Hsv 
    {
        public Hsv() { }
        public Hsv(double h, double s, double v)
        {
            H = h;
            S = s;
            V = v;
        }
        /// <summary>
        /// 色相 0~360
        /// </summary>
        public double H { get;set; }
        /// <summary>
        /// 亮度 0~100
        /// </summary>
        public double S { get;set; }
        /// <summary>
        /// 饱和度 0~100
        /// </summary>
        public double V { get;set; }
       
        /// <summary>
        /// 将当前hsv转换成颜色返回
        /// </summary>
        public Color HsvToRgb()
        {
            double s = this.S / 100;
            double v = this.V / 100;
            double h = this.H;
            double R = 0, G = 0, B = 0;
            if (s == 0)
                R = G = B = v;
            else
                h /= 60;
            int i = (int)(h);
            double f = h - i;
            double a = v * (1 - s);
            double b = v * (1 - s * f);
            double c = v * (1 - s * (1 - f));
            switch (i)
            {
                case 0:
                case 6:
                    R = v; G = c; B = a;
                    break;
                case 1:
                    R = b; G = v; B = a;
                    break;
                case 2:
                    R = a; G = v; B = c;
                    break;
                case 3:
                    R = a; G = b; B = v;
                    break;
                case 4:
                    R = c; G = a; B = v;
                    break;
                case 5:
                    R = v; G = a; B = b;
                    break;
            }
            R *= 255;
            G *= 255;
            B *= 255;
            Color color = Color.FromArgb(255, (byte)R, (byte)G, (byte)B);
            return color;
        }
        public Hsv RgbToHsv(Color c)
        {
            int R, G, B;
            R = c.R;
            G = c.G;
            B = c.B;
            double V, S, H = 0;
            double max = Math.Max(R, Math.Max(G, B));
            double min = Math.Min(R, Math.Min(G, B));
            var dalte = max - min;
            V = max / 255;
            S = dalte == 0 ? 0 : dalte / max;
            if (R == max) H = (G - B) / (max - min) * 60;
            if (G == max) H = 120 + (B - R) / (max - min) * 60;
            if (B == max) H = 240 + (R - G) / (max - min) * 60;
            if (dalte == 0) H = 0;
            if (H < 0)
                H = H + 360;
            Hsv hsv = new Hsv() { H = (int)H, S = S * 100, V = V * 100 };
            return hsv;
        }
        public static Hsv operator +(Hsv a, Hsv b)
        {
            var h = (a.H + b.H) % 360;
            var s = (a.S + b.S) % 100;
            var v = (a.V + b.V) % 100;
            return new Hsv(h, s, v);
        }
        public Vector3 HsvToVector3()
        {
            var x = (float)(this.H / 360.0);
            var y = (float)(this.S / 100.0);
            var z = (float)(this.V / 100.0);
            return new Vector3(x, y, z);
        }
    }
}

　　五.总结

　　　　通过使用hlsl着色器代码，我们就可以实现自定义滤镜，来实现不同的效果。