如何在 UWP Composition API 中组合多种效果

Question

我想结合模糊、饱和度和色调颜色。

我有一个混合效果，由 GaussianBlur 和 Tint 颜色组成。

_compositor = ElementCompositionPreview.GetElementVisual(this).Compositor;

var graphicsEffect = new BlendEffect
{
    Mode = BlendEffectMode.Overlay,
    Background = new GaussianBlurEffect()
    {
        Name = "Blur",
        Source = new CompositionEffectSourceParameter("Backdrop"),
        BlurAmount = 10f
        BorderMode = EffectBorderMode.Hard,
    },
    Foreground = new ColorSourceEffect()
    {
        Name = "Tint",
        Color = Color.FromArgb(120, 255, 255, 255),
    }
};


var effectFactory = _compositor.CreateEffectFactory(graphicsEffect)
_brush = effectFactory.CreateBrush();
_brush.SetSourceParameter("Backdrop", _compositor.CreateBackdropBrush());

_effectSprite = _compositor.CreateSpriteVisual();
_effectSprite.Size = new Vector2((float)this.ActualWidth, (float)this.ActualHeight)
_effectSprite.Brush = _brush;
ElementCompositionPreview.SetElementChildVisual(this, _effectSprite)

如何在此效果之前或之后添加 SaturationEffect？

我尝试将它包装到另一个 BlendEffect 中并将另一个 BackdropBrush 设置为 SaturationEffect 的来源，但我只有白色背景。

我也尝试从 SaturationEffect 创建画笔并将其设置为 GaussianBlur 的来源，但出现异常“Invalid Source Brush”

Answer 1

这是一个例子：

(input) Backdrop -> GaussianBlur ->|
                     ColorSource ->| Blend -> Saturation (output)

var compositor = ElementCompositionPreview.GetElementVisual(this).Compositor;

var blurEffect = new GaussianBlurEffect()
{
    Name = "Blur",
    BlurAmount = 0.0f,
    BorderMode = EffectBorderMode.Hard,
    Optimization = EffectOptimization.Balanced,
    Source = new CompositionEffectSourceParameter("source"),
};

var colorEffect = new ColorSourceEffect
{
    Name = "Tint",
};

var blendEffect = new BlendEffect
{
    Background = blurEffect,
    Foreground = colorEffect,
    Mode = BlendEffectMode.Overlay,
};

var saturationEffect = new SaturationEffect
{
    Name = "Saturation",
    Source = blendEffect,
    Saturation = 1.5f,
};

var factory = compositor.CreateEffectFactory(saturationEffect, new[]
{
    "Blur.BlurAmount",
    "Tint.Color",
    "Saturation.Saturation",
});

var brush = factory.CreateBrush();
brush.SetSourceParameter("source", compositor.CreateBackdropBrush());

// Animatable properties
brush.Properties.InsertScalar("Blur.BlurAmount", 10);
brush.Properties.InsertColor("Tint.Color", Color.FromArgb(20, 255, 0, 0));
brush.Properties.InsertScalar("Saturation.Saturation", 1.5f);

var sprite = compositor.CreateSpriteVisual();
sprite.Brush = brush;
sprite.Offset = new Vector3(50, 250, 0);
sprite.Size = new Vector2(200, 200);
ElementCompositionPreview.SetElementChildVisual(this, sprite);