DropShadow DropShadow DropShadow DropShadow Class

Definition

Some information relates to pre-released product which may be substantially modified before it’s commercially released. Microsoft makes no warranties, express or implied, with respect to the information provided here.

Prerelease APIs are identified by a Prerelease label.

[Contains prerelease APIs.]
A drop shadow cast by a SpriteVisual.

public : sealed class DropShadow : CompositionShadow, IDropShadow, IDropShadow2public sealed class DropShadow : CompositionShadow, IDropShadow, IDropShadow2Public NotInheritable Class DropShadow Inherits CompositionShadow Implements IDropShadow, IDropShadow2// This API is not available in Javascript.
Inheritance
Attributes
Windows 10 requirements
Device family
Windows 10 Anniversary Edition (introduced v10.0.14393.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v3)

Inherited Members

Inherited methods

Inherited properties

Examples

Simple DropShadow


private async void InitComposition()
{
  _compositor = ElementCompositionPreview.GetElementVisual(MyGrid).Compositor;
  _imageLoader = ImageLoaderFactory.CreateImageLoader(_compositor);

  //Create surface brush and load image
  CompositionSurfaceBrush surfaceBrush = _compositor.CreateSurfaceBrush();
  surfaceBrush.Surface = await _imageLoader.LoadImageFromUriAsync(new Uri("ms-appx:///Assets/cat.jpg"));

  //Create sprite visual
  SpriteVisual visual = _compositor.CreateSpriteVisual();
  visual.Brush = surfaceBrush;
  visual.Size = new Vector2(270, 200);

  //Create drop shadow
  DropShadow shadow = _compositor.CreateDropShadow();
  shadow.BlurRadius = 5;
  shadow.Offset = new Vector3(15, 15, -10);
  shadow.Color = Colors.DarkGray;

  //Associate shadow with visual
  visual.Shadow = shadow;
}         

DropShadow with Animations


private async void InitComposition()
{
  _compositor = ElementCompositionPreview.GetElementVisual(MyGrid).Compositor;
  _imageLoader = ImageLoaderFactory.CreateImageLoader(_compositor);

  //Create surface brush and load image
  CompositionSurfaceBrush surfaceBrush = _compositor.CreateSurfaceBrush();
  surfaceBrush.Surface = await _imageLoader.LoadImageFromUriAsync(new Uri("ms-appx:///Assets/cat.jpg"));

  //Create sprite visual
  SpriteVisual visual = _compositor.CreateSpriteVisual();
  visual.Brush = surfaceBrush;
  visual.Size = new Vector2(270, 200);

  //Create drop shadow
  DropShadow shadow = _compositor.CreateDropShadow();
  shadow.BlurRadius = 5;
  shadow.Offset = new Vector3(15, 15, -10);
  shadow.Color = Colors.DarkGray;

  //Create animations
  ScalarKeyFrameAnimation blurAnimation = this.CreateBlurAnimation();
  Vector3KeyFrameAnimation offsetAnimation = this.CreateOffsetAnimation();

  //Apply animations
  shadow.StartAnimation("BlurRadius", blurAnimation);
  shadow.StartAnimation("Offset", offsetAnimation);

  //Associate shadow with visual
  visual.Shadow = shadow;
}

private ScalarKeyFrameAnimation CreateBlurAnimation()
{
  ScalarKeyFrameAnimation shadowBlurAnimation = _compositor.CreateScalarKeyFrameAnimation();
  shadowBlurAnimation.InsertKeyFrame(0.0f, 5.0f);
  shadowBlurAnimation.InsertKeyFrame(0.5f, 20.0f);
  shadowBlurAnimation.InsertKeyFrame(1.0f, 5.0f);
  shadowBlurAnimation.Duration = TimeSpan.FromSeconds(2);
  shadowBlurAnimation.IterationBehavior = AnimationIterationBehavior.Forever;

  return shadowBlurAnimation;
}

private Vector3KeyFrameAnimation CreateOffsetAnimation()
{
  Vector3 startOffset = new Vector3(15, 15, -10);
  Vector3 endOffset = new Vector3(30, 30, -20);

  Vector3KeyFrameAnimation offsetAnimation = _compositor.CreateVector3KeyFrameAnimation();
  offsetAnimation.InsertKeyFrame(0.0f, startOffset);
  offsetAnimation.InsertKeyFrame(0.5f, endOffset);
  offsetAnimation.InsertKeyFrame(1.0f, startOffset);
  offsetAnimation.Duration = TimeSpan.FromSeconds(2);
  offsetAnimation.IterationBehavior = AnimationIterationBehavior.Forever;

  return offsetAnimation;
}         

Remarks

Shadows are not clipped by the implicit clip set on the visual (based on size of the visual). However, shadows respect the explicit clip set on the visual using SpriteVisual.Clip Property.

Properties

BlurRadius BlurRadius BlurRadius BlurRadius

The radius of the Gaussian blur used to generate the shadow. Animatable.

public : float BlurRadius { get; set; }public float BlurRadius { get; set; }Public ReadWrite Property BlurRadius As float// This API is not available in Javascript.
Value
float float float float

The radius of the Gaussian blur used to generate the shadow. Defaults to 9.0f. Specifying a value of 0 will result in no blur occurring.

Remarks

This property is animatable and can be associated with a KeyFrameAnimation or ExpressionAnimation using CompositionObject.StartAnimation.

Color Color Color Color

The color of the shadow. Animatable.

public : Color Color { get; set; }public Color Color { get; set; }Public ReadWrite Property Color As Color// This API is not available in Javascript.
Value
Color Color Color Color

The color of the shadow. Default color is Colors.Black.

Remarks

This property is animatable and can be associated with a KeyFrameAnimation or ExpressionAnimation using CompositionObject.StartAnimation.

Mask Mask Mask Mask

Brush used to specify an opacity mask for the shadow. Defaults to the SpriteVisual's brush. Animatable.

public : CompositionBrush Mask { get; set; }public CompositionBrush Mask { get; set; }Public ReadWrite Property Mask As CompositionBrush// This API is not available in Javascript.
Value
CompositionBrush CompositionBrush CompositionBrush CompositionBrush

Brush used to specify an opacity mask for the shadow. Defaults to the SpriteVisual's brush.

Remarks

A non-rectangular shadow can be casted by setting the Mask of the Shadow property to a SurfaceBrush that represents the shape.

This property is animatable and can be associated with a KeyFrameAnimation or ExpressionAnimation using CompositionObject.StartAnimation.

Offset Offset Offset Offset

Offset of the shadow relative to its SpriteVisual. Animatable.

public : Vector3 Offset { get; set; }public Vector3 Offset { get; set; }Public ReadWrite Property Offset As Vector3// This API is not available in Javascript.
Value
Vector3 Vector3 Vector3 Vector3

Offset of the shadow relative to its SpriteVisual.

Remarks

This property is animatable and can be associated with a KeyFrameAnimation or ExpressionAnimation using CompositionObject.StartAnimation.

Opacity Opacity Opacity Opacity

The opacity of the shadow. Animatable.

public : float Opacity { get; set; }public float Opacity { get; set; }Public ReadWrite Property Opacity As float// This API is not available in Javascript.
Value
float float float float

The opacity of the shadow.

Remarks

This property is animatable and can be associated with a KeyFrameAnimation or ExpressionAnimation using CompositionObject.StartAnimation.

SourcePolicy SourcePolicy SourcePolicy SourcePolicy

Prerelease. Used to define the shadow masking policy to be used for the shadow.

public : CompositionDropShadowSourcePolicy SourcePolicy { get; set; }public CompositionDropShadowSourcePolicy SourcePolicy { get; set; }Public ReadWrite Property SourcePolicy As CompositionDropShadowSourcePolicy// This API is not available in Javascript.
Additional features and requirements
Device family
Windows 10 Insider Preview (introduced v10.0.16257.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v5)

See Also