Question

我有一个带有多个TabItem的TabControl，每个TabItem在内容区域中包含多个部分。当用户将鼠标悬停在任何标签上时，我想显示一个弹出窗口，其中显示该标签中的各个部分列表，并允许用户点击该部分并导航到该部分。

对于这个问题，我需要帮助的部分是当用户将鼠标悬停在每个Tab上时关闭/打开Popup。主要的关键点是：

允许用户将光标移动到Tab中的Popup区域。弹出Popup后，它拒绝在TabItem MouseLeave上关闭。
如果用户从Tab移动到Tab，则应关闭上一个Tab中的Popup，并打开一个新的。
用户只需点击一下即可浏览。这意味着他们不应该“点击”＆＃34;一个选项卡中的弹出窗口，以显示另一个弹出窗口。

我的想法是公开一个DependencyProperty，它会测试鼠标结束的测试，然后触发弹出窗口。

为清晰度而编辑：将鼠标移到选项卡上时，我会显示一个弹出窗口。当我将鼠标移离Tab时，我希望弹出窗口靠近。它必须是Popup（而不是Tooltip），因为用户必须能够点击Popup中的内容。

我已经对TabControl进行了细分和重新模板化，但我想了解如何关闭MouseLeave事件上的Popup。我已经触发了MouseLeave事件，但是当Popup打开时，焦点会转移到Popup，因此TabItem MouseLeave事件没有被正确触发。

Answer 1

只要鼠标离开弹出窗口，您就可以使用 Blend SDK 中的Interaction.Triggers触发弹出窗口关闭。这是一个简短的例子：

<Popup Height="300" x:Name="MyPopup">
        <Label Content="MyLabel"></Label>
        <i:Interaction.Triggers>
            <i:EventTrigger EventName="MouseLeave">
                <ei:ChangePropertyAction TargetObject="{Binding ElementName=MyPopup}" PropertyName="IsOpen" Value="False"/>
            </i:EventTrigger>
        </i:Interaction.Triggers>
</Popup>

您需要以下命名空间：

xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"                  
xmlns:ei="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions"

TabItem - 在悬停时显示弹出窗口

1 个答案: