Как размыть фон сетки на 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; 
} 

Если вы хотите узнать больше об этом, here is the MSDN page.

Answer 2

Вы можете применить размытие, используя API-интерфейс Composition с обновлением Windows 10 Anniversary. Однако, если вы пытаетесь размыть все, что находится за окном или приложением, это будет невозможно. С другой стороны, если у вас есть что-то вроде картинки за сеткой и хотите, чтобы изображение было размыто, это сработает.

Я написал ответ на аналогичный вопрос here.

Answer 3

Использовать Blur от UWPCommunityToolkit.

<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 Hamburger Menu with Frosted glass effect and Swipe to Open/Close.