样式化 WPF 弹出窗口（就像 iTunes 的弹出窗口一样）答案

【问题标题】：Styling WPF Popup (like popups iTunes has)样式化 WPF 弹出窗口（就像 iTunes 的弹出窗口一样）
【发布时间】：2018-05-22 19:47:47
【问题描述】：

我正在尝试创建一个类似于 iTunes 的弹出窗口，当您单击箭头按钮或单击 upnext 按钮时。谁能帮我在 WPF 中设置这个样式？我可以使用一些代码示例，谢谢

【问题讨论】：

标签： wpf popup itunes

【解决方案1】：

<DataTemplate x:Key="popupStyle">
    <Canvas>
        <ToggleButton Content="test" IsChecked="{Binding IsPopupVisible, Mode=TwoWay}"/>
        <AdornerDecorator Opacity="0" x:Name="adorner" Margin="20,0,0,0">
            <AdornerDecorator.Effect>
                <DropShadowEffect BlurRadius="10" ShadowDepth="0"/>
            </AdornerDecorator.Effect>
            <Grid>
                <Polygon Stroke="Silver" StrokeThickness="2" Fill="#AFFF" Points="0 10 20 0 150 0 150 150 20 150 20 20"/>
                <StackPanel Margin="30,10,10,10">
                    <MenuItem Header="asfsd"/>
                    <MenuItem Header="asfsd"/>
                    <MenuItem Header="asfsd"/>
                    <MenuItem Header="asfsd"/>
                </StackPanel>
            </Grid>
        </AdornerDecorator>
    </Canvas>
    <DataTemplate.Triggers>
        <DataTrigger Binding="{Binding IsPopupVisible}" Value="True">
            <DataTrigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard Duration="0:0:0.3">
                        <DoubleAnimation 
                            Storyboard.TargetName="adorner"
                            Storyboard.TargetProperty="Opacity"
                            Duration="0:0:0.3" To="1"/>
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.EnterActions>
            <DataTrigger.ExitActions>
                <BeginStoryboard>
                    <Storyboard Duration="0:0:0.3">
                        <DoubleAnimation 
                            Storyboard.TargetName="adorner"
                            Storyboard.TargetProperty="Opacity"
                            Duration="0:0:0.3" To="0"/>
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.ExitActions>
        </DataTrigger>
    </DataTemplate.Triggers>
</DataTemplate>

此 DataTemplate 在其 ViewModel 中使用了一个布尔变量，名为 IsPopupVisible。

您可以在如下窗口中使用 DataTemplate：

<Window... MouseDown="Window_MouseDown">
<Window.Resources>
    <DataTemplate x:Key="popupStyle">
        ...
    </DataTemplate>
</Window.Resources>
    <ContentPresenter ContentTemplate="{StaticResource popupStyle}" Content="{Binding}"/>
</Window>

并将 mouseDown 事件添加到整个 Window：

private void Window_MouseDown(object sender, MouseButtonEventArgs e)
{
    IsPopupVisible = false;
}

这样当用户点击其他任何地方时，弹出窗口就会隐藏起来。

【讨论】：

我只是WPF的初学者，如果你有时间，你能给我一个包含这段代码的示例项目吗？无论如何，我不知道在哪里使用所有东西，我想我只是要使用具有自定义背景的网格，看起来像一个弹出窗口，我会使用窗口鼠标关闭它，我没有知道我可以在 wpf 中做到这一点，谢谢
如果您是 WPF 新手，我强烈建议您熟悉 MVVM 模式。 WPF 和 MVVM 是一对很棒的组合！