Search code examples
c#xamluwpwin2d

Win2D drop shadow looks jagged

I'm trying to create a drop shadow in UWP app with Win2D package. It's line-for-line from docs (https://learn.microsoft.com/en-us/windows/uwp/composition/using-the-visual-layer-with-xaml). Why does the shadow look like this instead of being smooth:

enter image description here

Xaml:

<Grid >
  <Border x:Name="ShadowHost" />
  <Border Width="562" Height="250" Background="White" />
</Grid>

C#:

private void OnLoaded(object sender, RoutedEventArgs e)
{
    Compositor shadowCompositor;
    Visual hostVisual;

    hostVisual = ElementCompositionPreview.GetElementVisual(this.ShadowHost);
    shadowCompositor = hostVisual.Compositor;

    var dropShadow = shadowCompositor.CreateDropShadow();
    dropShadow.Offset = new Vector3(0, 16, 0);
    dropShadow.BlurRadius = 80.0f;
    dropShadow.Color = Color.FromArgb(128, 0, 0, 0);

    var spriteVisual = shadowCompositor.CreateSpriteVisual();
    spriteVisual.Size = new Vector2(562f, 250f);
    spriteVisual.Shadow = dropShadow;

    ElementCompositionPreview.SetElementChildVisual(this.ShadowHost, spriteVisual);

    var bindSizeAnimation = shadowCompositor.CreateExpressionAnimation("hostVisual.Size");
    bindSizeAnimation.SetReferenceParameter("hostVisual", hostVisual);
    spriteVisual.StartAnimation("Size", bindSizeAnimation);
    }
Solution

  • The same code creates the following output when using the latest SDK 17763: enter image description here Looks like a smooth output. You may need to either check the target SDK version or driver / graphics card like Johnny mentioned.