WPF如何将弹出窗口附加到简单的UI元素（如矩形）？

Question

WPF如何将弹出窗口附加到简单的UI元素（如矩形）？

3

我花了几个小时才找到这个问题的答案，所以我想写一个FAQ或者答案来分享我的发现。(它基于以下线程 Binding Textbox IsFocused to Popup IsOpen plus additional conditions)

我找到了很多将弹出窗口绑定到类似切换按钮和其他基于窗口chrome并具有内置触发器的东西的示例。但在我的应用程序中，我想将弹出窗口绑定到一个简单的矩形，它具有自定义笔刷填充。我找不到一个示例，说明如何在用户悬停在矩形上时打开并保持弹出窗口打开状态。

因此，我发布了这个问题，并立即发布我找到的答案，希望其他人也可以从中受益。如果有人能帮助我理解stackoverflow是否允许这样的帖子，或者我应该采取更好的方式，请告诉我并标记一个答案。 编辑1) 我不能自我回答8个小时，所以这里是工作代码：以下是一个简单的示例，演示如何在基本UIElement（如矩形/椭圆等）上使用弹出窗口…

<Grid HorizontalAlignment="Stretch" Height="Auto">
    <Rectangle x:Name="PopupRec"
               Grid.Row="0"
               Width="20" Height="20"
               HorizontalAlignment="Right" 
               Fill="Gray" Margin="0,0,0,10" />
    <Popup x:Name="SortPopup" 
           PlacementTarget="{Binding ElementName=PopupRec}" 
           StaysOpen="False" 
           PopupAnimation="Slide" 
           AllowsTransparency="True">
        <Border Background="White" Padding="15">
            <StackPanel Orientation="Vertical">
                <Button Command="{Binding MyCommand}" CommandParameter="5">5</Button>
                <Button Command="{Binding MyCommand}" CommandParameter="10">10</Button>
                <Button Command="{Binding MyCommand}" CommandParameter="15">15</Button>
                <Button Command="{Binding MyCommand}" CommandParameter="20">20</Button>
            </StackPanel>
        </Border>
        <Popup.Style>
            <Style TargetType="{x:Type Popup}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=PopupRec, Path=IsMouseOver}" Value="True">
                        <Setter Property="IsOpen" Value="True" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding ElementName=SortPopup, Path=IsMouseOver}" Value="True">
                        <Setter Property="IsOpen" Value="True" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Popup.Style>
    </Popup>
</Grid>

只需将此内容粘贴到窗口/用户控件等内部即可...

- J King

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Clemens · Accepted Answer

我建议以下改进。这将使弹出式样独立于任何元素名称，并使您能够通过将其放入窗口或用户控件的资源中使用它作为默认样式。

<Style TargetType="{x:Type Popup}">
    <Style.Triggers>
        <DataTrigger Binding="{Binding Path=IsMouseOver,
                               RelativeSource={RelativeSource Self}}"
                     Value="True">
            <Setter Property="IsOpen" Value="True" />
        </DataTrigger>
        <DataTrigger Binding="{Binding Path=PlacementTarget.IsMouseOver,
                               RelativeSource={RelativeSource Self}}"
                     Value="True">
            <Setter Property="IsOpen" Value="True" />
        </DataTrigger>
    </Style.Triggers>
</Style>

请注意，Rectangle不是“基本的UIElement” 。它是一个形状(Shape)，而形状本身是FrameworkElement。