如何在弹出窗口周围添加阴影

时间:2017-04-09 14:44:18

标签: c# xaml uwp dropshadow windows-community-toolkit

如何在UWP中的弹出按钮周围添加投影?

我在UWP社区工具包中尝试使用DropShadowPanel来包装弹出窗口,但它没有显示弹出按钮。我怎样才能实现它,以便投影与幻影一起显示和消失?谢谢!

<Flyout x:Name="Flyout" Placement="Bottom">
    <TextBlock Text="Error message" />
</Flyout>

1 个答案:

答案 0 :(得分:2)

您必须将DropShadowPanel添加到FlyoutPresenter,而不是Flyout本身。

<Flyout>
    <Flyout.FlyoutPresenterStyle>
        <Style TargetType="FlyoutPresenter">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>

                        <!-- This is the root visual of the flyout -->

                        <toolkit:DropShadowPanel>
                            <Border Background="LightGray" Padding="12">
                                <ContentPresenter />
                            </Border>
                        </toolkit:DropShadowPanel>

                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Flyout.FlyoutPresenterStyle>

    <TextBlock Text="Error message" />
</Flyout>