【问题标题】:UWP App realtime blur background using DX CompositorUWP App 使用 DX Compositor 实时模糊背景
【发布时间】:2017-09-06 15:08:37
【问题描述】:

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

我不想使用RenderTargetBitmap(想让我的 UI 线程保持空闲)。如何仅使用组合 API 来做到这一点:

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

// what next?

非常感谢任何帮助:)

【问题讨论】:

  • 我会等到 //Build(明天开始) - 我怀疑那里会宣布一些有助于模糊 UWP 的内容。
  • 好吧,他们可能会,但我不在参加构建的富人中,所以有人可能也会分享????
  • 它将被流式传输,至少是其中的一部分,并且 channel9 将托管所有后续的会话 :)
  • 一直在经历一个又一个至今没有消息????

标签: c# directx win-universal-app composition uwp-xaml


【解决方案1】:

注意:这些功能(模糊和背景画笔)需要 Windows 10 周年更新。您目前可以通过 Windows Insider Program 获得 SDK 的预览

先决条件

  1. 针对 Windows 10 周年更新
  2. 基本了解可视层以及可视树的工作原理。你可以找到更多here

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

开始

您可以通过两种方式在合成 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

【讨论】:

  • 我真的很想看看这些示例,但我无法在 Visual Studio 中加载任何项目。我有最新版本的 VS2015 和 Update 2,它不断弹出消息说一个或多个项目需要一个未安装在我的系统 (10.0.14332.0) 上的平台 SDK。在消息对话框中有一个安装 SDK 的链接,但是当我点击它时,它会导致 Microsoft 官方主页。
  • erotavlas,您是否查看过此 wiki 页面上的已知问题部分:https://github.com/Microsoft/WindowsUIDevLabs/wiki/Insider-FAST?我会将您系统的 Windows 构建与您安装的 SDK 进行比较,并确保它们匹配。此外,您可能必须打开 csproj 文件并编辑目标和最小内部版本号以匹配您所拥有的。
猜你喜欢
  • 2016-06-14
  • 1970-01-01
  • 2018-04-24
  • 1970-01-01
  • 2018-01-29
  • 1970-01-01
  • 1970-01-01
  • 2021-01-15
  • 2017-07-17
相关资源
最近更新 更多