如何在UWP上模糊網格背景？

Question

grid background="white"

現在，我想模糊它，例如ios上的模糊。

Answer 1

不透明度不是模糊效果。 要制作純模糊效果，可以使用RendertargetBitmap或Win2D。

我更喜歡使用Win2D，因為高斯模糊效果是顯式的，並且可以進行更精確的配置：

using (var stream = await Content.RenderToRandomAccessStream())
{
    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.Png);

    BitmapImage image = new BitmapImage();
    image.SetSource(stream);
    paneBackground.ImageSource = image;
}

如果您想了解更多信息，請訪問MSDN頁面 。

Answer 2

您可以使用帶有Windows 10周年更新的Composition API來應用模糊處理。 但是，如果您試圖模糊窗口或應用程序后面的內容，則將無法實現。 另一方面，如果網格后面有類似圖片的圖片，並且希望圖片模糊，則可以使用該圖片。

我在這里寫了一個類似問題的答案。

Answer 3

使用UWPCommunityToolkit的 Blur 。

<Grid>
    <Grid>
        <interactivity:Interaction.Behaviors>
            <behaviors:Blur x:Name="BlurBehavior" Value="25" Duration="0" 
                              Delay="0" AutomaticallyStart="True"/>
        </interactivity:Interaction.Behaviors>
    </Grid>
    <Grid>
        <!-- Your Content -->
    </Grid>
</Grid>

如果要增加或減少模糊量，請更改行為值。

如果您需要任何代碼示例，請查看此GitHub項目。 具有磨砂玻璃效果的UWP漢堡菜單，輕掃即可打開/關閉 。