Share via


DropShadow Class

Definition

A drop shadow cast by a SpriteVisual or LayerVisual.

public ref class DropShadow sealed : CompositionShadow
/// [Windows.Foundation.Metadata.ContractVersion(Windows.Foundation.UniversalApiContract, 196608)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class DropShadow final : CompositionShadow
[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 196608)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public sealed class DropShadow : CompositionShadow
Public NotInheritable Class DropShadow
Inherits CompositionShadow
Inheritance
Object Platform::Object IInspectable CompositionObject CompositionShadow DropShadow
Attributes

Windows requirements

Device family
Windows 10 Anniversary Edition (introduced in 10.0.14393.0)
API contract
Windows.Foundation.UniversalApiContract (introduced in v3.0)

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;
}         

DropShadow using CompositionDropShadowSourcePolicy to inherit alpha from the Visual's brush

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

  //Create surface brush and load image
  CompositionSurfaceBrush surfaceBrush = _compositor.CreateSurfaceBrush();
  surfaceBrush.Surface = LoadedImageSurface.StartLoadFromUri(new Uri("ms-appx:///Assets/circle.png"));

  //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;

  //Specify mask policy for shadow
  shadow.SourcePolicy = CompositionDropShadowSourcePolicy.InheritFromVisualContent;

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

Remarks

DropShadows are a common way to provide an indication of depth in application UI. To add a DropShadow, create an instance of DropShadow and attach it using the .Shadow property on a SpriteVisual or LayerVisual.

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.

Version history

Windows version SDK version Value added
1709 16299 SourcePolicy

Properties

BlurRadius

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

Color

The color of the shadow. Animatable.

Comment

A string to associate with the CompositionObject.

(Inherited from CompositionObject)
Compositor

The Compositor used to create this CompositionObject.

(Inherited from CompositionObject)
Dispatcher

The dispatcher for the CompositionObject.

(Inherited from CompositionObject)
DispatcherQueue

Gets the DispatcherQueue for the CompostionObject.

(Inherited from CompositionObject)
ImplicitAnimations

The collection of implicit animations attached to this object.

(Inherited from CompositionObject)
Mask

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

Offset

Offset of the shadow relative to its SpriteVisual. Animatable.

Opacity

The opacity of the shadow. Animatable.

Properties

The collection of properties associated with the CompositionObject.

(Inherited from CompositionObject)
SourcePolicy

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

Methods

Close()

Closes the CompositionObject and releases system resources.

(Inherited from CompositionObject)
ConnectAnimation(String, CompositionAnimation)

Connects and animation.

(Inherited from CompositionObject)
DisconnectAnimation(String)

Disconnects an animation.

(Inherited from CompositionObject)
Dispose()

Performs application-defined tasks associated with freeing, releasing, or resetting unmanaged resources.

(Inherited from CompositionObject)
PopulatePropertyInfo(String, AnimationPropertyInfo)

Defines a property that can be animated.

(Inherited from CompositionObject)
StartAnimation(String, CompositionAnimation, AnimationController)

Connects an animation with the specified property of the object and starts the animation.

(Inherited from CompositionObject)
StartAnimation(String, CompositionAnimation)

Connects an animation with the specified property of the object and starts the animation.

(Inherited from CompositionObject)
StartAnimationGroup(ICompositionAnimationBase)

Starts an animation group.

The StartAnimationGroup method on CompositionObject lets you start CompositionAnimationGroup. All the animations in the group will be started at the same time on the object.

(Inherited from CompositionObject)
StopAnimation(String)

Disconnects an animation from the specified property and stops the animation.

(Inherited from CompositionObject)
StopAnimationGroup(ICompositionAnimationBase)

Stops an animation group.

(Inherited from CompositionObject)
TryGetAnimationController(String)

Returns an AnimationController for the animation running on the specified property.

(Inherited from CompositionObject)

Applies to

See also