UWP：在 XAML 中创建阴影 [重复]答案

【问题标题】：UWP: Create shadow in XAML [duplicate]UWP：在 XAML 中创建阴影 [重复]
【发布时间】：2018-02-13 15:07:48
【问题描述】：

我目前正在尝试在 UWP 中创建一个带有两个椭圆元素的圆形按钮，并希望其中一个以某个角度投射阴影。我在 WPF 中找到了一种方法，如下所示：

WPF XAML：

<Ellipse>
  <Ellipse.BitmapEffect>
    <DropShadowBitmapEffect Color="Black" Direction="-50" ShadowDepth="50" Softness=".7"/>
  </Ellipse.BitmapEffect>
</Ellipse>

UWP 中的等价物是什么？

【问题讨论】：

标签： c# wpf xaml uwp uwp-xaml

【解决方案1】：

最简单的方法是使用 UWP 社区工具包中的DropShadowPanel。

所以先安装

安装包 Microsoft.Toolkit.Uwp.UI.Controls -Version 2.0.0

然后在您的 XAML 中使用以下代码

<controls:DropShadowPanel Color="Black"
                          OffsetX="-50"
                          OffsetY="-50"
                          BlurRadius="50"
                          ShadowOpacity=".7"
                          Width="120"
                          Height="120"
                          HorizontalContentAlignment="Stretch"
                          VerticalContentAlignment="Stretch">
    <Ellipse />
</controls:DropShadowPanel>

【讨论】：

快速正确的回答，非常感谢！
我在这里做错了什么？我以为我做了你说的一切...... :-/ i.imgur.com/gGZRoGe.png
@kayleeFrye_onDeck 您需要从 nuget 安装工具包。
@JustinXL 我做了......我确实做了你在回答中所说的一切，这就是为什么我问我做错了什么。我在VS中使用了包管理控制台，然后你可以在截图中看到我做了什么。
也尝试更新 nuget 包。现在至少是 5.0。

【解决方案2】：

在 UWP 中有一个不同的组件来完成这项工作。它被称为 Composition API，在 NuGet 包“Win2D.uwp”中可用。

基本上你需要为你的视觉对象获取合成器

_compositor = ElementCompositionPreview.GetElementVisual(this).Compositor;

并使用合成器创建投影。

_compositor = ElementCompositionPreview.GetElementVisual(this).Compositor;

// create a red sprite visual
var myVisual = _compositor.CreateSpriteVisual();
myVisual.Brush = _compositor.CreateColorBrush(Colors.Red);
myVisual.Size = new System.Numerics.Vector2(100, 100);

// create a blue drop shadow
var shadow = _compositor.CreateDropShadow();
shadow.Offset = new System.Numerics.Vector3(30, 30, 0);
shadow.Color = Colors.Blue;
myVisual.Shadow = shadow;

// render on page
ElementCompositionPreview.SetElementChildVisual(this, myVisual);

不利的一面是，这不是很直接。您可以使用不同的画笔来显示图像、纯色或其他东西，它不适用于屏幕上现有的视觉效果（据我所知）。您可以阅读有关基础知识的更多信息here。你可能需要使用表面刷，它可以容纳各种不同的视觉类型，如图像。不过，目前看起来并没有现成的椭圆组件。

另外，还有一个 xaml 扩展，它将使用纯 xaml 为您完成所有这些工作，might be worth a shot 并且可能还支持省略号。

作为结束说明，所有这些目前都是微软部分正在进行的工作，将来应该成为 UWP API 的原生部分。

【讨论】：