Как объединить несколько эффектов в UWP Composition API

Я хочу совместить размытие, насыщенность и оттенок.

У меня есть эффект наложения, состоящий из цвета 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»


person Liero    schedule 12.12.2016    source источник


Ответы (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);

Скриншот

person Decade Moon    schedule 12.12.2016
comment
Это работает отлично, почему он еще не отмечен как ответ? - person Sergio0694; 23.02.2017