Question

所以UWP Composition支持已经有一段时间了我正在寻找一种方法来实时模糊元素（移动或加载时的实时模糊，而不是静态快照）。到目前为止，我一直在查看stackoverflow和google上的一些答案，它们引导我使用Lumia Imaging SDK Sample和Win2D。它们都不足以支持实时模糊。我知道在组合中可以实时模糊，因为我看过模糊视频的演示，并且有一个过时的项目XAMLFx，它允许你在8.1 Apps上使用DX模糊几乎任何东西。

我不想使用RenderTargetBitmap（希望保持我的UI线程免费）。如何仅使用合成API来完成此操作：

ContainerVisual rootVisual = GetVisual(this.Content);
Compositor compositor = rootVisual.Compositor;

// what next?

非常感谢任何帮助:)

Answer 1

注意：这些功能（模糊和背景画笔）需要Windows 10的周年更新。您目前可以通过Windows Insider计划预览SDK

<强>先决条件

定位Windows 10周年更新
对Visual Layer的基本理解以及Visual Tree的工作原理。您可以找到更多here。

此外，您可以查看我写的here的要点，这是在XAML应用程序中使用Composition API启动和运行的快速方法。它也使用效果进行演示。不仅如此，它还包括使用Composition API（使用我编写的包）加载图像。

使用入门

有两种方法可以在Composition API中使用模糊效果。一种是适用于单个表面的正常效果。另一种是将它用作“背景”画笔，它将所有内容置于其背后并使其模糊。

要使用模糊效果，您需要使用Win2D中的GaussianBlurEffect定义。这就是这样的：

GaussianBlurEffect blurEffect = new GaussianBlurEffect() 
{
    Name = "Blur",
    BlurAmount = 0.0f, // You can place your blur amount here.
    BorderMode = EffectBorderMode.Hard,
    Optimization = EffectOptimization.Balanced,
    Source = new CompositionEffectSourceParameter("source")
};

下一步是创建一个效果工厂：

var effectFactory = compositor.CreateEffectFactory(blurEffect, new[] {"Blur.BlurAmount"});

第二个参数不是必需的，但提供它可以让您在编译效果后设置动画或更改命名属性。在这种情况下，我们现在可以更改或动画BlurAmount。如果您想重复使用模糊效果工厂来创建多个模糊效果画笔，但是它们都使用不同的BlurAmount，这将非常有用。

下一步取决于您希望效果如何工作。

单面

如果您希望它仅适用于单个表面，您可以执行以下操作：

var effectBrush = effectFactory.CreateBrush();
effectBrush.SetSourceParameter("source", someOtherSurfaceBrush);
visual.Brush = effectBrush;

<强>背景幕

但是，如果要在给定视觉效果后动态模糊大量内容，请执行以下操作：

var effectBrush = effectFactory.CreateBrush();
effectBrush.SetSourceParameter("source", compositor.CreateBackdropBrush());
visual.Brush = effectBrush;

请注意，这看起来与第一种方法非常相似，但不是给它一个表面画笔，而是给它一个BackdropBrush。这将实时获取视觉背后的内容并将其提供给效果源。在这种情况下，视觉背后的任何东西都会模糊不清。

<强>性能

如果您只是模糊单个图像，最好模糊单个表面。您应该尝试仅在真正需要时使用BackdropBrush。

告诉我更多信息！

要了解详情，请访问我们的GitHub page！我们已经创建了一个自定义XAML控件，可以帮助您here，您可以在行动here中看到它。您还可以看到// build talk here。

UWP App使用DX Compositor实时模糊背景

1 个答案: