1

我不是使用 Windows 组合 API 的专家。如何在 UWP 中的控件或布局或任何可视控件上实现 DropShadow，而不DropShadowPanel出于某些目的使用 a。一个附加的例子会很棒。另外请确保阴影效果在控件后面并且不会覆盖它

4

2 回答 2

3

SpriteVisual在您的代码中，您已经从控件的Compositor创建了一个并配置了SpriteVisual的阴影，但是您没有将其设置SpriteVisual为shadowVisualVisual 树的子级，因此您看不到要应用的阴影。您可以将以下代码放在代码块的末尾。

...
ElementCompositionPreview.SetElementChildVisual(Control, shadowVisual);

您的代码将如下所示：

//Control is the control the shadow is applied to. e.g. Button, TextBlock etc.
Compositor compositor = ElementCompositionPreview.GetElementVisual(Control).Compositor;
var shadowVisual = compositor.CreateSpriteVisual();
var dropShadow = compositor.CreateDropShadow();
shadowVisual.Shadow = dropShadow;

//UpdateShadowSize
Vector2 newSize = new Vector2(0, 0);
if (Control is FrameworkElement contentFE)
{
    newSize = new Vector2((float)contentFE.ActualWidth, (float)contentFE.ActualHeight);
    //newSize = new Vector2(200, 60);
}
shadowVisual.Size = newSize;

//Some hardcoded values for now
dropShadow.BlurRadius = 8;
dropShadow.Opacity = 0.3f;
dropShadow.Offset = new Vector3(new Vector2(2, 2), 0);
dropShadow.Color = Windows.UI.Colors.Black;

// Sets a Visual as child of the Control’s visual tree.
ElementCompositionPreview.SetElementChildVisual(Control, shadowVisual);

注意：我将其更改dropShadow.Opacity为0.3f使阴影更清晰。

- -更新 - -

是的，您可以在 MainContent 后面放置一个特殊元素，然后从该元素创建阴影以在 Main 内容后面制作阴影。GetAlphaMask方法应该可行，这里有一个例子，你可以试一试。

xml:

<Grid Loaded="Grid_Loaded">
    <!-- Canvas to create shadow-->
    <Canvas Name="canvas"/>
    <TextBlock x:Name="textBlcok" Text="this is text blcok for test shadow"/>
</Grid>

后面的代码：

private void Grid_Loaded(object sender, RoutedEventArgs e)
{
    //The canvas is the element to create shadow
    var compositor = ElementCompositionPreview.GetElementVisual(canvas).Compositor;
    var dropShadow = compositor.CreateDropShadow();
    dropShadow.Color = Colors.Green;
    dropShadow.BlurRadius = 8;
    dropShadow.Opacity = 20.0f;
    dropShadow.Offset = new Vector3(2.5F, 2.5F, 0);

    //The textBlock is the main content
    var mask = textBlcok.GetAlphaMask();
    dropShadow.Mask = mask;

    var spriteVisual = compositor.CreateSpriteVisual();
    spriteVisual.Size = new Vector2((float)canvas.ActualWidth, (float)canvas.ActualHeight);

    spriteVisual.Shadow = dropShadow;

    ElementCompositionPreview.SetElementChildVisual(canvas, spriteVisual);
}
于 2018-08-21T09:56:17.580 回答
0

https://www.microsoft.com/en-us/p/windows-community-toolkit-sample-app/9nblggh4tlcq

这个应用程序包含许多控件来构建一个漂亮的 uwp 应用程序，它有一个影子库，您可以看到如何在您的项目中实现它并为您提供任何控件的影子

于 2020-02-26T17:14:12.387 回答