如何以延迟打开WPF弹出窗口？

时间：2010-01-12 20:20:49

标签： wpf wpf-controls popup delay

我只是想延迟打开WPF Popup，有点像ToolTip。

我怎样才能做到这一点？

顺便说一下，Popup.PopupAnimation = PopupAnimation.Fade ...过快地消失了。我想要至少半秒钟。

5 个答案:

答案 0 :(得分：12)

您可以通过以下方式创建要应用于Popup的样式：

<Style x:Key="TooltipPopupStyle" TargetType="Popup">
    <Style.Triggers>
        <DataTrigger Binding="{Binding PlacementTarget.IsMouseOver, RelativeSource={RelativeSource Self}}" Value="True">
            <DataTrigger.EnterActions>
                <BeginStoryboard x:Name="OpenPopupStoryBoard" >
                    <Storyboard>
                        <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="IsOpen" FillBehavior="HoldEnd">
                            <DiscreteBooleanKeyFrame KeyTime="0:0:0.25" Value="True"/>
                        </BooleanAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.EnterActions>
            <DataTrigger.ExitActions>
                <PauseStoryboard BeginStoryboardName="OpenPopupStoryBoard"/>
                <BeginStoryboard x:Name="ClosePopupStoryBoard">
                    <Storyboard>
                        <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="IsOpen" FillBehavior="HoldEnd">
                            <DiscreteBooleanKeyFrame KeyTime="0:0:1" Value="False"/>
                        </BooleanAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.ExitActions>
        </DataTrigger>

        <Trigger Property="IsMouseOver" Value="True">
            <Trigger.EnterActions>
                <PauseStoryboard BeginStoryboardName="ClosePopupStoryBoard" />
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <PauseStoryboard BeginStoryboardName="OpenPopupStoryBoard"/>
                <ResumeStoryboard BeginStoryboardName="ClosePopupStoryBoard" />
            </Trigger.ExitActions>
        </Trigger>
    </Style.Triggers>
</Style>

然后，只要你想使用它，你就会写出与此类似的标记（注意PlacementTarget的绑定）：

<TextBlock x:Name="TargetControl" Text="Hover over me!" />
<Popup PlacementTarget="{Binding ElementName=TargetControl}" Style="{StaticResource TooltipPopupStyle}">
    <Border BorderBrush="Red" BorderThickness="1" Background="White">
        <TextBlock Text="This is a Popup behaving somewhat like the tooltip!" Margin="10" />
    </Border>
</Popup>

答案 1 :(得分：10)

答案cplotts粘贴是好的，但可能不适用于你的情况，因为它将动画附加到IsOpen属性，有效地将其锁定到位并防止通过直接属性设置，绑定和其他方式更改它。这可能会使您难以使用代码，具体取决于您的使用方式。

如果是这种情况，当你想在延迟一段时间后打开弹出窗口时，我会切换到启动DispatcherTimer，如下所示：

_popupTimer = new DispatcherTimer(DispatcherPriority.Normal);
_popupTimer.Interval = TimeSpan.FromMilliseconds(100);
_popupTimer.Tick += (obj, e) =>
{
  _popup.IsOpen = true;
};
_popupTimer.Start();

对于类似ToolTip的行为，可以在MouseEnter上完成。如果由于某种原因想要取消弹出窗口（例如，如果鼠标在弹出窗口出现之前离开控件），只需：

_popupTimer.Stop();

<强>更新

在注释中观察到cplotts时，您还需要在MouseLeave事件中的某些情况下设置_popup.IsOpen = false，具体取决于您在控件和弹出窗口之间处理鼠标进入/退出事件的逻辑。请注意，您通常不希望在每个MouseLeave事件上盲目地设置IsOpen=false，因为当弹出窗口出现在它上面时它可能会这样做。在某些情况下，这会导致闪烁的弹出窗口。所以你需要一些逻辑。

答案 2 :(得分：8)

首先......这个答案的功劳归于Eric Burke。他在WPF门徒小组中发布了这个问题answered。我认为将这个答案放在StackOverflow上会很有用。

基本上，您需要使用DiscreteBooleanKeyFrame为Popup的IsOpen属性设置动画。

查看以下xaml（可以轻松粘贴到Kaxaml或其他松散的xaml编辑工具中）：

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
>
    <ContentPresenter>
        <ContentPresenter.ContentTemplate>
            <DataTemplate>
                <Grid>
                    <CheckBox
                        x:Name="cb"
                        Width="100"
                        Height="40"
                        Content="Hover Over Me"
                    />
                    <Popup
                        x:Name="popup"
                        Placement="Bottom"
                        PlacementTarget="{Binding ElementName=cb}"
                    >
                        <Border Width="400" Height="400" Background="Red"/>
                    </Popup>
                </Grid>
                <DataTemplate.Triggers>
                    <Trigger SourceName="cb" Property="IsMouseOver" Value="True">
                        <Trigger.EnterActions>
                            <BeginStoryboard x:Name="bsb">
                                <Storyboard>
                                    <BooleanAnimationUsingKeyFrames
                                        Storyboard.TargetName="popup"
                                        Storyboard.TargetProperty="IsOpen"
                                        FillBehavior="HoldEnd"
                                    >
                                        <DiscreteBooleanKeyFrame KeyTime="0:0:0.5" Value="True"/>
                                     </BooleanAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.EnterActions>
                        <Trigger.ExitActions>
                            <StopStoryboard BeginStoryboardName="bsb"/>
                        </Trigger.ExitActions>
                    </Trigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </ContentPresenter.ContentTemplate>
    </ContentPresenter>
</Page>

请注意我稍微修改了他的原始解决方案......在鼠标悬停时触发IsOpen而不是检查CheckBox。所有人都试图让Popup表现得像ToolTip。

答案 3 :(得分：0)

System.Windows.Controls.ToolTip tp = new System.Windows.Controls.ToolTip();

System.Windows.Threading.DispatcherTimer tooltipTimer =
    new System.Windows.Threading.DispatcherTimer
    (
        System.Windows.Threading.DispatcherPriority.Normal
    );

private void TooltipInvalidCharacter()
{
    tp.Content =
        "A flie name cannot contain any of the following character :" +
        "\n" + "\t" + "\\  / : *  ?  \"  <  >  |";

    tooltipTimer.Interval = TimeSpan.FromSeconds(5);
    tooltipTimer.Tick += new EventHandler(tooltipTimer_Tick);
    tp.IsOpen = true;
    tooltipTimer.Start();       
}

void tooltipTimer_Tick(object sender, EventArgs e)
{
     tp.IsOpen = false;
     tooltipTimer.Stop();
}

答案 4 :(得分：0)

您可以为此解决方案扩展XAML，以便只要鼠标悬停在弹出窗口上，弹出窗口就会保持打开状态，然后自动消失。

我按如下方式修改了样本：

  1. 创建一个“ClosePopop”动画，在0.5秒后将IsOpen设置为False。我把它作为资源，因为它使用了两次。
  2. 对于控件的IsMouseOver触发器，添加一个启动ClosePopup动画的ExitAction。这使用户有机会在关闭之前将鼠标移动到弹出窗口上。我将此动画命名为“bxb”
  3. 将弹出按钮添加到弹出窗口的IsMouseOver属性中。在鼠标悬停时，停止（但不删除）原始的“bxb”ClosePopup动画。这使弹出窗口可见;删除动画会使弹出窗口关闭。
  4. 在弹出窗口的鼠标输出上，启动一个新的ClosePopup动画，然后删除“bxb”动画。最后一步很关键，因为否则第一个停止的“bxb”动画将保持弹出窗口打开。

    5. 此版本在鼠标悬停时将蓝色变为蓝色，因此您可以使用Kaxaml查看事件序列。

    <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 <DataTemplate x:Key="TooltipPopup">
  <Grid>
    <CheckBox
        x:Name="cb"
        Width="100"
        Height="40"
        Content="Hover Over Me"/>
    <Popup
        x:Name="popup"
        Placement="Bottom"
        PlacementTarget="{Binding ElementName=cb}">
        <Border x:Name="border" Width="400" Height="400" Background="Red"/>
    </Popup>
  </Grid>
  <DataTemplate.Resources>
    <Storyboard x:Key="ClosePopup">
        <BooleanAnimationUsingKeyFrames
                        Storyboard.TargetName="popup"
                        Storyboard.TargetProperty="IsOpen"
                        FillBehavior="Stop">
            <DiscreteBooleanKeyFrame KeyTime="0:0:0.5" Value="False"/>
        </BooleanAnimationUsingKeyFrames>
    </Storyboard>
  </DataTemplate.Resources>
  <DataTemplate.Triggers>
    <Trigger SourceName="cb" Property="IsMouseOver" Value="True">
        <Trigger.EnterActions>
            <BeginStoryboard x:Name="bsb" >
                <Storyboard>
                    <BooleanAnimationUsingKeyFrames
                        Storyboard.TargetName="popup"
                        Storyboard.TargetProperty="IsOpen"
                        FillBehavior="HoldEnd">
                        <DiscreteBooleanKeyFrame KeyTime="0:0:0.5" Value="True"/>
                    </BooleanAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </Trigger.EnterActions>
        <Trigger.ExitActions>
            <StopStoryboard BeginStoryboardName="bsb"/>
            <BeginStoryboard x:Name="bxb" Storyboard="{StaticResource ClosePopup}"/>
        </Trigger.ExitActions>
    </Trigger>
    <Trigger SourceName="popup" Property="IsMouseOver" Value="True">
        <Setter TargetName="border" Property="Background" Value="Blue"/>
        <Trigger.EnterActions>
            <StopStoryboard BeginStoryboardName="bxb"/>
        </Trigger.EnterActions>
        <Trigger.ExitActions>
            <BeginStoryboard Storyboard="{StaticResource ClosePopup}"/>
            <RemoveStoryboard BeginStoryboardName="bxb"/>
        </Trigger.ExitActions>
    </Trigger>
  </DataTemplate.Triggers>
 </DataTemplate>
</Page>
相关问题
最新问题