如何为WPF Popup添加样式（类似iTunes的弹出窗口）

Question

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

- user3243854

Answer 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事件添加到整个窗口：

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

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

- Bizhan

---

我在WPF方面只是一个初学者，如果您有时间，能否给我提供一个带有此代码的示例项目？我不知道在哪里使用所有内容，但我想我只会使用具有自定义背景的网格，看起来像弹出窗口，并且我将使用窗口鼠标按下来关闭它。我不知道我可以在WPF中这样做，谢谢。 - user3243854

如果你是WPF的新手，我强烈建议你熟悉MVVM模式。WPF和MVVM在一起非常棒！ - Bizhan