1

我正在尝试在我的 UWP 应用程序中为背景图像添加模糊效果。我可以使用此代码毫无问题地向图像添加蓝色(我实际上是在运行时将其应用于从网络动态加载的图像)

<Image Source="Assets/Photos/BisonBadlandsChillin.png"
       Width="100"
       Height="100">
       <interactivity:Interaction.Behaviors>
           <behaviors:Blur x:Name="blurry"
                             Value="10"
                             Duration="100"
                             Delay="0"
                             AutomaticallyStart="True" />
       </interactivity:Interaction.Behaviors>

但是我想将模糊添加到背景中的图像,特别是RelativePanel的背景。但是,RelativePanel 的背景只会在其内容中使用 ImageBrush,每当我尝试将 Community Toolkit 中的相同行为添加到 ImageBrush 时,我都会收到错误消息:

无法将“Microsoft.Toolkit.Uwp.UI.Animations.Behaviors.Blur”类型的实例添加到“Microsoft.Xaml.Interactivity.BehaviorCollection”类型的集合中

有没有办法仍然使用工具包?

4

1 回答 1

0

模糊动画行为通过增加或减少像素大小来选择性地模糊XAML 元素。ImageBrush不是XAML element。所以我认为你不能通过它为 imagebrush 添加模糊。

如果你想为 uwp 添加模糊,Imagebrush你可以使用Win2D。GaussianBlurEffect 可以用来创建一个非常酷的模糊效果,可以让我们在你的应用程序中看起来像 Frosted Glass

private async void AddBrushToPanel(ImageBrush brush, Panel panel)
{
var file = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Assets/image.jpg"));
using (var stream = await file.OpenAsync(FileAccessMode.Read))
    {
        var device = new CanvasDevice();
        var bitmap = await CanvasBitmap.LoadAsync(device, stream);

        var renderer = new CanvasRenderTarget(device,
                                              bitmap.SizeInPixels.Width,
                                              bitmap.SizeInPixels.Height, bitmap.Dpi);
        using (var ds = renderer.CreateDrawingSession())
        {
            var blur = new GaussianBlurEffect();
            blur.BlurAmount = 5.0f;
            blur.Source = bitmap;
            ds.DrawImage(blur);
        }
        stream.Seek(0);
        await renderer.SaveAsync(stream, CanvasBitmapFileFormat.Jpeg);
        BitmapImage image = new BitmapImage();
        image.SetSource(stream);
        brush.ImageSource = image;
        panel.Background = brush;
    }
}
于 2017-01-05T01:03:55.003 回答